选中/取消选中后如何更改单选按钮的背景颜色/形状 [英] How to change background color/shape of a Radiobutton when selected/deselected
问题描述
我正在以编程方式将单选按钮添加到for循环中的RadioGroup中.我希望我的按钮在未选中时具有某种背景色,而在选中它们时具有另一种背景色(一次只能选择一个).我的问题是我也希望此背景是一个圆角矩形.我有部分工作,但是每当我选择一个答案时,它都会将该按钮的背景设置为白色,但不会重置其他任何按钮.
I am adding radiobuttons programatically to a RadioGroup in a for loop. I want my buttons to have a certain background color when not checked, and another when they are checked (only one can be selected at once). My problem is that I also want this background to be a rounded rectangle. I have it working partially, but whenever I select an answer, it will set that button's background to white, but it won't reset any of the other buttons.
我知道我需要某种选择器对象,才能添加无线电组期望的切换行为.我能够找到一些示例,但是它们仅显示了如何将纯色设置为背景.我需要使用这个圆角形状.所以,我的麻烦是弄清楚如何融合两者.我可能会犯完全错误的错误.如果有更好的方法来实现我想要的,我宁愿使用它而不是挽救我已经尝试过的方法.
I understand that I need some type of selector object, to add the toggle behavior that is expected from the radiogroup. I was able to find some examples of that, but they only showed how to set a solid color as a background. I need to use this rounded corner shape. So, my trouble is figuring out how to blend the two. I could be going about this completely wrong. If there is a better approach to achieving what I want, I would prefer to use that rather than salvage what I've already tried.
通过创建两个XML文件,每个文件都有一个形状对象和自己的背景色,我得以接近.如果选择了单选按钮,则其样式将设置为radio_button_checked样式.但是,我知道我正在解决此错误,因为另一个选中的按钮没有关闭.我基本上可以单击所有按钮并将它们全部变成白色背景.我知道有更好的方法可以做到这一点,我只是不知道它是什么
I was able to get close by creating two XML files, each with a shape object and its own background color. If a radiobutton is selected, its style gets set to the radio_button_checked" style. But, I know I am approaching this wrong because the other checked button does not toggle off. I can basically click all of the buttons and get them all to have white backgrounds. I know there is a better way to do this, I just don't know what it is
这是我在其中添加按钮以及radiogroup rg的更改侦听器的循环(rg是我的RadioGroup,答案只是一个字符串的HashMap.它们不影响与此问题有关的任何东西.buttonTintList行是只是在那里改变圆圈颜色)
Here is the loop where I add the buttons, along with the change listener for radiogroup rg (rg is my RadioGroup and answers is just a HashMap of strings. They don't affect anything related to this problem. The buttonTintList line is just there to change circle color)
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));
}
});
这是未选中按钮的XML(radiobutton_style_unchecked.xml)
Here is the XML for unchecked buttons (radiobutton_style_unchecked.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
The style for checked buttons is exactly the same, but with white instead of colorPrimaryLight
以下是未选择任何内容的样子:
Here is what it looks like with nothing selected:
这是选择一项时的外观.
Here is what it looks like when one item is selected.
这是当我选择多个时发生的情况
And this is what happens when I select more than one
推荐答案
尝试一下
<?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
@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>
输出
<?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
@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
@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
@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>
输出
这篇关于选中/取消选中后如何更改单选按钮的背景颜色/形状的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!