如何在 selected/deselected 时更改单选按钮的背景 color/shape
How to change background color/shape of a Radiobutton when selected/deselected
我在 for 循环中以编程方式将单选按钮添加到 RadioGroup。我希望我的按钮在未选中时具有特定背景颜色，而在选中时具有另一种背景颜色（一次只能 selected ）。我的问题是我还希望这个背景是一个圆角矩形。我让它部分工作，但每当我 select 回答时，它都会将该按钮的背景设置为白色，但不会重置任何其他按钮。
我知道我需要某种类型的 selector 对象，以添加无线电组预期的切换行为。我找到了一些例子，但它们只展示了如何将纯色设置为背景。我需要使用这个圆角形状。所以，我的问题是弄清楚如何将两者融合在一起。我可能完全错了。如果有更好的方法来实现我想要的，我宁愿使用它而不是挽救我已经尝试过的东西。
我可以通过创建两个 XML 文件来接近，每个文件都有一个形状对象和自己的背景颜色。如果单选按钮是 selected，它的样式将设置为 radio_button_checked" 样式。但是，我知道我正在接近这个错误，因为另一个选中的按钮不会关闭。我基本上可以单击所有按钮并让它们全部具有白色背景。我知道有更好的方法来做到这一点，我只是不知道它是什么
这是我添加按钮的循环，以及 radiogroup rg 的更改侦听器（rg 是我的 RadioGroup，answers 只是字符串的 HashMap。它们不会影响与此问题相关的任何内容。buttonTintList线条只是用来改变圆圈颜色）
for(int i = 0; i < answers.size(); i++)
{
RadioButton rb = new RadioButton(context);
rb.setTextColor(ContextCompat.getColor(context, R.color.colorPrimaryDark));
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
rb.setButtonTintList(ColorStateList.valueOf(ContextCompat.getColor( context, R.color.colorAccent)));
}
rb.setBackground(context.getResources().getDrawable(R.drawable.radiobutton_style_unchecked));
rb.setText(answers.get(i));
rb.setWidth(800);
rb.setHeight(150);
rb.setTextSize(18);
rb.setLayoutParams(params);
rg.addView(rb);
}
/* Store the answer */
rg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
RadioButton rb= (RadioButton)group.findViewById(checkedId);
answer = rb.getText().toString();
rb.setBackground(context.getResources().getDrawable(R.drawable.radiobutton_style_checked));
}
});
这是未选中按钮 (radiobutton_style_unchecked.xml)XML
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners android:radius="6dp" />
<gradient
android:angle="45"
android:centerColor="@color/colorPrimaryLight"
android:centerX="35%"
android:endColor="@color/colorPrimaryLight"
android:startColor="@color/colorPrimaryLight"
android:type="linear" />
<padding
android:bottom="5dp"
android:left="0dp"
android:right="0dp"
android:top="5dp" />
</shape>
选中按钮的样式完全相同，但用白色代替了 colorPrimaryLight
这是没有任何东西的样子 selected:
这是 selected 一个项目时的样子。
这就是我 select 超过一个时发生的情况
我建议你有 3 个 drawable xml
radio_checked.xml(你要查看的效果)
radio_unchecked.xml(你要取消勾选的效果)
radio_custom_drawable.xml
在这个xml中你必须做这样的事情：
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true"
android:drawable="@drawable/radio_checked" />
<item android:state_checked="false"
android:drawable="@drawable/radio_unchecked" />
</selector>
然后在您的代码中更改此
rb.setBackground(context.getResources().getDrawable(R.drawable.radiobutton_style_checked));
至
rb.setBackground(context.getResources().getDrawable(R.drawable.radio_custom_drawable));
试试这个
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/holo_blue_light"
android:orientation="vertical">
<RadioGroup
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/radio_background"
android:padding="10dp"
android:text="Yes" />
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/radio_background"
android:padding="10dp"
android:text="No" />
</RadioGroup>
</LinearLayout>
@drawable/radio_background
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@android:color/white" android:state_checked="true" />
<item android:drawable="@color/colorAccent" android:state_checked="false" />
</selector>
OUTPUT
更新
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/holo_blue_light"
android:orientation="vertical">
<RadioGroup
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/test"
android:padding="10dp"
android:text="Yes" />
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/test"
android:padding="10dp"
android:text="No" />
</RadioGroup>
</LinearLayout>
@drawable/test
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" android:exitFadeDuration="@android:integer/config_shortAnimTime">
<item android:drawable="@drawable/radio_selected" android:state_checked="true" />
<item android:drawable="@drawable/radio_normal" />
</selector>
@drawable/radio_selected
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="20dp" />
<solid android:color="@android:color/white" />
<padding
android:bottom="5dp"
android:left="0dp"
android:right="0dp"
android:top="5dp" />
</shape>
@drawable/radio_normal
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="20dp" />
<solid android:color="@color/colorAccent" />
<padding
android:bottom="5dp"
android:left="0dp"
android:right="0dp"
android:top="5dp" />
</shape>
OUTPUT
我在 for 循环中以编程方式将单选按钮添加到 RadioGroup。我希望我的按钮在未选中时具有特定背景颜色，而在选中时具有另一种背景颜色（一次只能 selected ）。我的问题是我还希望这个背景是一个圆角矩形。我让它部分工作，但每当我 select 回答时，它都会将该按钮的背景设置为白色，但不会重置任何其他按钮。
我知道我需要某种类型的 selector 对象，以添加无线电组预期的切换行为。我找到了一些例子，但它们只展示了如何将纯色设置为背景。我需要使用这个圆角形状。所以，我的问题是弄清楚如何将两者融合在一起。我可能完全错了。如果有更好的方法来实现我想要的，我宁愿使用它而不是挽救我已经尝试过的东西。
我可以通过创建两个 XML 文件来接近，每个文件都有一个形状对象和自己的背景颜色。如果单选按钮是 selected，它的样式将设置为 radio_button_checked" 样式。但是，我知道我正在接近这个错误，因为另一个选中的按钮不会关闭。我基本上可以单击所有按钮并让它们全部具有白色背景。我知道有更好的方法来做到这一点，我只是不知道它是什么
这是我添加按钮的循环，以及 radiogroup rg 的更改侦听器（rg 是我的 RadioGroup，answers 只是字符串的 HashMap。它们不会影响与此问题相关的任何内容。buttonTintList线条只是用来改变圆圈颜色）
for(int i = 0; i < answers.size(); i++)
{
RadioButton rb = new RadioButton(context);
rb.setTextColor(ContextCompat.getColor(context, R.color.colorPrimaryDark));
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
rb.setButtonTintList(ColorStateList.valueOf(ContextCompat.getColor( context, R.color.colorAccent)));
}
rb.setBackground(context.getResources().getDrawable(R.drawable.radiobutton_style_unchecked));
rb.setText(answers.get(i));
rb.setWidth(800);
rb.setHeight(150);
rb.setTextSize(18);
rb.setLayoutParams(params);
rg.addView(rb);
}
/* Store the answer */
rg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
RadioButton rb= (RadioButton)group.findViewById(checkedId);
answer = rb.getText().toString();
rb.setBackground(context.getResources().getDrawable(R.drawable.radiobutton_style_checked));
}
});
这是未选中按钮 (radiobutton_style_unchecked.xml)XML
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners android:radius="6dp" />
<gradient
android:angle="45"
android:centerColor="@color/colorPrimaryLight"
android:centerX="35%"
android:endColor="@color/colorPrimaryLight"
android:startColor="@color/colorPrimaryLight"
android:type="linear" />
<padding
android:bottom="5dp"
android:left="0dp"
android:right="0dp"
android:top="5dp" />
</shape>
选中按钮的样式完全相同，但用白色代替了 colorPrimaryLight
这是没有任何东西的样子 selected:
这是 selected 一个项目时的样子。
这就是我 select 超过一个时发生的情况
我建议你有 3 个 drawable xml
radio_checked.xml(你要查看的效果)
radio_unchecked.xml(你要取消勾选的效果)
radio_custom_drawable.xml
在这个xml中你必须做这样的事情：
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_checked="true" android:drawable="@drawable/radio_checked" /> <item android:state_checked="false" android:drawable="@drawable/radio_unchecked" /> </selector>
然后在您的代码中更改此
rb.setBackground(context.getResources().getDrawable(R.drawable.radiobutton_style_checked));
至
rb.setBackground(context.getResources().getDrawable(R.drawable.radio_custom_drawable));
试试这个
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/holo_blue_light"
android:orientation="vertical">
<RadioGroup
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/radio_background"
android:padding="10dp"
android:text="Yes" />
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/radio_background"
android:padding="10dp"
android:text="No" />
</RadioGroup>
</LinearLayout>
@drawable/radio_background
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@android:color/white" android:state_checked="true" />
<item android:drawable="@color/colorAccent" android:state_checked="false" />
</selector>
OUTPUT
更新
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/holo_blue_light"
android:orientation="vertical">
<RadioGroup
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/test"
android:padding="10dp"
android:text="Yes" />
<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/test"
android:padding="10dp"
android:text="No" />
</RadioGroup>
</LinearLayout>
@drawable/test
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" android:exitFadeDuration="@android:integer/config_shortAnimTime">
<item android:drawable="@drawable/radio_selected" android:state_checked="true" />
<item android:drawable="@drawable/radio_normal" />
</selector>
@drawable/radio_selected
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="20dp" />
<solid android:color="@android:color/white" />
<padding
android:bottom="5dp"
android:left="0dp"
android:right="0dp"
android:top="5dp" />
</shape>
@drawable/radio_normal
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="20dp" />
<solid android:color="@color/colorAccent" />
<padding
android:bottom="5dp"
android:left="0dp"
android:right="0dp"
android:top="5dp" />
</shape>
OUTPUT