自定义组合控件
当系统提供的控件,不足以满足我们开发需求时,可以通过自定义控件来实现更好的效果。
组合控件的实现步骤
1. 先设定组合控件的布局
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp">
<TextView
android:id="@+id/tv_setting_update"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="@+id/tv_setting_update_hint"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/tv_setting_update"
android:layout_marginTop="3dp"
android:textSize="18sp"
android:textStyle="bold" />
<CheckBox
android:id="@+id/cb_setting_update"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true" />
<View
android:layout_width="wrap_content"
android:layout_height="1dp"
android:layout_below="@+id/tv_setting_update_hint"
android:layout_marginTop="3dp"
android:background="#000" />
</RelativeLayout>
2. 为组合控件制定使用控件时的属性
res --> value --> 建立attrs.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="CustomSettingItemView">
<attr name="clauseTitle" format="string" />
<attr name="stateOff" format="string" />
<attr name="stateOn" format="string" />
</declare-styleable>
</resources>
3. 创建类集成RelativeLayout用来定义组合控件
public class CustomSettingItemView extends RelativeLayout {
private TextView mTvSettingUpdateHint;
private TextView mTvSettingUpdateTitle;
private CheckBox cbSettingUpdate;
private String mClauseTitle;
private String mStateOff;
private String mStateOn;
//通过Java代码创建控件时调用
public CustomSettingItemView(Context context) {
this(context, null);
}
//添加到布局文件后,系统调用
public CustomSettingItemView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
//添加到布局文件后系统调用
public CustomSettingItemView(Context context,
AttributeSet attrs,
int defStyleAttr) {
super(context, attrs, defStyleAttr);
//将布局添加进来,相当于
//View view = View.inflate(context, R.layout.custom_item, null);
//addView(view);
LayoutInflater.from(context).inflate(R.layout.custom_item, this, true);
initAttrs(context, attrs);
initView();
}
private void initAttrs(Context context, AttributeSet attrs) {
//读取attrs里面设置的属性,创建控件时传递的值
TypedArray typedArray = context.obtainStyledAttributes(
attrs,
R.styleable.CusSettingItem);
mClauseTitle = typedArray.getString(R.styleable.CusSettingItem_clauseTitle);
mStateOff = typedArray.getString(R.styleable.CusSettingItem_stateOff);
mStateOn = typedArray.getString(R.styleable.CusSettingItem_stateOn);
typedArray.recycle();
}
private void initView() {
mTvSettingUpdateHint = findViewById(R.id.tv_setting_update_hint);
mTvSettingUpdateTitle = findViewById(R.id.tv_setting_update);
cbSettingUpdate = findViewById(R.id.cb_setting_update);
mTvSettingUpdateTitle.setText(mClauseTitle);
}
//返回当前check的选中状态
public boolean isChecked() {
return cbSettingUpdate.isChecked();
}
//给当前Check设置选中状态
public void setChecked(boolean isChecked) {
cbSettingUpdate.setChecked(isChecked);
if (isChecked) {
mTvSettingUpdateHint.setText(mStateOn);
} else {
mTvSettingUpdateHint.setText(mStateOff);
}
}
}
4. 使用
<LinearLayout 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="match_parent"
android:orientation="vertical"
tools:context=".ui.activity.MainActivity">
<com.w.demo.ui.view.CustomSettingItemView
android:id="@+id/cs_setting_item_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:clauseTitle="自动更新设置"
app:stateOff="自动更新关闭"
app:stateOn="自动更新开启" />
</LinearLayout>
public class MainActivity extends AppCompatActivity {
private CustomSettingItemView mCustomSettingItemView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
private void initView() {
mCustomSettingItemView = findViewById(R.id.cs_setting_item_view);
mCustomSettingItemView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
boolean checked = mCustomSettingItemView.isChecked();
mCustomSettingItemView.setChecked(!checked);
}
});
}
}
事件传递响应规则
思考:
当你给你组合控件整体加一个点击事件后,会出现
当你点击这个控件整体时,CheckBox依旧能触发CheckBox的事件,并且这种触发会让代码逻辑发生错乱。
出现这种问题的原因就要探究一下事件传递和响应的规则了。
事件传递过程
当定义的组合控件的Activity的根布局,获取点击事件
事件传递给组合控件,出现两种情况
1. 点击非CheckBox区域,事件由组合控件本身响应。
2. 点击CheckBox区域,事件由组合控件传递给CheckBox,由CheckBox响应。
然后由于 CheckBox 响应了点击事件,组合控件将不再响应点击事件,不去调用onClick改变状态。
事件响应回传
事件从外到内传递
如果最内部的事件没有响应,则会沿传递顺序,逐层向外回传回去。
解决这中情况的办法
1. 拦截事件,让CheckBox不响应,通过回传,让组合控件响应事件。
添加属性
android:focusable="false"
android:clickable="false"
android:focusableInTouchMode="false"
<CheckBox
android:id="@+id/cb_setting_update"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:focusable="false"
android:clickable="false"
android:focusableInTouchMode="false"
android:layout_centerVertical="true" />