android自定义view复用UI

前言：项目搭建UI中，我们总会遇到很多都是地方重复样式，比如：

现在来学习一下如何自定义一个UI模块，重复利用提高开发效率以及避免代码冗余。

自定义UI模块步骤：

一、先贴出一个案例：

1.自定义view类（ServiceView ）

public class ServiceView extends LinearLayout {

    private TextView tv_content; //右边显示的内容
    private TextView tv_name;   //条目title
    private ImageView iv_pic;   //左边图片
    private ImageView iv_arrow; //向右的箭头

    String mtitle, mcontent;
    boolean mArrow; //右边箭头
    int imgid;

    //用代码new对象时
    public ServiceView(Context context) {
        super(context);
        initView();
    }

    //有属性时
    public ServiceView(Context context, AttributeSet attrs) {
        super(context, attrs);
        TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.ServiceView);
        mtitle = ta.getString(R.styleable.ServiceView_mtitle);
        mcontent = ta.getString(R.styleable.ServiceView_mcontent);
        imgid = ta.getResourceId(R.styleable.ServiceView_mimg, imgid);
        mArrow = ta.getBoolean(R.styleable.ServiceView_mright, true);
        ta.recycle();
        initView();
    }

    //有style样式时候
    public ServiceView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView();
    }

    /**
     * 初始化布局
     */
    private void initView() {
        //把布局文件设置给当前的ServiceView
        View.inflate(getContext(), R.layout.view_serviceapply_item, this);
        tv_name = (TextView) findViewById(R.id.tv_name);
        tv_content = (TextView) findViewById(R.id.tv_content);
        iv_pic = (ImageView) findViewById(R.id.iv_pic);
        iv_arrow = (ImageView) findViewById(R.id.iv_arrow);
        setTitle(mtitle);
        setDesc(mcontent);
        setImg(imgid);
        setArrow(mArrow);
    }

    //向外暴露接口
    public void setTitle(String title) {
        tv_name.setText(title);
    }

    public void setDesc(String desc) {
        tv_content.setText(desc);
    }

    public void setImg(int img) {
        iv_pic.setImageResource(img);
    }

    public void setArrow(boolean isShow) {
        iv_arrow.setVisibility(isShow ? VISIBLE : GONE);
    }

}

2.自定义view布局文件——R.layout.view_serviceapply_item（根据需求自己定义就ok）

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/theme_white"

    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="74px"
        android:gravity="center_vertical"
        android:orientation="horizontal"
        android:paddingLeft="20px"
        android:paddingRight="24px">

        <ImageView
            android:id="@+id/iv_pic"
            android:layout_width="44px"
            android:layout_height="44px"
            android:scaleType="center"
            android:src="@mipmap/school" />

        <TextView
            android:id="@+id/tv_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginLeft="28px"
            android:text="学校"
            android:textColor="#494949"
            android:textSize="27px" />


        <View
            android:layout_width="0px"
            android:layout_height="match_parent"
            android:layout_weight="1" />

        <TextView
            android:id="@+id/tv_content"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:layout_marginRight="18px"
            android:text=""
            android:textColor="#b2b2b6"
            android:textSize="24px" />

        <ImageView
            android:id="@+id/iv_arrow"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/next" />

    LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="2px"
        android:background="#dbdbdb" />
LinearLayout>

3.自定义属性（values文件下创建attrs.xml）

 <declare-styleable name="ServiceView">
        <attr name="mtitle" format="string" />
        <attr name="mcontent" format="string" />
        <attr name="mimg" format="reference" />
        <attr name="mright" format="boolean" />
    declare-styleable>

4.自定义共用view完成，看看一下使用方法

<com.cysd.fr_edu.view.ServiceView
                android:id="@+id/view_school"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                attrs:mimg="@mipmap/school"
                attrs:mtitle="学校" />

二、上面案例仅供参考，大家可以根据需求自定义view，比如很多标题栏….等等，共用UI的地方就这样做，开发起来方便快捷，这也是我们开发者必须要形成的一个思想，能封装就不冗余，能共用就不重复。

end.
欢迎留言指教！