在開發一款App中，我們一定要注意對組件的復用，小到一個Button，大到一個RecyclerView中的Section都是可以復用的。
總之一句話，能復用的盡量復用，這樣才能在哪天設計師突然要改變整個App的設計風格的時候不至于措手不及。

下面介紹一種最最常見實現自定義組件的方式，也是我個人使用的最多的。

1 先看布局

<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">

    <TextView
        android:id="@+id/button_tv"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_marginLeft="4dp"
        android:clickable="false"
        android:duplicateParentState="true"
        android:gravity="center"
        android:lineSpacingExtra="4sp"
        android:textSize="@dimen/text_size_12" />

</merge>

一定要用Merge，為什么？減少Layout嵌套，如果有Code Review的公司建議把這一項檢查加進去。
舉個例子，假如Merge改成FrameLayout，那么布局效果就會變成這樣

<FrameLayout>
   <FrameLayout>
      <TextView />
   </FrameLayout>
</FrameLayout>

如果使用Merge，那么布局效果就是這樣

<FrameLayout>
   <TextView />
</FrameLayout>

2 不要用Include，為啥？Include不能傳自定義參數。
所以應該怎么做？看代碼

public class IWBaseButton extends LinearLayout {

    private ImageView buttonLeftImage;
    private TextView buttonText;
    private Context mContext;
    private int textResId;
    private int leftImageResId;
    private @ColorInt
    int textColor;
    private @ColorInt
    int buttonStrokeColor;
    private @ColorInt
    int buttonSolidColor;

    public IWBaseButton(Context context, AttributeSet attrs) {
        super(context, attrs);
        this.mContext = context;
        initAttrs(attrs);
        initView();
    }

    private void initAttrs(AttributeSet attrs) {
        TypedArray a = mContext.obtainStyledAttributes(attrs, R.styleable.BaseButton);
        this.textResId = a.getResourceId(R.styleable.BaseButton_button_text, 0);
        this.leftImageResId = a.getResourceId(R.styleable.BaseButton_button_left_image, 0);
        // default text color is white, stroke color is white, solid color is transparent
        this.textColor = a.getColor(R.styleable.BaseButton_button_text_color, getResources().getColor(R.color.white));
        this.buttonStrokeColor = a.getColor(R.styleable.BaseButton_button_stroke_color, getResources().getColor(R.color.white));
        this.buttonSolidColor = a.getColor(R.styleable.BaseButton_button_solid_color, getResources().getColor(R.color.transparent));
        a.recycle();
    }

    private void initView() {
        inflate(mContext, R.layout.layout_base_button, this);
        buttonLeftImage = findViewById(R.id.button_left_iv);
        buttonText = findViewById(R.id.button_tv);
        if (textResId != 0) {
            setText(mContext.getString(textResId));
        }
        if (leftImageResId != 0) {
            setLeftImage(leftImageResId);
        } else {
            buttonLeftImage.setVisibility(GONE);
        }
        setTextColor(textColor);
        setGravity(Gravity.CENTER);
    }
}

這段代碼是我用來復用項目中Button的，效果如下

5634671C-8879-440C-8489-7B2462369B7A.png

因為繼承了LinearLayout，所以最終的布局層級如下

<LinearLayout>
   <ImageView />
   <TextView />
</LinearLayout>

三 注意事項

 inflate(mContext, R.layout.layout_base_button, this);

解析布局，this表示把這個布局加到LinearLayout中去，不需要再顯示的調用addView方法了。

自定義屬性在attrs.xml文件中添加即可

    <declare-styleable name="BaseButton">
        <attr name="button_text" format="reference" />
        <attr name="button_text_color" format="color|integer" />
        <attr name="button_stroke_color" format="color|integer" />
        <attr name="button_solid_color" format="color|integer" />
        <attr name="button_left_image" format="reference" />
    </declare-styleable>

如果還需要添加style，可以參考
如何更好的通過Inflate layout的方式來實現自定義view

參考資料：
The beauty of Custom Views in Android and How to do it!
Protip. Inflating layout for your custom view
如何更好的通過Inflate layout的方式來實現自定義view