背景
很多时候,我们的App里面存在一些重复使用的布局,每次都需要使用大量xml代码去布局,特别是遇到要整体修改的时候,那就得一个一个去修改,即使使用了通用的style,也会有大量要修改的情况。比如以下布局:
[图片上传失败...(image-ee9904-1533625594498)]
以上布局的每一行都需要使用以下layout去布局,这是非常繁琐的,所以我想到了将以下布局定义成一个View,让其成为一个类似TextView或者Button的控件。
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
style="@style/BaseRelativeLayout.DigitalClickItem">
<ImageView
android:id="@+id/iv_left_icon"
style="@style/BaseImageView.Left"/>
<TextView
android:id="@+id/tv_left_text"
style="@style/BaseTextView.DigitalClickItem.Left"
android:layout_toRightOf="@+id/iv_left_icon"/>
<TextView
android:id="@+id/tv_right_text"
style="@style/BaseTextView.DigitalClickItem.Right"
android:layout_toLeftOf="@+id/iv_right_icon"/>
<ImageView
android:id="@+id/iv_right_icon"
style="@style/BaseImageView.Right"/>
</RelativeLayout>
<View
android:id="@+id/v_middle_line"
style="@style/dci_middle_line_v_style"/>
</LinearLayout>
以上layout最终会精简为:
<com.sample.ui.view.DigitalClickItem
android:id="@+id/dci_ac_info"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:isShowLine="true"
app:left_icon="@mipmap/icon_mine_ac_info"
app:left_text="@string/account_info"/>
具体实现
我把最终的这个View成为DigitalClickItem,由于此文章只介绍操作原理,具体的代码会作为个sample在文后供大家下载。以下是实现步骤:
1.你还是需要写一个实现以下效果的,layout_digital_comm_click_item.xml
[图片上传失败...(image-3579e5-1533625594498)]
2.需要定义一个继承View或它子类的类,我这里选择的是FrameLayout,为什么?继承它你可以使用它很多常用的方法,比如onMeasure、setForegroundGravity。
public class DigitalClickItem extends FrameLayout {
private ImageView mLeftIconIv;
private TextView mLeftTextTv;
private TextView mRightTextTv;
private ImageView mRightIconIv;
private View mMiddleLineV;
public DigitalClickItem(Context context) {
super(context);
}
public DigitalClickItem(Context context, AttributeSet attrs) {
super(context, attrs);
View view = LayoutInflater.from(context).inflate(R.layout.layout_digital_comm_click_item, this);
mLeftIconIv = (ImageView) view.findViewById(R.id.iv_left_icon);
mLeftTextTv = (TextView) view.findViewById(R.id.tv_left_text);
mRightTextTv = (TextView) view.findViewById(R.id.tv_right_text);
mRightIconIv = (ImageView) view.findViewById(R.id.iv_right_icon);
mMiddleLineV = view.findViewById(R.id.v_middle_line);
initAttrs(attrs);
}
...
3.这个时候你还需要考虑,这个DigitalClickItem需要什么自定义的属性可以被定义,比如left_icon和left_text等等。
<com.sample.ui.view.DigitalClickItem
android:id="@+id/dci_ac_info"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:isShowLine="true"
app:left_icon="@mipmap/icon_mine_ac_info"
app:left_text="@string/account_info"/>
在DigitalClickItem的构造函数里接受了个来自xml的参数attrs,在java代码里需要对这个AttributeSet这个属性进行解析,然后设置到具体的控件里:
private void initAttrs(AttributeSet attrs) {
TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.DigitalClickItem);
try {
Drawable mDrawableLeft = typedArray.getDrawable(R.styleable.DigitalClickItem_left_icon);
Drawable mDrawableRight = typedArray.getDrawable(R.styleable.DigitalClickItem_right_icon);
String mStringLeft = typedArray.getString(R.styleable.DigitalClickItem_left_text);
String mStringRight = typedArray.getString(R.styleable.DigitalClickItem_right_text);
Boolean isShowLine = typedArray.getBoolean(R.styleable.DigitalClickItem_isShowLine, false);
Boolean isShowRightIcon = typedArray.getBoolean(R.styleable.DigitalClickItem_isShowRightIcon, true);
if (mDrawableLeft != null) {
mLeftIconIv.setImageDrawable(mDrawableLeft);
} else {
mLeftIconIv.setVisibility(GONE);
}
if (mDrawableRight != null)
mRightIconIv.setImageDrawable(mDrawableRight);
if (mStringLeft != null)
mLeftTextTv.setText(mStringLeft);
if (mStringLeft != null)
mRightTextTv.setText(mStringRight);
if (isShowLine) mMiddleLineV.setVisibility(View.VISIBLE);
if (!isShowRightIcon) mRightIconIv.setVisibility(INVISIBLE);
} finally {
typedArray.recycle();
}
}
TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.DigitalClickItem);
obtainStyledAttributes方法将layout设置的属性对象attrs和属性模板传入,属性模板我们已经在res/value/attrs.xml里定义:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="DigitalClickItem">
<attr name="left_icon" format="integer"/>
<attr name="right_icon" format="integer"/>
<attr name="left_text" format="integer"/>
<attr name="right_text" format="integer"/>
<attr name="isShowRightIcon" format="boolean"/>
<attr name="isShowLine" format="boolean"/>
</declare-styleable>
</resources>
4.最后,我们可以在layout里使用DigitalClickItem了,需要注意的是要在使用自定义属性的layout里加上下面这个命名空间:
xmlns:app="http://schemas.android.com/apk/res-auto"
下载地址
好吧,文章写得有点烂,送上代码:下载地址