前言:
现在市面上有很多需要判定当前的选项被选中然后在前面显示一个勾表示选中的效果,这种效果的实现方式有很多种,比如用一个button和一张图片来组合,下面是实现步骤。。先来看看简单的原型图:
步骤一:
自定义一个类,然后去继承一个Layout,这个layout可以是RelativeLayout,也可以是LinearLayout,也可以是ViewGroup,然后创建XML文件代码:
LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android”
android:id=”@+id/llyt_item_filter_bg”
android:layout_width=”match_parent”
android:layout_height=”@dimen/shopping_list_flilter_input_height”
android:clickable=”true”
android:gravity=”center”
android:orientation=”horizontal”
android:paddingLeft=”@dimen/common_margin10dp”
android:paddingRight=”@dimen/common_margin10dp”
android:weightSum=”1”>
<ImageView
android:id="@+id/iv_selected"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/hook_icon" />
<ToggleButton
android:id="@+id/tb_item"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@null"
android:button="@null"
android:clickable="false"
android:ellipsize="end"
android:maxLines="1"
android:textOff="@string/shopping_list_flilter_sales"
android:textOn="@string/shopping_list_flilter_sales"
android:textSize="@dimen/shopping_list_filter_item_font_size" />
LinearLayout>
步骤二:重写继承layout的三个构造方法,在第三个构造发方法中去获取xml文件里面的控件,然后定义我们需要的方法。
方法一:选中与未选中的判定:
private boolean checked;
public boolean isChecked() {
return checked;
}
public void setChecked(boolean checked) {
this.checked = checked;
if (checked) {
tbItem.setChecked(true);
llytItemFilterBg.setBackgroundDrawable(getResources().getDrawable(R.drawable.shape_filter_item_red_bg));
tbItem.setTextColor(getResources().getColorStateList(R.color.color_title_bg));
ivSelected.setVisibility(VISIBLE);
} else {
tbItem.setChecked(false);
ivSelected.setVisibility(GONE);
llytItemFilterBg.setBackgroundDrawable(getResources().getDrawable(R.drawable.shape_filter_item_default_bg));
tbItem.setTextColor(getResources().getColorStateList(R.color.color_default_font_color));
}
}
方法二:设置和获取文字
public String getText() {
return tbItem.getText() + "";
}
public void setText(String text) {
tbItem.setText(text);
tbItem.setTextOff(text);
tbItem.setTextOn(text);
}
方法三:重写onFinishInflate方法
@Override
protected void onFinishInflate() {
super.onFinishInflate();
setChecked(false);
}
OK,到这里一个完整的筛选控件就完成了,谢谢!