自定义View 之创建复合控件

阳光穿透心脏的1/2处 2022-06-12 13:09 204阅读 0赞

创建复合控件以很好的创建出具有重用功能的控件集合。这种方式通常需要继承一个合适的ViewGroup，再给他添加指定功能的控件从而组合成新的复合控件。

1.自定义的TopBar的属性集合

<?xml version="1.0" encoding="utf-8"?>
    <resources>
        <declare-styleable name="TopBar">
            <attr name="title" format="string"/>
            <attr name="titleTextSize" format="dimension"/>
            <attr name="titleTextColor" format="color" />
            <attr name="leftTextColor" format="color" />
            <attr name="leftBackground" format="reference|color"/>
            <attr name="leftText" format="string"/>
            <attr name="rightTextColor" format="color" />
            <attr name="rightBackground" format="reference|color"/>
            <attr name="rightText" format="string"/>
        </declare-styleable>
    </resources>

2.TopBar的实现代码  
get到的知识点  
1.对Java接口理解更深了  
2.public TopBar(Context context, AttributeSet attrs) 得传属性集进去  
3.setBackgroundColor(0xFFF59563);设置整个View的背景  
4.各种get（）从xml文件中get到属性值  
5.context.obtainStyledAttributes 用来解析参数

package com.example.administrator.youku_animi.MyView;
    
    import android.content.Context;
    import android.content.res.TypedArray;
    import android.graphics.Color;
    import android.graphics.drawable.Drawable;
    import android.util.AttributeSet;
    import android.view.Gravity;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.Button;
    import android.widget.RelativeLayout;
    import android.widget.TextView;
    
    import com.example.administrator.youku_animi.R;
    
    import java.text.AttributedCharacterIterator;
    
    import static com.example.administrator.youku_animi.R.styleable.TopBar;
    
    
    /** * Created by Administrator on 2017/7/23 0023. */
    //定义一个置顶栏控件，左右各一个按钮，中间一个TextView
    public class TopBar extends RelativeLayout { 
        private int mLeftTextColor;
        private Drawable mLeftBackground;
        private String mLeftText;
    
        private int mRightTextColor;
        private Drawable mRightBackground;
        private String mRightText;
    
        private float mTitleTextSize;
        private int mTitleTextColor;
        private String mTitle;
    
        private Button mLeftButton;
        private Button mRightButton;
        private TextView mTitleView;
    
        private RelativeLayout.LayoutParams mLeftParams;
        private RelativeLayout.LayoutParams mRightParams;
        private RelativeLayout.LayoutParams mTitleParams;
    
        private topbarClickListener mListener;
    
        public TopBar(Context context, AttributeSet attrs, int defStyle) {
            super(context, attrs, defStyle);
        }
    
        public TopBar(Context context) {
            super(context);
        }
    
        //忘记重写构造方法
        public TopBar(Context context, AttributeSet attrs)
        {
            //启动超类的构造方法
            super(context, attrs);
    // int attrs = R.styleable.TopBar;
            //整个TopBar的背景颜色
            setBackgroundColor(0xFFF59563);
            //
            TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.TopBar);
    
            mLeftTextColor = ta.getColor(R.styleable.TopBar_leftTextColor, 0);
            mLeftBackground = ta.getDrawable(R.styleable.TopBar_leftBackground);
            mLeftText = ta.getString(R.styleable.TopBar_leftText);
    
            mRightTextColor = ta.getColor(R.styleable.TopBar_rightTextColor, 0);
            mRightBackground = ta.getDrawable(R.styleable.TopBar_rightBackground);
            mRightText = ta.getString(R.styleable.TopBar_rightText);
    
            mTitleTextSize = ta.getDimension(R.styleable.TopBar_titleTextSize, 10);
            mTitleTextColor = ta.getColor(R.styleable.TopBar_titleTextColor, 0);
            mTitle = ta.getString(R.styleable.TopBar_title);
    
            ta.recycle();
    
            mLeftButton = new Button(context);
            mRightButton = new Button(context);
            mTitleView = new TextView(context);
    
            mLeftButton.setTextColor(mLeftTextColor);
            mLeftButton.setBackground(getResources().getDrawable(R.drawable.ic_chat_bubble_black_24dp));
            mLeftButton.setText(mLeftText);
    
            mRightButton.setTextColor(mRightTextColor);
            mRightButton.setBackground(mRightBackground);
            mRightButton.setText(mRightText);
    
            mTitleView.setText(mTitle);
            mTitleView.setTextColor(mTitleTextColor);
            mTitleView.setTextSize(mTitleTextSize);
            mTitleView.setGravity(Gravity.CENTER);
    
            //设置控件的参数个，设置宽高
            mLeftParams = new LayoutParams(
                    LayoutParams.WRAP_CONTENT,
                    LayoutParams.MATCH_PARENT
            );
            // 设置布局方式
            mLeftParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT, TRUE);
            //添加到ViewGroup
            addView(mLeftButton, mLeftParams);
    
            //向右对其的组件的宽高
            mRightParams = new LayoutParams(
                    LayoutParams.WRAP_CONTENT,
                    LayoutParams.MATCH_PARENT
            );
            mRightParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT, TRUE);
            //添加到ViewGroup
            addView(mRightButton, mRightParams);
    
    
    
            //Title
            mTitleParams = new LayoutParams(
                    LayoutParams.WRAP_CONTENT,
                    LayoutParams.MATCH_PARENT
            );
            mTitleParams.addRule(RelativeLayout.CENTER_IN_PARENT, TRUE);
            //添加到ViewGroup
            addView(mTitleView, mTitleParams);
    
            mRightButton.setOnClickListener(new OnClickListener()
            {
                @Override
                public void onClick(View view)
                {
                    mListener.rightClick();
                }
            });
    
            mLeftButton.setOnClickListener(new OnClickListener()
            {
                @Override
                public void onClick(View view)
                {
                    mListener.leftClick();
                }
            });
    
    
        }
        public void setOnTopbarClickListener(topbarClickListener mListener)
        {
            this.mListener = mListener;
        }
        //设置按钮是否可见
        public void setButtonVisable(int id, boolean flag)
        {
            if (flag)
            {
                if (id == 0)
                {
                    mLeftButton.setVisibility(View.VISIBLE);
                }
                else
                {
                    mRightButton.setVisibility(View.VISIBLE);
                }
            }
            else
            {
                if (id == 0)
                {
                    mLeftButton.setVisibility(View.GONE);
                }
                else
                {
                    mRightButton.setVisibility(View.GONE);
                }
            }
        }
    
        //定义左右按钮点击事件的接口
        public interface topbarClickListener { 
            void leftClick();
    
            void rightClick();
    
        }
    }

TopBar的使用代码

package com.example.administrator.youku_animi;
    
    import android.app.Activity;
    import android.os.Bundle;
    import android.widget.Toast;
    
    import com.example.administrator.youku_animi.MyView.TopBar;
    
    
    /** * Created by Administrator on 2017/7/23 0023. */
    
    public class TopBarTest extends Activity { 
        TopBar mTopBar;
        @Override
        protected void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_topbar_test);
            mTopBar = (TopBar) findViewById(R.id.topbar_test);
            mTopBar.setOnTopbarClickListener(new TopBar.topbarClickListener()
            {
                @Override
                public void leftClick()
                {
                    Toast.makeText(TopBarTest.this, "this is left button", Toast.LENGTH_SHORT).show();
                    mTopBar.setButtonVisable(0, true);
                }
    
                @Override
                public void rightClick()
                {
                    Toast.makeText(TopBarTest.this, "this is right button", Toast.LENGTH_SHORT).show();
                    mTopBar.setButtonVisable(1, false);
                }
            });
        }
    }

get 到的知识点  
1.xmlns:xlm命名空间  
自定义View时得定义自己的命名空间，指定完整的包名。  
引用自定义的属性是，需要使用自定义的xmlns名字

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:custom="http://schemas.android.com/apk/res-auto" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent">
    
        <com.example.administrator.youku_animi.MyView.TopBar android:id="@+id/topbar_test" android:layout_width="match_parent" android:layout_height="40dp" custom:leftBackground="@color/colorAccent" custom:leftText="back" custom:leftTextColor="#FFFFFF" custom:rightText="More" custom:rightTextColor="#FFFFFF" custom:rightBackground="@color/colorPrimaryDark" custom:title="组合控件Test_one" custom:titleTextColor="#123412" custom:titleTextSize="10sp">
    
        </com.example.administrator.youku_animi.MyView.TopBar>
    
    </LinearLayout>

2017.7.23