android自定义view复用UI

来源:互联网 发布:淘宝美宝莲旗舰店 编辑:程序博客网 时间:2024/05/20 08:44

前言:项目搭建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)

<?xml version="1.0" encoding="utf-8"?><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.
欢迎留言指教!

0 0
原创粉丝点击