1、比如要實現下面的這種效果:
2、首先實現佈局效果,新建佈局文件layout_custom
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="52dp">
<ImageView
android:id="@+id/iv_icon"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginStart="20dp"
android:src="@mipmap/ic_launcher" />
<TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginStart="16dp"
android:layout_toEndOf="@+id/iv_icon"
android:textSize="18dp"
tools:text="title" />
<ImageView
android:id="@+id/iv_arrow"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:layout_marginEnd="16dp"
android:src="@mipmap/ic_launcher" />
<TextView
android:id="@+id/tv_msg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginRight="@dimen/dp_10"
android:layout_toStartOf="@id/iv_arrow"
android:textSize="15dp"
tools:text="0" />
<View
android:id="@+id/v_driver"
android:layout_width="match_parent"
android:layout_height="1px"
android:layout_alignParentBottom="true"
android:background="@color/colorAccent" />
</RelativeLayout>
3、在項目values文件夾下新建attrs.xml,設置組合控件屬性
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="CommonValueView">
<attr name="title" format="string" />
<attr name="left_img_visible" format="boolean" />
<attr name="right_img_visible" format="boolean" />
<attr name="divider_line" format="color" />
<attr name="divider_visibility" format="boolean" />
<attr name="left_img" format="reference|integer" />
<attr name="right_img" format="reference|integer" />
</declare-styleable>
</resources>
4、新建CustomLayout繼續RelativeLayout,初始化控件
private void initView(Context context) {
View.inflate(context, R.layout.layout_custom, this);
left_img = this.findViewById(R.id.iv_icon);
right_img = this.findViewById(R.id.iv_arrow);
title = this.findViewById(R.id.tv_title);
driver = this.findViewById(R.id.v_driver);
msg = this.findViewById(R.id.tv_msg);
}
獲取自定義控件屬性
TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.CommonValueView);
String title = array.getString(R.styleable.CommonValueView_title);
boolean leftShow = array.getBoolean(R.styleable.CommonValueView_left_img_visible, true);
boolean rightShow = array.getBoolean(R.styleable.CommonValueView_right_img_visible, true);
boolean driverShow = array.getBoolean(R.styleable.CommonValueView_divider_visibility, true);
int color = array.getColor(R.styleable.CommonValueView_divider_line, ContextCompat.getColor(context, R.color.colorPrimary));
int leftImg = array.getResourceId(R.styleable.CommonValueView_left_img, R.mipmap.ic_launcher);
int rightImg = array.getResourceId(R.styleable.CommonValueView_right_img, R.mipmap.ic_launcher);
然後再根據自己的需求,實現自己想要的結果
5、完整CustomLayout
public class CustomLayout extends RelativeLayout {
private ImageView left_img;
private TextView title;
private ImageView right_img;
private View driver;
private TextView msg;
public CustomLayout(Context context) {
super(context);
initView(context);
}
public CustomLayout(Context context, AttributeSet attrs) {
super(context, attrs);
initView(context);
TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.CommonValueView);
String title = array.getString(R.styleable.CommonValueView_title);
boolean leftShow = array.getBoolean(R.styleable.CommonValueView_left_img_visible, true);
boolean rightShow = array.getBoolean(R.styleable.CommonValueView_right_img_visible, true);
boolean driverShow = array.getBoolean(R.styleable.CommonValueView_divider_visibility, true);
int color = array.getColor(R.styleable.CommonValueView_divider_line, ContextCompat.getColor(context, R.color.colorPrimary));
int leftImg = array.getResourceId(R.styleable.CommonValueView_left_img, R.mipmap.ic_launcher);
int rightImg = array.getResourceId(R.styleable.CommonValueView_right_img, R.mipmap.ic_launcher);
if (leftShow) {
left_img.setVisibility(VISIBLE);
} else {
left_img.setVisibility(GONE);
}
if (rightShow) {
right_img.setVisibility(VISIBLE);
} else {
right_img.setVisibility(GONE);
}
if (driverShow) {
driver.setVisibility(View.VISIBLE);
} else {
driver.setVisibility(View.GONE);
}
this.title.setText(title);
this.left_img.setImageResource(leftImg);
this.right_img.setImageResource(rightImg);
this.driver.setBackgroundColor(color);
}
public CustomLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initView(context);
}
private void initView(Context context) {
View.inflate(context, R.layout.layout_custom, this);
left_img = this.findViewById(R.id.iv_icon);
right_img = this.findViewById(R.id.iv_arrow);
title = this.findViewById(R.id.tv_title);
driver = this.findViewById(R.id.v_driver);
msg = this.findViewById(R.id.tv_msg);
}
}
6、使用
<com.zy.view.CustomLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:divider_line="@color/colorPrimaryDark"
app:layout_constraintTop_toBottomOf="@+id/tv_start"
app:left_img_visible="false" />