在一些需求中，多个界面里相似的布局，这种场景下就可以运用自定义控件减少工作量。
采用<include/>、<merge/>标签也是一种复用的手段。但是，在降低冗余代码并避免过度绘制方面，还是自定义控件适用性更好。

举个例子，标题栏是最常见的布局，如：

其他也都差不多，或者右边是图标或者没有东西。

懒人守则 1：能复用的，一定写成扩展性强的组件。并且要达到“懒”的目的。

首先写布局xml界面，并以<merge/>标签作为根节点

<?xml version="1.0" encoding="utf-8"?>
<merge
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/common_header_id"
    android:layout_width="match_parent"
    android:layout_height="45dp"
    android:background="@color/colorLightGray"
    android:gravity="center_vertical"
    android:orientation="horizontal">
    <ImageView
        android:id="@+id/left_img"
        android:layout_width="30dp"
        android:layout_height="match_parent"
        android:paddingBottom="12dp"
        android:paddingTop="12dp"
        android:scaleType="fitCenter"
        android:src="@mipmap/icon_user_friend"/>

    <TextView
        android:id="@+id/left_title"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center_vertical"
        android:singleLine="true"
        android:text="@string/middle_title"
        android:textColor="@color/colorTextColor"
        android:textSize="@dimen/dp_13"/>

    <View
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"/>

    <TextView
        android:id="@+id/right_title"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center_vertical|right"
        android:singleLine="true"
        android:text="@string/right_title"
        android:textColor="@color/colorTextColor"
        android:textSize="@dimen/dp_13"/>
    <ImageView
        android:id="@+id/right_img"
        android:layout_width="20dp"
        android:layout_height="wrap_content"
        android:paddingBottom="15dp"
        android:paddingTop="15dp"
        android:scaleType="fitCenter"
        android:src="@mipmap/icon_arrow_right"/>
</merge>

注意：这里为了被复用的根布局便于查看，在不影响扩展布局赋值的情况下，根布局要达到只需要替换成merge就可以的程度。

所以，将</merge>标签换成之前的LinearLayout之后的界面效果是：

这里还不能做到懒人守则1的标准，因为很多界面或者不需要左边的图标，或者不需要右边的文字等等。所以，我们要做下面的事情~

写一个自定义控件，采用继承viewgroup并组合控件的方式

/**
 * Created by jinzifu on 2017/6/12.
 */

public class CommonView extends LinearLayout {
    @BindView(R.id.left_img)
    ImageView leftImg;
    @BindView(R.id.left_title)
    TextView leftTitle;
    @BindView(R.id.right_title)
    TextView rightTitle;
    @BindView(R.id.right_img)
    ImageView rightImg;

    public CommonView(Context context) {
        super(context);
    }

    public CommonView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        LayoutInflater.from(context).inflate(R.layout.common_head_layout, this, true);

        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.CommonHeaderBar);
        if (typedArray != null) {
            //获取自定义属性值并赋值
            setBackgroundColor(typedArray.getColor(R.styleable
                    .CommonHeaderBar_layout_background, getResources().getColor(R.color
                    .colorWhite)));
            leftImg.setImageResource(typedArray.getResourceId(R.styleable
                    .CommonHeaderBar_left_img_drawable, R.mipmap.icon_user_friend));

            leftTitle.setText(typedArray.getResourceId(R.styleable
                    .CommonHeaderBar_left_title_text, R.string.middle_title));
            leftTitle.setTextColor(typedArray.getColor(R.styleable
                    .CommonHeaderBar_left_title_color, getResources().getColor(R
                    .color.colorTextColor)));

            typedArray.recycle();
        }
    }
}

这里继承LinearLayout布局，并在其构造方法中通过LayoutInflater.from(context).inflate的方式引入刚才的复用根布局，这是典型的组合布局实现方式。小不同的是，根布局的根标签是<merge/>，也就是说减少了不必要的层次嵌套，直接套用类LinearLayout的布局作为容器。

通过context.obtainStyledAttributes方法获取自定义的属性值并根据扩展需要进行赋值。

配置自定义属性，一切为了扩展和复用

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <!--标题栏通用属性-->

    <!--right_img_visible 为integer类型时默认为0，0表示visible，1表示invisible，2表示gone-->
    <!--right_img_visible 为boolean类型时默认为true，true表示visible，false表示invisible。-->

    <attr name="layout_background" format="color|integer"/>
    <attr name="right_text_visible" format="boolean|integer"/>
    <attr name="right_img_visible" format="boolean|integer"/>
    <attr name="left_text_visible" format="boolean|integer"/>
    <attr name="left_img_visible" format="boolean|integer"/>
    <attr name="left_title_text" format="string"/>
    <attr name="right_title_text" format="string"/>
    <attr name="middle_title_text" format="string"/>
    <attr name="middle_title_color" format="color"/>
    <attr name="left_title_color" format="color"/>
    <attr name="right_title_color" format="color"/>
    <attr name="left_img_drawable" format="reference|integer"/>
    <attr name="right_img_drawable" format="reference|integer"/>

    <declare-styleable name="CommonTitleBar">
        <attr name="layout_background"/>
        <attr name="middle_title_text"/>
        <attr name="middle_title_color"/>
        <attr name="right_text_visible"/>
        <attr name="right_title_text"/>
        <attr name="right_title_color"/>
        <attr name="left_img_drawable"/>
    </declare-styleable>

    <declare-styleable name="CommonHeaderBar">
        <attr name="layout_background"/>
        <attr name="left_img_visible"/>
        <attr name="left_text_visible"/>
        <attr name="right_text_visible"/>
        <attr name="right_img_visible"/>
        <attr name="left_title_text"/>
        <attr name="right_title_text"/>
        <attr name="left_title_color"/>
        <attr name="right_title_color"/>
        <attr name="left_img_drawable"/>
        <attr name="right_img_drawable"/>
    </declare-styleable>
</resources>

目录是在values下的attrs.xml（没有的话自己可以新建一个）。
这里是对不同自定义控件的属性统一配置，相同的属性都放在公用区，根据需要自己引用部分属性。

刚才我们继承LinearLayout实现自定义控件，若配置一个基类LinearLayout被同类型的自定义控件继承，更方便做一些统一的事情。

实现自定义控件继承基类，做一些统一的、基础性的事情

/**
 * Created by jinzifu on 2017/6/5.
 */

public abstract class BaseLinearLayout extends LinearLayout {
    private Context context;
    protected OnChildViewClickListener onChildViewClickListener;

    public BaseLinearLayout(Context context) {
        super(context);
        init(context,null);
    }

    public BaseLinearLayout(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init(context,attrs);
    }

    protected void init(Context context, AttributeSet attrs) {
        if (layoutId() != 0) {
            this.context = context;
            LayoutInflater.from(context).inflate(layoutId(), this, true);
            ButterKnife.bind(this);
            initView();
            initListener();
            initData();
        }
    }

    public void setOnChildViewClickListener(OnChildViewClickListener onChildViewClickListener) {
        this.onChildViewClickListener = onChildViewClickListener;
    }

    /**
     * 实现此方法在业务类中处理点击事件
     * @param childView
     * @param action
     * @param obj
     */
    protected void onChildViewClick(View childView, String action, Object obj) {
        if (onChildViewClickListener != null) {
            onChildViewClickListener.onChildViewClick(childView, action, obj);
        }
    }

    protected abstract int layoutId();

    protected void initView() {
    }

    protected void initData() {
    }

    protected void initListener() {
    }

    protected void toast(String string) {
        Toast.makeText(context, string,Toast.LENGTH_SHORT).show();
    }
}

这里很多地方见名知义， 不必详谈。单说说onChildViewClickListener这个接口吧。

因为有些场景中，点击事情或者交互操作，需要相应的业务逻辑处理，在view层做业务逻辑处理，不合规矩，所以要引入事件的“冒泡机制”。

自定义控件里对事件的操作如下：

  @OnClick({R.id.left_img, R.id.right_title})
    public void onViewClicked(View view) {
        switch (view.getId()) {
            case R.id.left_img:
                onChildViewClick(view, "left_img", null);
                break;
            case R.id.right_title:
                toast(getResources().getString(R.string.right_title));
                break;
        }
    }
}

业务层对该事件的捕获如下：

  titleLayout.setOnChildViewClickListener(new OnChildViewClickListener() {
            @Override
            public void onChildViewClick(View childView, String action, Object obj) {
                switch (action) {
                    case "left_img":
                        getActivity().finish();
                        break;
                    default:
                        break;
                }
            }
        });

补充下接口定义：

/**
 * Created by jinzifu on 2017/6/10.
 */
public interface OnChildViewClickListener {

    /**
     * view 内子控件点击事件监听回调
     *
     * @param childView 子控件
     * @param action    活动类型——一般写为view的ID
     * @param obj       额外数据
     */
    void onChildViewClick(View childView, String action, Object obj);
}

继承自定义控件基类，并根据需求配置自定义属性

/**
 * Created by jinzifu on 2017/6/12.
 */

public class CommonHeaderBar extends BaseLinearLayout {

    @BindView(R.id.left_img)
    ImageView leftImg;
    @BindView(R.id.left_title)
    TextView leftTitle;
    @BindView(R.id.right_title)
    TextView rightTitle;
    @BindView(R.id.right_img)
    ImageView rightImg;

    public CommonHeaderBar(Context context) {
        super(context);
    }

    public CommonHeaderBar(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.CommonHeaderBar);
        if (null != typedArray) {
            setBackgroundColor(typedArray.getColor(R.styleable
                    .CommonHeaderBar_layout_background, getResources().getColor(R.color
                    .colorWhite)));

            int left_img_visible = typedArray.getInteger(R.styleable
                    .CommonHeaderBar_left_img_visible, 0);
            int left_text_visible = typedArray.getInteger(R.styleable
                    .CommonHeaderBar_left_text_visible, 0);
            int right_text_visible = typedArray.getInteger(R.styleable
                    .CommonHeaderBar_right_text_visible, 0);
            int right_img_visible = typedArray.getInteger(R.styleable
                    .CommonHeaderBar_right_img_visible, 0);
            setViewStatus(left_img_visible, leftImg);
            setViewStatus(left_text_visible, leftTitle);
            setViewStatus(right_text_visible, rightTitle);
            setViewStatus(right_img_visible, rightImg);

            leftImg.setImageResource(typedArray.getResourceId(R.styleable
                    .CommonHeaderBar_left_img_drawable, R.mipmap.icon_user_friend));
            rightImg.setImageResource(typedArray.getResourceId(R.styleable
                    .CommonHeaderBar_right_img_drawable, R.mipmap.icon_arrow_right));

            leftTitle.setTextColor(typedArray.getColor(R.styleable
                    .CommonHeaderBar_left_title_color, getResources().getColor(R
                    .color.colorTextColor)));
            leftTitle.setText(typedArray.getResourceId(R.styleable
                    .CommonHeaderBar_left_title_text, R.string.middle_title));

            rightTitle.setTextColor(typedArray.getColor(R.styleable
                    .CommonHeaderBar_right_title_color, getResources().getColor(R
                    .color.colorTextColor)));
            rightTitle.setText(typedArray.getResourceId(R.styleable
                    .CommonHeaderBar_right_title_text, R.string.right_title));

            typedArray.recycle();
        }
    }

    private void setViewStatus(int flag, View view) {
        switch (flag) {
            case 0:
                view.setVisibility(VISIBLE);
                break;
            case 1:
                view.setVisibility(INVISIBLE);
                break;
            case 2:
                view.setVisibility(GONE);
                break;
            default:
                view.setVisibility(VISIBLE);
                break;
        }
    }

    @Override
    protected int layoutId() {
        return R.layout.common_head_layout;
    }

}

CustomizeViewFragment里的代码如下：

public class CustomizeViewFragment extends BaseFragment {
    Unbinder unbinder;
    @BindView(R.id.title_layout)
    CommonTitleBar titleLayout;
    @BindView(R.id.header_layout)
    CommonHeaderBar headerLayout;
    @BindView(R.id.header_layout2)
    CommonHeaderBar headerLayout2;
    @BindView(R.id.header_layout3)
    CommonHeaderBar headerLayout3;
    @BindView(R.id.header_layout4)
    CommonHeaderBar headerLayout4;

    @Override
    protected int getLayoutId() {
        return R.layout.fragment_common_view;
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle
            savedInstanceState) {
        View rootView = super.onCreateView(inflater, container, savedInstanceState);
        unbinder = ButterKnife.bind(this, rootView);
        return rootView;
    }

    @Override
    protected void init() {
        titleLayout.setOnChildViewClickListener(new OnChildViewClickListener() {
            @Override
            public void onChildViewClick(View childView, String action, Object obj) {
                switch (action) {
                    case "left_img":
                        getActivity().finish();
                        break;
                    default:
                        break;
                }
            }
        });

        headerLayout.findViewById(R.id.right_title).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                toast("right_title");
            }
        });
        headerLayout2.findViewById(R.id.left_title).setOnClickListener(new View
                .OnClickListener() {
            @Override
            public void onClick(View v) {
                toast("left_title");
            }
        });
        headerLayout4.findViewById(R.id.left_img).setOnClickListener(new View
                .OnClickListener() {
            @Override
            public void onClick(View v) {
                toast("left_img");
            }
        });
    }

    @Override
    public void onDestroyView() {
        super.onDestroyView();
        unbinder.unbind();
    }

    @OnClick({R.id.header_layout, R.id.header_layout2, R.id.header_layout3, R.id.header_layout4})
    public void onViewClicked(View view) {
        switch (view.getId()) {
            case R.id.header_layout:
                toast("header_layout");
                break;
            case R.id.header_layout2:
                toast("header_layout2");
                break;
            case R.id.header_layout3:
                toast("header_layout3");
                break;
            case R.id.header_layout4:
                toast("header_layout4");
                break;
        }
    }
}

CustomizeViewFragment的布局如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:king="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.jzf.myactivity.view.CommonTitleBar
        android:id="@+id/title_layout"
        android:layout_width="match_parent"
        android:layout_height="@dimen/common_title_height"
        king:layout_background="@color/colorPrimary"
        king:middle_title_color="@color/colorWhite"
        king:middle_title_text="@string/middle_title"
        king:right_text_visible="true"
        king:right_title_color="@color/colorWhite"
        king:right_title_text="@string/right_title">
    </com.jzf.myactivity.view.CommonTitleBar>

    <com.jzf.myactivity.view.CommonHeaderBar
        android:id="@+id/header_layout"
        android:layout_width="match_parent"
        android:layout_height="@dimen/common_header_height"
        android:layout_marginBottom="1dp"
        king:layout_background="@color/colorLightGray">
    </com.jzf.myactivity.view.CommonHeaderBar>

    <com.jzf.myactivity.view.CommonHeaderBar
        android:id="@+id/header_layout2"
        android:layout_width="match_parent"
        android:layout_height="@dimen/common_header_height"
        android:layout_marginBottom="1dp"
        android:paddingLeft="10dp"
        king:layout_background="@color/colorLightGray"
        king:left_img_visible="2"
        king:right_text_visible="2">
    </com.jzf.myactivity.view.CommonHeaderBar>

    <com.jzf.myactivity.view.CommonHeaderBar
        android:id="@+id/header_layout3"
        android:layout_width="match_parent"
        android:layout_height="@dimen/common_header_height"
        android:layout_marginBottom="1dp"
        king:layout_background="@color/colorLightGray"
        king:left_text_visible="1">
    </com.jzf.myactivity.view.CommonHeaderBar>

    <com.jzf.myactivity.view.CommonHeaderBar
        android:id="@+id/header_layout4"
        android:layout_width="match_parent"
        android:layout_height="@dimen/common_header_height"
        king:layout_background="@color/colorLightGray"
        king:left_text_visible="1"
        king:right_text_visible="2">
    </com.jzf.myactivity.view.CommonHeaderBar>
</LinearLayout>

最后贴图

https://github.com/jinzifu/myactivity.git