自定义带图标文字分割线通用布局，用于列表布局的设置、菜单页的item

做过的几乎所有项目中，设置菜单都是这个调调，左边一个图标，加上文字，右边一个箭头代表可点击。

看到原型，冷哼一声，没创意，so sasy，于是开始写布局：

<RelativeLayout
                    android:id="@+id/btn_profile"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@color/white"
                    android:gravity="center_vertical"
                    android:orientation="horizontal"
                    android:paddingBottom="20dp"
                    android:paddingRight="10dp"
                    android:paddingTop="10dp" >


                    <TextView
                        style="@style/titleTextStyle"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="10dp"
                        android:text="个人资料" />


                    <ImageView
                        android:layout_width="16dp"
                        android:layout_height="18dp"
                        android:layout_alignParentRight="true"
                        android:scaleType="fitXY"
                        android:src="@drawable/rightarrow" />
                </RelativeLayout>

写着写着懒癌开始发作。

页面上列表少还好，十来个菜单的话，xml简直是不忍直视。

单个item还要加点击事件，分配ID，xml改起来绝对是看花眼。

实在是不能忍了，本着能偷懒就偷懒的原则。自定义了一个控件，xml中放入一个控件即代表一行，在xml中配置图标文字即可。

上代码：

/**
 * 基础的带图片的列表菜单
 * 
 * @author huangxz
 *
 */
public class ClickableListItem extends LinearLayout {


	private boolean containIcon;


	private String title;


	private int iconSrc;


	private int textColor;


	private int textSize;


	private LinearLayout container;


	// px
	private int paddingContainer = dip2px(getContext(), 10);


	private int tvPadding = dip2px(getContext(), 5);


	public ClickableListItem(Context context) {
		super(context);
		init();
	}


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


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


		TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.ClickableListItem, defStyle, 0);


		containIcon = a.getBoolean(R.styleable.ClickableListItem_containIcon, false);


		title = a.getString(R.styleable.ClickableListItem_text);


		iconSrc = a.getResourceId(R.styleable.ClickableListItem_imgsrc, R.drawable.ic_launcher);


		textColor = a.getColor(R.styleable.ClickableListItem_textColor, R.color.gray);


		textSize = a.getDimensionPixelSize(R.styleable.ClickableListItem_textSize, 14);


		a.recycle();


		init();


	}


	private void init() {


		container = new LinearLayout(getContext());
		LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
		container.setLayoutParams(params);
		container.setGravity(Gravity.CENTER_VERTICAL);
		container.setPadding(paddingContainer, paddingContainer, paddingContainer, paddingContainer);
		container.setBackgroundResource(R.color.white);
		// 添加tv元素
		TextView tv = new TextView(getContext());
		LayoutParams tvParam = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
		tvParam.weight = 1;
		tv.setLayoutParams(tvParam);


		tv.setPadding(tvPadding, tvPadding, tvPadding, tvPadding);
		tv.setText(title);
		tv.setTextColor(textColor);
		tv.setTextSize(px2sp(getContext(), textSize));
		tv.setGravity(Gravity.CENTER_VERTICAL);


		if (containIcon) {
			Drawable d = getContext().getDrawable(iconSrc);
			d.setBounds(0, 0, d.getMinimumWidth(), d.getMinimumHeight());// 必须设置图片大小，否则不显示
			tv.setCompoundDrawables(d, null, null, null);
		}
		// 添加img元素
		ImageView iv = new ImageView(getContext());
		LayoutParams ivParam = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
		iv.setLayoutParams(ivParam);
		iv.setImageDrawable(getResources().getDrawable(R.drawable.ic_pre_point_normal));
		//
		container.addView(tv);
		container.addView(iv);


		addView(container);
	}


	private int dip2px(Context context, float dpValue) {
		final float scale = context.getResources().getDisplayMetrics().density;
		return (int) (dpValue * scale + 0.5f);
	}


	private int px2sp(Context context, float pxValue) {
		final float fontScale = context.getResources().getDisplayMetrics().scaledDensity;
		return (int) (pxValue / fontScale + 0.5f);
	}
}

attrs中定义属性：

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


    <declare-styleable name="ClickableListItem">
        <attr name="text" format="string" />
        <attr name="containIcon" format="boolean" />
        <attr name="imgsrc" format="reference|color" />
        <attr name="textColor" format="reference|color" />
        <attr name="textSize" format="dimension" />
        <attr name="hasdivider" format="boolean" />
    </declare-styleable>

</resources>

项目中这样引用：

   <com.heshun.sunny.widget.ClickableListItem
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app1:containIcon="true"
                app1:imgsrc="@drawable/walletpic"
                app1:text=" 我的钱包"
                app1:textColor="@color/gray"
                app1:textSize="16sp" />

就这么轻松搞定：