Android自定義控件之標題控件

在Android項目中我們經常會遇到如下的UI展示需求

就是模塊標題的顯示,通常後面內容是動態的,還有諸如有無向右箭頭,上下是否顯示線條等不同需求.之前項目中的做法是用一個include標簽將次布局引入,這必然導致布局文件不易讀,而且引入太多include標簽頁會影響界面的渲染速度,所以改為組合控件形式的自定義控件來改造,支持xml屬性定義並且對外暴露相關方法.

1.首先還是自定義我們需要的一些屬性,在values文件夾下邊新建attrs.xml文件

<!--自定義表單--> 
<declare-styleable name="CommonFormLayout"> 
<attr name="leftImage" format="reference" /> 
<attr name="hasRightArrow" format="boolean" /> 
<attr name="titleText" format="string|reference" /> 
<attr name="contentText" format="string|reference" /> 
<attr name="titleTextColor" format="color" /> 
<attr name="contentTextColor" format="color|reference" /> 
<attr name="contentTextHintColor" format="color|reference" /> 
<attr name="contextTextHint" format="string|reference" /> 
<attr name="titleTextSize" format="integer|reference" /> 
<attr name="contentTextSize" format="integer|reference" /> 
<!--有頂部線時設置為true--> 
<attr name="hasTopLine" format="boolean" /> 
<!--短底部線時設置為true--> 
<attr name="isShotBottomLine" format="boolean" /> 
</declare-styleable> 

2.自定義類繼承自RelativeLayout,這裡將控件載入,並且在構造方法中進行屬性解析,並且對外提供必要的set(),get()方法,以便在Java代碼中控制屬性.

package shidong.com.commonformlayout;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.drawable.Drawable;
import android.text.TextPaint;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.RelativeLayout;
import android.widget.TextView;

/**
 * 
 * Created by shidong on 16/7/30.
 */
public class CommonFormLayout extends RelativeLayout {

    private final TextView tv_common_title;
    private final TextView tv_common_content;
    private final View view_top_line;
    private final View view_bottom_long;
    private final View view_bottom_short;

    public CommonFormLayout(Context context) {
        this(context, null);
    }

    public CommonFormLayout(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public CommonFormLayout(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);

        LayoutInflater.from(context).inflate(R.layout.layout_common_form, this, true);
        tv_common_title = (TextView) findViewById(R.id.tv_common_title);
        tv_common_content = (TextView) findViewById(R.id.tv_common_content);
        view_top_line = findViewById(R.id.view_top_line);
        view_bottom_long = findViewById(R.id.view_bottom_long);
        view_bottom_short = findViewById(R.id.view_bottom_short);

        //獲取屬性並解析
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.CommonFormLayout);
        int count = typedArray.getIndexCount();
        for (int i = 0; i < count; i++) {
            int itemId = typedArray.getIndex(i);
            if (itemId == R.styleable.CommonFormLayout_titleText) {
                tv_common_title.setText(typedArray.getText(itemId));
            } else if (itemId == R.styleable.CommonFormLayout_contentText) {
                tv_common_content.setText(typedArray.getText(itemId));
            } else if (itemId == R.styleable.CommonFormLayout_hasRightArrow) {
                if (typedArray.getBoolean(itemId, false)) {
                    tv_common_content.setCompoundDrawablesWithIntrinsicBounds(null, null, getResources().getDrawable(R.mipmap.icon_right_arrow), null);
                }
            } else if (itemId == R.styleable.CommonFormLayout_leftImage) {
                tv_common_title.setCompoundDrawablesWithIntrinsicBounds(typedArray.getDrawable(itemId), null, null, null);
            } else if (itemId == R.styleable.CommonFormLayout_titleTextColor) {
                tv_common_title.setTextColor(typedArray.getColor(itemId, getResources().getColor(R.color.grey_333333)));
            } else if (itemId == R.styleable.CommonFormLayout_contentTextColor) {
                tv_common_content.setTextColor(typedArray.getColor(itemId, getResources().getColor(R.color.grey_888888)));
            } else if (itemId == R.styleable.CommonFormLayout_hasTopLine) {
                if (typedArray.getBoolean(itemId, false)) {
                    view_top_line.setVisibility(VISIBLE);
                }
            } else if (itemId == R.styleable.CommonFormLayout_isShotBottomLine) {
                if (typedArray.getBoolean(itemId, false)) {
                    view_bottom_short.setVisibility(VISIBLE);
                    view_bottom_long.setVisibility(GONE);
                }
            } else if (itemId == R.styleable.CommonFormLayout_contentTextHintColor) {
                tv_common_content.setHintTextColor(typedArray.getColor(itemId, getResources().getColor(R.color.grey_d3d3d3)));
            } else if (itemId == R.styleable.CommonFormLayout_contextTextHint) {
                tv_common_content.setHint(typedArray.getText(itemId));
            } else if (itemId == R.styleable.CommonFormLayout_titleTextSize) {
                tv_common_title.setTextSize(TypedValue.COMPLEX_UNIT_SP, typedArray.getInt(itemId, 0));
            } else if (itemId == R.styleable.CommonFormLayout_contentTextSize) {
                tv_common_content.setTextSize(TypedValue.COMPLEX_UNIT_SP, typedArray.getInt(itemId, 0));
            }
        }
    }


    /**
     * 設置左側標題圖標
     *
     * @param resId
     */
    public void setLeftImage(int resId) {
        setLeftImage(getResources().getDrawable(resId));
    }

    /**
     * 設置左側標題圖標
     *
     * @param drawable
     */
    public void setLeftImage(Drawable drawable) {
        tv_common_title.setCompoundDrawablesWithIntrinsicBounds(drawable, null, null, null);
    }

    /**
     * 設置是否有向右箭頭
     *
     * @param hasRightArrow
     */
    public void setHasRightArrow(boolean hasRightArrow) {
        if (hasRightArrow) {
            tv_common_content.setCompoundDrawablesWithIntrinsicBounds(null, null, getResources().getDrawable(R.mipmap.icon_right_arrow), null);
        } else {
            tv_common_content.setCompoundDrawablesWithIntrinsicBounds(null, null, null, null);
        }
    }

    /**
     * 設置標題文本
     *
     * @param resID
     */
    public void setTitleText(int resID) {
        setTitleText(getResources().getString(resID));
    }

    /**
     * 設置標題文本
     *
     * @param text
     */
    public void setTitleText(String text) {
        tv_common_title.setText(text);
    }

    /**
     * 返回標題文本
     */
    public CharSequence getTitleText() {
        return tv_common_title.getText();
    }

    /**
     * 設置內容文本
     *
     * @param resId
     */
    public void setContentText(int resId) {
        setContentText(getResources().getString(resId));
    }

    /**
     * 設置內容文本
     *
     * @param text
     */
    public void setContentText(String text) {
        tv_common_content.setText(text);
    }

    /**
     * 返回內容文本
     */
    public CharSequence getContentText() {
        return tv_common_content.getText();
    }

    /**
     * 設置標題文本顏色
     *
     * @param resId
     */
    public void setTitleTextColor(int resId) {
        tv_common_title.setTextColor(resId);
    }

    /**
     * 設置內容文本顏色
     *
     * @param resId
     */
    public void setContentTextColor(int resId) {
        tv_common_content.setTextColor(resId);
    }


    public void addTextChangedListener(TextWatcher watcher) {
        tv_common_content.addTextChangedListener(watcher);
    }

    public void setContentTextHintColor(int resId) {
        tv_common_content.setHintTextColor(resId);
    }

    public void setHintText(int resId) {
        setHintText(getResources().getString(resId));
    }

    public void setHintText(String text) {
        tv_common_content.setHint(text);
    }

    public void setTitleTextStyleBold() {
        TextPaint paint = tv_common_title.getPaint();
        paint.setFakeBoldText(true);
    }

    public void setContentTextStyleBold() {
        TextPaint paint = tv_common_content.getPaint();
        paint.setFakeBoldText(true);
    }

    /**
     * 內容文本點擊監聽
     *
     * @param onClickListener
     */
    public void setContentTextClickListener(OnClickListener onClickListener) {
        tv_common_content.setOnClickListener(onClickListener);
    }

    /**
     * 設置標題字體大小
     *
     * @param size 文字大小,單位是sp
     */
    public void setTitleTextSize(int size) {
        tv_common_title.setTextSize(TypedValue.COMPLEX_UNIT_SP, size);
    }

    /**
     * 設置內容字體大小
     *
     * @param size 文字大小,單位是sp
     */
    public void setContentTextSize(int size) {
        tv_common_content.setTextSize(TypedValue.COMPLEX_UNIT_SP, size);
    }

    /**
     * 設置根view的背景
     *
     * @param background
     */
    public void setRootViewBackgroundDrawable11(Drawable background) {
        View view = findViewById(R.id.root_commom_formlayout);
        view.setBackgroundDrawable(null);
    }

}

3.然後在界面中就能很輕松地控制這個控件了

package shidong.com.commonformlayout;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        CommonFormLayout commonFormLayout = (CommonFormLayout) findViewById(R.id.common_layout);
        commonFormLayout.setTitleTextColor(getResources().getColor(R.color.grey_333333));
        commonFormLayout.setContentTextClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(getBaseContext(), "點擊內容", Toast.LENGTH_SHORT).show();
            }
        });
    }

}

項目中的一個小功能而已.其實想說的是我們在完成一個功能或者模塊之前,一定要先統籌全局想一想,是否可以封裝公用的代碼;並且自己封裝的空間和自定義的屬性,方法等一定要命名規范,並且添加簡潔明了的注釋代碼,不要給後人留坑啊,親身被坑所以深有感觸…