Android ：app标题栏的封装（自定义控件）

前言

在app的开发中，每一个页面都有上面的标题栏，为了开发的方便，将该标题栏进行的封装，在实际的开发工作中，也可以将该封装好的标题栏控件直接拿来使用。
这里记录第一种方式：自定义控件

正文

标题栏无非就是返回按钮，标题，还有右侧的选项

1. 返回按钮
2. 返回按钮后面的文字（有时候不需要）
3. 标题
4. 右侧的图标或者文字

下面贴出的是布局文件

<?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="50dp"
    android:background="#F34B4E"
    android:gravity="center_vertical" >

    <LinearLayout
        android:id="@+id/llLeftGoBack"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:background="@drawable/widget_titlebar_selector"
        android:clickable="true"
        android:focusable="true"
        android:gravity="center_vertical"
        android:orientation="horizontal"
        android:paddingLeft="10dp"
        android:paddingRight="15dp" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginLeft="5dp"
            android:clickable="false"
            android:drawableLeft="@drawable/myapptitle_back"
            android:drawablePadding="5dp"
            android:focusable="false"
            android:gravity="center"
            android:text="返回"
            android:textColor="#FFFFFF"
            android:textSize="16sp" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/llRight"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/widget_titlebar_selector"
        android:clickable="true"
        android:focusable="true"
        android:orientation="horizontal"
        android:paddingLeft="15dp"
        android:paddingRight="15dp" >

        <ImageView
            android:id="@+id/ivRightComplete"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:clickable="false"
            android:focusable="false"
            android:visibility="gone" />

        <TextView
            android:id="@+id/tvRightComplete"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_marginLeft="5dp"
            android:clickable="false"
            android:focusable="false"
            android:gravity="center"
            android:text="完成"
            android:textColor="#FFFFFF"
            android:textSize="16sp"
            android:visibility="visible" />
    </LinearLayout>

    <TextView
        android:id="@+id/tvCenterTitle"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_toRightOf="@id/llLeftGoBack"
        android:layout_toLeftOf="@id/llRight"
        android:ellipsize="end"
        android:gravity="center"
        android:singleLine="true"
        android:text="标题"
        android:textColor="#FFFFFF"
        android:textSize="18sp" />

</RelativeLayout>

下面是贴出来封装好的类

/**
* My app title
**/
public class MyAppTitle extends LinearLayout{
   private OnLeftButtonClickListener mLeftButtonClickListener;
   private OnRightButtonClickListener mRightButtonClickListener;
   private MyViewHolder mViewHolder;
   private View viewAppTitle;

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

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

   @TargetApi(Build.VERSION_CODES.HONEYCOMB)
   public MyAppTitle(Context context, AttributeSet attrs, int defStyle) {
       super(context, attrs, defStyle);
       init();
   }

   private void init() {
       LayoutInflater inflater = (LayoutInflater) this.getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
       LayoutParams layoutParams = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
       viewAppTitle = inflater.inflate(R.layout.view_activity_titlebar, null);
       this.addView(viewAppTitle, layoutParams);

       mViewHolder = new MyViewHolder(this);
       mViewHolder.llLeftGoBack.setOnClickListener(new OnClickListener() {
           @Override
           public void onClick(View v){
               if (Utility.isFastDoubleClick()){
                   return;
               }
               
               if (mLeftButtonClickListener != null) {
                   mLeftButtonClickListener.onLeftButtonClick(v);
               }
           }
       });
       mViewHolder.llRight.setOnClickListener(new OnClickListener() {
           @Override
           public void onClick(View v){
               if (Utility.isFastDoubleClick()){
                   return;
               }
               
               if (mRightButtonClickListener != null) {
                   mRightButtonClickListener.OnRightButtonClick(v);
               }
           }
       });
   }

   public void initViewsVisible(boolean isLeftButtonVisile, boolean isCenterTitleVisile, boolean isRightIconVisile, boolean isRightTitleVisile){
       // 左侧返回
       mViewHolder.llLeftGoBack.setVisibility(isLeftButtonVisile ? View.VISIBLE : View.INVISIBLE);

       // 中间标题
       mViewHolder.tvCenterTitle.setVisibility(isCenterTitleVisile ? View.VISIBLE : View.INVISIBLE);

       // 右侧返回图标,文字
       if (!isRightIconVisile && !isRightTitleVisile) {
           mViewHolder.llRight.setVisibility(View.INVISIBLE);
       }
       else {
           mViewHolder.llRight.setVisibility(View.VISIBLE);
       }
       mViewHolder.ivRightComplete.setVisibility(isRightIconVisile ? View.VISIBLE : View.GONE);
       mViewHolder.tvRightComplete.setVisibility(isRightTitleVisile ? View.VISIBLE : View.INVISIBLE);
   }

   /**
    * 设置标题
    * 
    * @param title
    */
   public void setAppTitle(String title){
       if (!TextUtils.isEmpty(title)) {
           mViewHolder.tvCenterTitle.setText(title);
       }
   }

/**
    * 设置标题栏文字颜色
    * @return
    */
   public TitleBar setAppTitleTextColor(int color){
       mViewHolder.tvCenterTitle.setTextColor(color);
       return this;
   }

   public void setRightTitle(String text){
       if (!TextUtils.isEmpty(text)){
           mViewHolder.tvRightComplete.setText(text);
       }
   }

   public void setRightIcon(int sourceID){
       mViewHolder.ivRightComplete.setImageResource(sourceID);
   }

   public void setLeftOnclick(OnLeftButtonClickListener mOnLeftButtonClickListener) {
       if (mOnLeftButtonClickListener != null) {
       }
   }

   public void setAppBackground(int color){
       viewAppTitle.setBackgroundColor(color);
   }

   public void setOnLeftButtonClickListener(OnLeftButtonClickListener listen) {
       mLeftButtonClickListener = listen;
   }

   public void setOnRightButtonClickListener(OnRightButtonClickListener listen) {
       mRightButtonClickListener = listen;
   }

   public static abstract interface OnLeftButtonClickListener{
       public abstract void onLeftButtonClick(View v);
   }

   public static abstract interface OnRightButtonClickListener{
       public abstract void OnRightButtonClick(View v);
   }

   static class MyViewHolder{
       LinearLayout llLeftGoBack;
       TextView tvCenterTitle;
       LinearLayout llRight;
       ImageView ivRightComplete;
       TextView tvRightComplete;

       public MyViewHolder(View v){
           llLeftGoBack = (LinearLayout) v.findViewById(R.id.llLeftGoBack);
           tvCenterTitle = (TextView) v.findViewById(R.id.tvCenterTitle);
           llRight = (LinearLayout) v.findViewById(R.id.llRight);
           ivRightComplete = (ImageView) v.findViewById(R.id.ivRightComplete);
           tvRightComplete = (TextView) v.findViewById(R.id.tvRightComplete);
       }
   }
}

接下来看在项目中 布局文件的引用

<包名.MyAppTitle
        android:id="@+id/myNewAppTitle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >
</包名.MyAppTitle>

在activity中初始化该标题的代码

private void setMyAppTitle()
    {
        MyAppTitle mNewAppTitle = (MyAppTitle) this.findViewById(R.id.myNewAppTitle);
        mNewAppTitle.initViewsVisible(true, true, false, true);
        mNewAppTitle.setAppTitle(getString(R.string.title));
        mNewAppTitle.setRightTitle(getString(R.string.subtitle));
        mNewAppTitle.setOnLeftButtonClickListener(new OnLeftButtonClickListener() {
            @Override
            public void onLeftButtonClick(View v) {
                onBackPressed();
            }
        });

        mNewAppTitle.setOnRightButtonClickListener(new OnRightButtonClickListener(){
            @Override
            public void OnRightButtonClick(View v) {
                //TODO
            }
        });
    }

这次的内容就到这里了，
下篇文章将记录BaseActivity+toolbar的实现方式。