Android各控件实现背景选中效果总结
前言
selector实现背景选中替换效果，很容易的一个东西，但每次用到都很容易把各控件的使用方法记混，索性写一篇总结方便下次查找。本篇总结的控件包括CheckBox、ImageButton、RadioButton、Button、ImageView。推荐使用CheckBox，下面让我们来分析各控件的使用方法以及为什么推荐使用CheckBox
效果图如下
CheckBox
使用步骤
1、创建checkbox_bg.xml文件
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="@mipmap/open" />
<item android:state_checked="false" android:drawable="@mipmap/close" />
<item android:drawable="@mipmap/close" />
selector>2、布局文件里添加
"@+id/cb_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/tv_cb"
android:layout_marginTop="10dp"
android:button="@drawable/checkbox_bg" /> 分析
操作简单、方便、图片无变形，推荐使用
ImageButton
使用步骤
1、创建imagebutton_bg.xml文件
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@mipmap/open" android:state_pressed="true"/>
<item android:drawable="@mipmap/open" android:state_selected="true"/>
<item android:drawable="@mipmap/close" android:state_enabled="true"/>
selector>2、布局里添加
"@+id/ib_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@null"
android:layout_below="@id/tv_ib"
android:layout_marginTop="10dp"
android:src="@drawable/imagebutton_bg"/> 3、activity里添加监听判断
ibButton = (ImageButton) findViewById(R.id.ib_button);
ibButton.setOnClickListener(this);
boolean ibFlag = false;
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.ib_button:
if (!ibFlag){
ibFlag = true;
ibButton.setSelected(true);
} else {
ibFlag = false;
ibButton.setSelected(false);
}
break;
}
}分析
需手动添加判断，设置其是否有选中效果，如不加判断则只有点击效果，图片无变形，可使用
RadioButton
使用步骤
1、创建radiobutton_bg.xml文件
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@mipmap/open" android:state_pressed="true" />
<item android:drawable="@mipmap/open" android:state_focused="true" />
<item android:drawable="@mipmap/open" android:state_checked="true" />
<item android:drawable="@mipmap/close"/>
selector>2、在布局文件里添加
"@+id/rb_group"
android:layout_below="@id/tv_rg"
android:layout_marginTop="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
"@+id/rb_button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="@null"
android:background="@drawable/radiobutton_bg"/>
"@+id/rb_button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:button="@null"
android:background="@drawable/radiobutton_bg"/>
</RadioGroup> 分析
RadioButton如果是单个使用只有选中效果，无法取消，如果想要有选中取消效果，必须和RadioGroup结合使用，且同时只能选中一个，图片稍微有变形，所以如果是单选选中效果不推荐使用
Button
使用步骤
1、创建button_bg.xml文件
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@mipmap/open" android:state_pressed="true"/>
<item android:drawable="@mipmap/open" android:state_selected="true"/>
<item android:drawable="@mipmap/open" android:state_focused="true"/>
<item android:drawable="@mipmap/close" />
selector>2、布局文件里添加
3、activity里添加监听判断
bButton = (Button) findViewById(R.id.b_button);
bButton.setOnClickListener(this);
boolean bFlag = false;
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.b_button:
if (!bFlag){
bFlag = true;
bButton.setSelected(true);
} else {
bFlag = false;
bButton.setSelected(false);
}
break;
}
}分析
图片变形严重，需要设置固定宽高，需手动添加判断，设置其是否有选中效果，如不加判断则只有点击效果，可实现效果，但不推荐使用
ImageView
使用步骤
1、创建imageview_bg.xml文件
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@mipmap/open" android:state_pressed="true"/>
<item android:drawable="@mipmap/open" android:state_selected="true"/>
<item android:drawable="@mipmap/open" android:state_focused="true"/>
<item android:drawable="@mipmap/close" />
selector>2、布局文件里添加
"@+id/iv_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/tv_iv"
android:layout_marginTop="10dp"
android:clickable="true"
android:background="@drawable/imageview_bg"/> 3、activity里添加
ivButton = (ImageView) findViewById(R.id.iv_button);
ivButton.setOnClickListener(this);
boolean ivFlag = false;
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.iv_button:
if (!ivFlag){
ivFlag = true;
ivButton.setSelected(true);
} else {
ivFlag = false;
ivButton.setSelected(false);
}
break;
}
}分析
需手动添加判断，设置其是否有选中效果，如不加判断则只有点击效果，图片无变形，可使用
总结
通过以上的对比，CheckBox是最简洁、方便、效果不错的做法，推荐使用~