自定义view系列之——自定义ActionBar

我们在项目中，都会有统一的ActionBar,其中包括返回键，标题，搜索框，菜单（文字或者图标），我在项目中封装了适应各种情况的组件ActionBar。

github代码传送门: https://github.com/18380438200/CustomActionBar

先上效果图：

超级截屏_20171026_153816.png

ActionBar类：

public class CustomActionBar extends LinearLayout {

    private ImageView headerBack;
    private TextView headerTitle, headerMenuText;
    private LinearLayout llSearch;
    private LayoutInflater mInflater;
    private View headView;

    public CustomActionBar(Context context) {
        super(context);
        init(context);
    }

    public CustomActionBar(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    public void init(Context context) {
        mInflater = LayoutInflater.from(context);
        headView = mInflater.inflate(R.layout.customactionbar, null);
        addView(headView);
        initView();
    }

    private void initView() {
        headerBack = headView.findViewById(R.id.header_back);
        headerTitle = headView.findViewById(R.id.header_title);
        headerMenuText = headView.findViewById(R.id.header_menu);
        llSearch = headView.findViewById(R.id.ll__search);
        headerBack.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                ((Activity) getContext()).finish();
            }
        });
    }

    public void setStyle(String title) {
        if (title != null)
            headerTitle.setText(title);
    }

    /**
     * 标题加文字菜单
     *
     * @param title
     * @param menuText
     * @param listener
     */
    public void setStyle(String title, String menuText, OnClickListener listener) {
        setStyle(title);
        if (menuText != null)
            headerMenuText.setText(menuText);
        headerMenuText.setOnClickListener(listener);
    }

    /**
     * 只有右边字体
     *
     * @param menuText
     * @param listener
     */
    public void setStyle(String menuText, OnClickListener listener) {
        headerBack.setVisibility(GONE);
        if (menuText != null)
            headerMenuText.setText(menuText);
        headerMenuText.setOnClickListener(listener);
    }

    /**
     * 标题加图标菜单
     *
     * @param title
     * @param menuImgResource
     * @param listener
     */
    public void setStyle(String title, int menuImgResource, OnClickListener listener) {
        setStyle(title);
        headerMenuText.setBackgroundResource(menuImgResource);
        headerMenuText.setOnClickListener(listener);
    }

    public void setStyle(boolean hasSearch){
        if(hasSearch){
            llSearch.setVisibility(VISIBLE);
        }
    }

    /**
     * 将默认的返回按钮功能去掉
     */
    public void setStyleNoBack(String title) {
        setStyle(title);
        headerBack.setVisibility(GONE);
    }

}

ActionBar的xml布局

<?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="wrap_content"
    android:background="#000">

    <ImageView
        android:id="@+id/header_back"
        android:layout_width="26dp"
        android:layout_height="26dp"
        android:layout_centerVertical="true"
        android:layout_marginLeft="5dp"
        android:padding="4dp"
        android:src="@mipmap/ic_arrow_back" />

    <LinearLayout
        android:id="@+id/linear_header_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true">

        <TextView
            android:id="@+id/header_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#fff"
            android:textSize="18sp" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/ll__search"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:background="@drawable/edittext_bg_shape"
        android:layout_margin="3dp"
        android:layout_centerInParent="true"
        android:padding="5dp"
        android:visibility="gone">

        <TextView
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="match_parent"
            android:hint="search"
            android:layout_centerInParent="true"
            android:padding="3dp"
            android:textColor="#fff"
            android:textSize="13sp" />
    </LinearLayout>

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:padding="12dp">

        <TextView
            android:id="@+id/header_menu"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="16sp"
            android:textColor="#fff"/>
    </RelativeLayout>

    <View
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"/>

</RelativeLayout>

使用示例：

//actionbar0默认只有返回键

        //只有标题
        actionBar1.setStyleNoBack("标题");

        //只有菜单
        actionBar2.setStyle("菜单", new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(getApplicationContext(),"点击菜单",Toast.LENGTH_SHORT).show();
            }
        });

        //返回键 + 标题
        actionBar3.setStyle("标题");

        //返回键 + 标题 + 菜单
        actionBar4.setStyle("标题", "菜单", new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(getApplicationContext(),"点击菜单",Toast.LENGTH_SHORT).show();
            }
        });

        //返回键 + 标题 + 菜单图标
        actionBar5.setStyle("标题", R.mipmap.more_white, new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(getApplicationContext(),"点击菜单",Toast.LENGTH_SHORT).show();
            }
        });

        //搜索框模式
        actionBar6.setStyle(true);