RadioButtn单选按钮,常用UI控件之一,当需要多选一的时候就需要用到RadioButtn了,通常系统自带的样式不能直接使用,大部分都是需要自定义样式,下面详细介绍一下如何使用及如何自定义样式
预览
基本使用
RadioButtn需要放在RadioGroup中
xml文件
<RadioGroup
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<RadioButton
android:id="@+id/rb_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/rb_left_selector"
android:button="@null"
android:checked="true"
android:gravity="center"
android:text="左"
android:textColor="@color/rb_selector"
android:textSize="20sp" />
<RadioButton
android:id="@+id/rb_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/rb_right_selector"
android:button="@null"
android:gravity="center"
android:text="右"
android:textColor="@color/rb_selector"
android:textSize="20sp" />
</RadioGroup>
重要属性介绍:
android:orientation=" " horizontal | vertical
水平或垂直显示android:checked=" "
设置默认选中android:button=" "
修改自带图片的样式。如果只是单纯的图片,可以直接添加drawable,如果带文字效果,建议设置为@null并使用android:background
或android:drawable
android:background=" "
设置背景android:drawableTop=" "|android:drawableBottom=" "|android:drawableLeft=" "|android:drawableRight=" "
这四个分别对应显示在文字的上下左右android:drawablePadding=" "
文字距离图片的距离
图片切换的selector.xml,放到res/drawable下
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="@mipmap/rb_left_select"/>
<item android:state_selected="true" android:drawable="@mipmap/rb_left_select"/>
<item android:state_checked="true" android:drawable="@mipmap/rb_left_select"/>
<item android:drawable="@mipmap/rb_left"/>
</selector>
文字颜色切换的selector.xml,这个放到res/color下,如果没有color请新建
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#ffffff"/>
<item android:state_pressed="true" android:color="#ffffff"/>
<item android:state_selected="true" android:color="#ffffff"/>
<item android:color="#000000"/>
</selector>
监听事件
rg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
// 判断选中哪个
switch (checkedId) {
case R.id.rb_man:
Log.e(TAG, "rb_left");
break;
case R.id.rb_woman:
Log.e(TAG, "rb_right");
break;
default:
break;
}
}
});
// 获取选中的值
RadioButton radioButton = (RadioButton)findViewById(rg.getCheckedRadioButtonId());
tv.setText(radioButton.getText().toString());
注意事项:
- 选择时如果点击没有切换,都为选中状态,请为每个radiobutton设置id
- 使用
android:background
或android:drawable
时需要设置android:button="@null"
- 如果三个或三个以上选项时,选择的时候出现两个同时选中的状态,在代码中设置选中
rg.check(R.id.rb_left);
Demo下载地址:TestRadioButton