做过的几乎所有项目中,设置菜单都是这个调调,左边一个图标,加上文字,右边一个箭头代表可点击。
看到原型,冷哼一声,没创意,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" />
就这么轻松搞定: