Android自定义控件之自定义组合控件

原创 2018年04月15日 20:53:31
介绍一下自定义组合控件带来的好处。
  • 提高布局文件开发效率
  • 降低布局文件维护成本
  • 降低布局文件和Activity代码耦合性
  • 容易扩展
  • 简单易用

显示效果


如何实现一个自定义组合控件

1.)先定义一个布局文件

<merge xmlns:android="http://schemas.android.com/apk/res/android">

    <Button
        android:padding="5dp"
        android:id="@+id/title_bar_left"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:layout_marginLeft="5dp"
        android:background="@null"
        android:minHeight="10dp"
        android:minWidth="15dp"
        android:textSize="14sp" />

    <TextView
        android:gravity="center_vertical"
        android:layout_marginLeft="80dp"
        android:padding="5dp"
        android:id="@+id/title_bar_title"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:singleLine="true"
        android:textSize="17sp" />

    <Button
        android:padding="5dp"
        android:id="@+id/title_bar_right"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_marginRight="7dp"
        android:background="@null"
        android:minHeight="0dp"
        android:minWidth="0dp"
        android:textSize="14sp" />
</merge>
注意:这里为何要使用merge标签,自定义组合控件时会继承RelativeLayout、LinearLayout等控件,这样导致布局的层级无形中增加了一层

2.)定义自定义属性 在values目录下创建 attrs.xml

比如标题文字、标题栏左边按钮图标等。

<resources>
    <declare-styleable name="CustomTitleBar">
        <attr name="title_background_color" format="reference|integer" />
        <attr name="left_button_visible" format="boolean" />
        <attr name="right_button_visible" format="boolean" />
        <attr name="title_text" format="string" />
        <attr name="title_text_color" format="color" />
        <attr name="title_text_drawable" format="reference|integer" />
        <attr name="right_button_text" format="string" />
        <attr name="right_button_text_color" format="color" />
        <attr name="right_button_drawable" format="reference|integer" />
        <attr name="left_button_text" format="string" />
        <attr name="left_button_text_color" format="color" />
        <attr name="left_button_drawable" format="reference|integer" />
    </declare-styleable>
</resources>

3.)自定义一个View根据需求继承不同的ViewGroup子类,比如:RelativeLayout、LinearLayout等,我们这里继承RelativeLayout。

public class CustomTitleBar extends RelativeLayout {
    private Button titleBarLeftBtn;
    private Button titleBarRightBtn;
    private TextView titleBarTitle;

    public CustomTitleBar(Context context, AttributeSet attrs) {
        super(context, attrs);
        LayoutInflater.from(context).inflate(R.layout.custom_title_bar, this, true);
        titleBarLeftBtn = (Button) findViewById(R.id.title_bar_left);
        titleBarRightBtn = (Button) findViewById(R.id.title_bar_right);
        titleBarTitle = (TextView) findViewById(R.id.title_bar_title);

        TypedArray attributes = context.obtainStyledAttributes(attrs, R.styleable.CustomTitleBar);
        if (attributes != null) {
            //处理titleBar背景色
            int titleBarBackGround = attributes.getResourceId(R.styleable.CustomTitleBar_title_background_color, Color.GREEN);
            setBackgroundResource(titleBarBackGround);
            //先处理左边按钮
            //获取是否要显示左边按钮
            boolean leftButtonVisible = attributes.getBoolean(R.styleable.CustomTitleBar_left_button_visible, true);
            if (leftButtonVisible) {
                titleBarLeftBtn.setVisibility(View.VISIBLE);
            } else {
                titleBarLeftBtn.setVisibility(View.INVISIBLE);
            }
            //设置左边按钮的文字
            String leftButtonText = attributes.getString(R.styleable.CustomTitleBar_left_button_text);
            if (!TextUtils.isEmpty(leftButtonText)) {
                titleBarLeftBtn.setText(leftButtonText);
                //设置左边按钮文字颜色
                int leftButtonTextColor = attributes.getColor(R.styleable.CustomTitleBar_left_button_text_color, Color.WHITE);
                titleBarLeftBtn.setTextColor(leftButtonTextColor);
            }
            //设置左边图片icon 这里是二选一 要么只能是文字 要么只能是图片
            int leftButtonDrawable = attributes.getResourceId(R.styleable.CustomTitleBar_left_button_drawable, R.mipmap.ic_launcher);
            if (leftButtonDrawable != -1) {
                titleBarLeftBtn.setCompoundDrawablesWithIntrinsicBounds(leftButtonDrawable, 0, 0, 0);  //设置到哪个控件的位置()
            }


            //处理标题
            //先获取标题是否要显示图片icon
            int titleTextDrawable = attributes.getResourceId(R.styleable.CustomTitleBar_title_text_drawable, -1);
            if (titleTextDrawable != -1) {
                titleBarTitle.setBackgroundResource(titleTextDrawable);
            } else {
                //如果不是图片标题 则获取文字标题
                String titleText = attributes.getString(R.styleable.CustomTitleBar_title_text);
                if (!TextUtils.isEmpty(titleText)) {
                    titleBarTitle.setText(titleText);
                }
                //获取标题显示颜色
                int titleTextColor = attributes.getColor(R.styleable.CustomTitleBar_title_text_color, Color.WHITE);
                titleBarTitle.setTextColor(titleTextColor);
            }

            //先处理右边按钮
            //获取是否要显示右边按钮
            boolean rightButtonVisible = attributes.getBoolean(R.styleable.CustomTitleBar_right_button_visible, true);
            if (rightButtonVisible) {
                titleBarRightBtn.setVisibility(View.VISIBLE);
            } else {
                titleBarRightBtn.setVisibility(View.INVISIBLE);
            }
            //设置右边按钮的文字
            String rightButtonText = attributes.getString(R.styleable.CustomTitleBar_right_button_text);
            if (!TextUtils.isEmpty(rightButtonText)) {
                titleBarRightBtn.setText(rightButtonText);
                //设置右边按钮文字颜色
                int rightButtonTextColor = attributes.getColor(R.styleable.CustomTitleBar_right_button_text_color, Color.WHITE);
                titleBarRightBtn.setTextColor(rightButtonTextColor);
            }
            //设置右边图片icon 这里是二选一 要么只能是文字 要么只能是图片
            int rightButtonDrawable = attributes.getResourceId(R.styleable.CustomTitleBar_right_button_drawable, -1);
            if (rightButtonDrawable != -1) {
                titleBarRightBtn.setCompoundDrawablesWithIntrinsicBounds(0, 0, rightButtonDrawable, 0);  //设置到哪个控件的位置()
            }
            //获取资源后要及时回收
            attributes.recycle();
        }
    }

    public void setTitleClickListener(OnClickListener onClickListener) {
        if (onClickListener != null) {
            titleBarLeftBtn.setOnClickListener(onClickListener);
            titleBarRightBtn.setOnClickListener(onClickListener);
        }
    }

    public Button getTitleBarLeftBtn() {
        return titleBarLeftBtn;
    }

    public Button getTitleBarRightBtn() {
        return titleBarRightBtn;
    }

    public TextView getTitleBarTitle() {
        return titleBarTitle;
    }

}

4.)在不同的XML布局中引用

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#F0F0F0"
    tools:context="com.bwie.zidingyi_test.MainActivity">

    <com.bwie.zidingyi_test.CustomTitleBar
        android:id="@+id/cub"
        android:layout_width="match_parent"
        android:layout_height="45dp"
        app:title_text_color="#000"
        android:layout_marginTop="10dp"
        app:right_button_drawable="@drawable/ic_aa"
        app:title_background_color="@color/green"
        app:title_text="标题1" />

</LinearLayout>

 //使用 点击事件  赋值等

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        final CustomTitleBar cub=findViewById(R.id.cub);
        //获取右边点击事件
        cub.getTitleBarRightBtn().setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this,"you",Toast.LENGTH_SHORT).show();
            }
        });
        //获取左边点击事件
        cub.getTitleBarLeftBtn().setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this,"zou",Toast.LENGTH_SHORT).show();
            }
        });
        //获取文字点击事件
        cub.getTitleBarTitle().setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
            cub.getTitleBarTitle().setText("揍你");
            }
        });
    }
}


Android开发技巧——自定义控件之组合控件

我准备在接下来一段时间,写一系列有关Android自定义控件的博客,包括如何进行各种自定义,并分享一下我所知道的其中的技巧,注意点等。 今天写第一篇,就先写一下最简单的,也就是我们大概最早接触的一类...
  • maosidiaoxian
  • maosidiaoxian
  • 2015-11-17 10:34:39
  • 4155

分分钟搞定自定义控件之组合控件--自定义View入门篇

今天给大家详细讲解一下如何实现自定义组合控件,组合控件其实很简单。大家可以自由地组合任意控件。好了,下面开始我们的正文。 我们要实现的效果如右图底部所示,其实呢!大家只要把握规律,还是挺容易的。 ...
  • qq_21004057
  • qq_21004057
  • 2016-09-22 23:08:33
  • 984

自定义组合控件,自定义View,接口点击事件

 先写自定义组合控件的布局LoginView 继承自LinearLayout public class LoginViewextends LinearLayoutimplements Vi...
  • Developer_Sir
  • Developer_Sir
  • 2017-11-05 20:11:52
  • 347

Android自定义控件——自定义组合控件

前面几篇博文介绍了Android如何自定义控件,其实就是讲一下如何“从无到有”的自定义一个全新的控件,继承View或者继承ViewGroup,复写其相关方法,这种自定义控件的方式相对来说难度较大,而且...
  • lee_tianya
  • lee_tianya
  • 2014-09-26 16:42:34
  • 2719

Android自定义控件---组合控件(包括自定义属性)

转自:点击打开链接 今天和大家分享下组合控件的使用。很多时候android自定义控件并不能满足需求,如何做呢?很多方法,可以自己绘制一个,可以通过继承基础控件来重写某些环节,当然也可以将控件组合成一...
  • zhifanxu
  • zhifanxu
  • 2016-03-17 16:54:38
  • 550

自定义控件-组合控件

自定义控件当原生控件不能满足需要时,需要进行自定义控件,自定义控件可分为三种方式: 对现有控件进行拓展 通过现有控件的组合实现新的控件 完全自定义一个新的控件 组合控件的使用方式1、新建控件类首先控件...
  • u013632190
  • u013632190
  • 2016-06-10 02:42:39
  • 769

自定义控件之创建可以复用的组合控件(三)

今天我们打算学习下另外一种自定义控件,就是创建可重复使用的组合控件,那么问题来了: - **什么是可重复使用?** 就是在应用中,可以在多个地方共同使用一套代码。这样不仅能减少我们的工作量,而且还能保...
  • guiman
  • guiman
  • 2016-04-19 18:17:21
  • 4973

Android View体系(十)自定义组合控件

上一篇我们讲到了自定义View,接着我们来讲讲常用的自定义组合控件,自定义组合控件就是多个控件组合起来成为一个新的控件,主要用来解决多次重复的使用同一类型的布局。比如我们应用的顶部的标题栏,还有弹出的...
  • itachi85
  • itachi85
  • 2016-05-19 17:10:07
  • 11675

Android自定义控件View(三)组合控件

不少人应该见过小米手机系统音量控制UI,一个圆形带动画效果的音量加减UI,效果很好看。它是怎么实现的呢?这篇博客来揭开它的神秘面纱。先上效果图 相信很多人都知道Android自定义控件的三种方式,A...
  • feidu804677682
  • feidu804677682
  • 2015-05-30 09:49:34
  • 6881
收藏助手
不良信息举报
您举报文章:Android自定义控件之自定义组合控件
举报原因:
原因补充:

(最多只允许输入30个字)