美文网首页
自定义组合控件

自定义组合控件

作者: Smart_Arvin | 来源:发表于2016-11-12 23:24 被阅读39次

    Android开发在保证性能的前提下,UI必须要酷酷的可以为你的应用加分不少,自定义View的方法中组合控件是经常会用到的,所谓自定义都是有套路。

    下面以创建常见的TitleBar为例讲一下实现流程~

    先上效果图(很简单):

    shortcut.jpg

    步骤:

    • 第一步:自定义布局
    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
         android:layout_width="match_parent" 
         android:layout_height="@dimen/titleBarView_height" 
         android:paddingEnd="5dp" 
         android:gravity="center_vertical" 
         android:background="@android:color/holo_blue_light">   
    
     <ImageButton        
        android:id="@+id/titleBar_leftMenu"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"  
        android:layout_alignParentLeft="true"  
        android:layout_marginStart="-10dp"  
     />    
    <TextView 
          android:id="@+id/titleBar_title"  
          android:layout_width="wrap_content"  
          android:layout_height="wrap_content" 
          android:layout_centerInParent="true" 
          android:gravity="center"   
          android:textColor="@color/white"  
          android:textSize="@dimen/titleBarView_titleSize" 
           />   
    
     <ImageButton  
          android:id="@+id/titleBar_rightMenu"  
          android:layout_width="wrap_content"   
          android:layout_height="wrap_content" 
          android:layout_alignParentEnd="true"
            />
    </RelativeLayout>
    
    • 第二步:声明自定义属性

    如果对自定义属性不熟悉可参考《手摸手教你自定义UI之__自定义控件属性》

    <?xml version="1.0" encoding="utf-8"?><resources>
        <declare-styleable name="TitleBarView" > 
           <attr name="titleName" format="reference|string"/>
           <attr name="leftMenuSrc" format="reference|integer"/>
           <attr name="rightMenuSrc" format="reference|integer"/>
           <attr name="leftMenuVisible" format="boolean"/> 
           <attr name="rightMenuVisible" format="boolean"/>
        </declare-styleable></resources>
    
    • 第三步:代码逻辑实现
    package com.dailymanager.smartarvin.view;
     
    import android.content.Context;
    import android.content.res.TypedArray;
    import android.util.AttributeSet;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.widget.ImageButton;
    import android.widget.RelativeLayout;
    import android.widget.TextView;
     
    import com.dailymanager.smartarvin.dailymanager.R;
     
    /**
     * Todo:自定义TitleBar组合控件
     * Author:Arvin
     * Date:2016/11/12 22:38
     * Email:smartarvin199111@gmail.com
     */
     
    public class TitleBarView extends RelativeLayout {
     
        private Context mContext ;
        private OnMenuClickListener mMenuClickListener ;
     
        private int titleResId ;
        private int leftMenuSrcId ;
        private int rightMenuSrcId ;
        private boolean leftMenuVisible = true ;
        private boolean rightMenuVisible = true;
     
        private ImageButton leftMenu ;
        private TextView title ;
        private ImageButton rightMenu ;
     
        public TitleBarView(Context context) {
            this(context , null);
        }
     
        public TitleBarView(Context context , AttributeSet attrs) {
            super(context , attrs );
            mContext = context ;
            findViews();
            initDefaultStyle(context , attrs);
        }
     
     
        private void findViews() {
            LayoutInflater.from(mContext).inflate(R.layout.view_titlebar, this, true);
            leftMenu = (ImageButton) findViewById(R.id.titleBar_leftMenu);
            title = (TextView) findViewById(R.id.titleBar_title);
            rightMenu = (ImageButton) findViewById(R.id.titleBar_rightMenu);
     
            leftMenu.setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View view) {
                    if (mMenuClickListener != null) {
                        mMenuClickListener.onLeftMenuClick();
                    }
                }
            });
     
            rightMenu.setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View view) {
                    if (mMenuClickListener != null) {
                        mMenuClickListener.onRightMenuClick();
                    }
                }
            });
        }
     
        /**
        * 初始化原始属性
        * params: Context
        * return: void
        * throw: null
        */
        private void initDefaultStyle(Context context , AttributeSet attrs){
            TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.TitleBarView);
            titleResId = a.getResourceId(R.styleable.TitleBarView_titleName , R.string.app_name);
            leftMenuSrcId = a.getResourceId(R.styleable.TitleBarView_leftMenuSrc , R.mipmap.ic_launcher);
            rightMenuSrcId = a.getResourceId(R.styleable.TitleBarView_rightMenuSrc , R.mipmap.ic_launcher);
            leftMenuVisible = a.getBoolean(R.styleable.TitleBarView_leftMenuVisible , true);
            rightMenuVisible = a.getBoolean(R.styleable.TitleBarView_rightMenuVisible , true);
            a.recycle();
     
            title.setText(titleResId);
            leftMenu.setBackgroundResource(leftMenuSrcId);
            rightMenu.setBackgroundResource(rightMenuSrcId);
            leftMenu.setVisibility(leftMenuVisible ? View.VISIBLE : View.GONE);
            rightMenu.setVisibility(rightMenuVisible ? View.VISIBLE : View.GONE);
        }
     
        public void setOnMenuClickListener(OnMenuClickListener mMenuClickListener) {
            this.mMenuClickListener = mMenuClickListener;
        }
     
        /**
          * 自定义监听器回调接口
          * params: null
          * return: null
          * throw: null 
          */
        public interface OnMenuClickListener {
            void onLeftMenuClick();
            void onRightMenuClick();
        }
    }
    
    • 第四步:控件使用
    • XML中引用
    <com.dailymanager.smartarvin.view.TitleBarView  
        android:id="@+id/home_titleBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        apps:titleName="@string/app_name" 
        apps:leftMenuSrc="@mipmap/menu" 
        apps:rightMenuSrc="@mipmap/more"
        apps:leftMenuVisible="true"
        apps:rightMenuVisible="true"
        />
    
    • 代码中使用
    private void findViews() { 
           mTitleBarView = (TitleBarView) findViewById(R.id.home_titleBar);   
           mTitleBarView.setOnMenuClickListener(new     
           TitleBarView.OnMenuClickListener() {
            @Override
            public void onLeftMenuClick() {  
              Toast.makeText(HomeActivity.this, "Left" , Toast.LENGTH_SHORT).show();        
            } 
    
           @Override
            public void onRightMenuClick() {
                Toast.makeText(HomeActivity.this, "Right" , Toast.LENGTH_SHORT).show();       
             }    
          });
    }
    

    自定义组合控件很简单,不用执行重复绘制view等复杂逻辑,对于应用中会多次重复使用的控件可以使用该方法。

    谨以作为开发记录,如果有帮到您,记得点赞哦

    相关文章

      网友评论

          本文标题:自定义组合控件

          本文链接:https://www.haomeiwen.com/subject/iygqpttx.html