CoderTaskAndroid开发经验谈Android开发

Toolbar快速实现,让你一分钟上手

2017-09-04  本文已影响122人  XiMiMax

原创作品,转载请注明出处

Toolbar在日常的App开发中,使用频率非常高,而它的属性也很丰富,怎样做能快速实现呢?

嫌文章太长?那直接去看代码吧→_→传送门


首先,我们先简单了解下Toolbar

A standard toolbar for use within application content.
一个用于应用程序内容的标准工具栏。

java.lang.Object
android.view.View
android.view.ViewGroup
↳android.support.v7.widget.Toolbar

可以看出Toolbar继承自ViewGroup,可以包含的元素:


如图,此类的Toolbar在生活中是很常见的,那为什么不封装个BaseToolbar呢?

  1. 定义自己的AppTheme
 <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <!--Toolbar颜色-->
        <item name="colorPrimary">@color/colorPrimary</item>
        <!--状态栏颜色-->
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <!--checkBox 等控件选中颜色-->
        <item name="colorAccent">@color/colorAccent</item>
        <!--标题文字颜色-->
        <item name="titleTextColor">@color/colorTitleText</item>
        <!--设置左侧返回按钮-->
        <item name="navigationIcon">@drawable/icon_back</item>
        <!--各控制元件的预设颜色。-->
        <item name="colorControlNormal">@color/colorTitleText</item>
        <!--titleTextStyle-->
        <item name="titleTextStyle">@style/customTitleTextStyle</item>
        <!--标题栏高度-->
        <item name="actionBarSize">45dp</item>
    </style>

 /*自定义标题栏样式*/
    <style name="customTitleTextStyle">
        <item name="android:textSize">20sp</item>
        <item name="android:textColor">@color/colorTitleText</item>
        <item name="android:layout_gravity">left|center_vertical</item>
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">match_parent</item>
        <item name="android:gravity">center</item>
    </style>
  1. 定义BaseToolbar布局
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/base_title"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:translationZ="4dp"
    android:gravity="center_vertical">

    <!--此处的TextView 就是自定义View的添加位置,结合自身需求可随意修改-->
    <TextView
        android:id="@+id/base_title_text"
        style="?attr/titleTextStyle"/>


</android.support.v7.widget.Toolbar>
  1. 创建BaseToolbar
 public static class Builder{
        private AppCompatActivity appCompatActivity;

        private OnClickListener onClickListener;

        private View.OnClickListener titleOnClickListener;

        private int rsIdTitle;

        private String textTitle;

        private Drawable titleDrawable;

        private boolean isHideNavigationIcon;

        private BaseToolbar baseToolbar;

        private Builder(AppCompatActivity appCompatActivity) {
            this.appCompatActivity = appCompatActivity;
        }

        public Builder setOnClickListener(OnClickListener onClickListener) {
            this.onClickListener = onClickListener;
            return this;
        }

        public Builder setTitleOnClickListener(View.OnClickListener onClickListener){
            this.titleOnClickListener = onClickListener;
            return this;
        }

        public Builder setRsIdTitle(int rsIdTitle) {
            this.rsIdTitle = rsIdTitle;
            return this;
        }

        public Builder setTextTitle(String textTitle) {
            this.textTitle = textTitle;
            return this;
        }

        public Builder isHideNavigationIcon(boolean isHideNavigationIcon) {
            this.isHideNavigationIcon = isHideNavigationIcon;
            return this;
        }

        public Builder setTitleDrawable(Drawable titleDrawable) {
            this.titleDrawable = titleDrawable;
            return this;
        }

        public BaseToolbar getBaseToolbar(){
            return  baseToolbar;
        }

        public void build(){
            baseToolbar = new BaseToolbar(this);
            baseToolbar.initToolbar();
        }
    }

由于代码篇幅过长,这里只展示了Builder部分。
BaseToolbar的本质上是一个工具类,其中的扩展方法可以根据自己的实际需求自定义。


它的好处是显而易见的

  1. 简洁清晰的链式调用
 toolBarBuilder
                .setTextTitle("Toolbar演示")
                .setTitleDrawable(getResources().getDrawable(R.mipmap.ic_launcher_round))
                .setOnClickListener(new BaseToolbar.OnClickListener() {
                    @Override
                    public void navigationOnClick(View v) {
                    }

                    @Override
                    public boolean onMenuItemClick(MenuItem item) {
                        return true;
                    }
                })
                .setTitleOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        toast("title");
                    }
                }).build();
  1. 灵活的封装方式

像这样:

//在BaseActivity中提供实例化方法

    protected void initDefaultBaseToolbar(String title) {
        toolBarBuilder.setOnClickListener(DefaultBarOnClickListener.newInstance(this))
                .setRsIdTitle(titleId)
                .build();
    }

//ChildActivity中实例化

    initDefaultBaseToolbar("title");

  1. 快速的使用方式
//在layout中引入布局
<include layout="@layout/base_title"/>

//activity中实例化
BaseToolbar.Builder toolBarBuilder = BaseToolbar.newInstance(this);

总结

分装BaseToolbar的想法来源于对重复代码的排斥,能写一遍绝不写两遍,这也是在实际开发中极力提倡的。
使用了Builder模式实现链式调用,逻辑更清晰,调用更方便 。
提供相应的扩展接口,以便于后期功能增删。

BaseToolbar被我封装在 ZBaseLib 中,此项目持续维护中,欢迎StarFork

每星期至少一篇跟新本系列,感兴趣可以关注。
一起学习,一起进步。

上一篇下一篇

猜你喜欢

热点阅读