CODEWITHSUNDEEP
android
shiv
shiv

Reputation: 245

Change color of a radio button

I am developing an quiz based app. There will be 1 question and 4 option(radio buttons). If user select any wrong answer then I want to turn that radio button color to Red. How to do this?

Upvotes: 19

Views: 61382

Answers (11)

Tarif Chakder
Tarif Chakder

Reputation: 1846

For kotlin user

Create an extension

fun RadioButton.setCircleColor() {
    val colorStateList = ColorStateList(
        arrayOf(
            intArrayOf(-android.R.attr.state_checked), // unchecked
            intArrayOf(android.R.attr.state_checked)  // checked
        ), intArrayOf(
           Color.RED, // unchecked color
           Color.GREEN  // checked color
        )
    )

    // finally set button tint list
    buttonTintList = colorStateList

    // optionally tint mode or tint blend
    if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q){
        buttonTintBlendMode = BlendMode.SRC_IN
    }else{
        buttonTintMode = PorterDuff.Mode.SRC_IN
    }

    invalidate() // could not be necessary
}

Now call it

   radioButton.setCircleColor()

done

Upvotes: 1

asadullah
asadullah

Reputation: 121

add these two properties in your style this you are using in the manifest with the activity

<item name="colorControlNormal">@color/grey</item> // for state released color
<item name="colorAccent">@color/blueLogo</item>  //for state pressed color

Upvotes: 1

Simas
Simas

Reputation: 44118

You can perform a backwards compatible tint on the radio button

XML:

<android.support.v7.widget.AppCompatRadioButton
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:id="@+id/radioButton"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  app:buttonTint="@color/red"/>

Or java:

CompoundButton button = (CompoundButton) findViewById(R.id.radioButton);
CompoundButtonCompat.setButtonTintList(button, ContextCompat.getColorStateList(this, R.color.red));

Upvotes: 4

Pablo
Pablo

Reputation: 261

Hope this helps..

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
       radioButton.setButtonTintList(ContextCompat.getColorStateList(mContext, R.color.colorGris));
    }else {//Do something if you have a lower version}

For me its working.

Upvotes: 1

Jorge Arimany
Jorge Arimany

Reputation: 5882

The fastest thing to do is to set the buttonTint to your desired color:

 <RadioButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/radio"
        android:checked="true"
        android:buttonTint="@color/your_color"/>

In your values/colors.xml put your color in this case a reddish one:

<color name="your_color">#e75748</color>

Result:

Colored Android Radio Button

As @smashing pointed, this only will work on API level >= 21

Upvotes: 17

Sierisimo
Sierisimo

Reputation: 648

Just came to show something that really help me with this:

Everyone talks about how to use the tint and how to use the colorAccent, but, this wont work on phones with API less than 21.

So, the real fix on this or at least what helped me was to use android.support.v7.widget.AppCompatRadioButton instead of RadioButton

With this on your layout, you can use: app:buttonTint="@color/yourColor"

without getting warnings or problems about the compat of the view.

And, don't you forget about adding:

xmlns:app="http://schemas.android.com/apk/res-auto"

to your layout parent or to your widget.

Edit:

@aselims mention on a comment that there's not buttonTintin the app namespace.

So... here's my current style for this solution:

<style name="MRadioButton.Purple" parent="Widget.AppCompat.CompoundButton.RadioButton">
    <item name="colorAccent">@color/youColor</item>
    <item name="colorControlHighlight">@color/yourColor</item>
    <item name="android:colorPressedHighlight">@color/yourColor</item>
    <item name="colorPrimaryDark">@color/yourColor</item>
    <item name="colorPrimary">@color/yourColor</item>
    <item name="colorControlActivated">@color/yourColor</item>
</style>

Upvotes: 24

Weiyi
Weiyi

Reputation: 1933

To change RadioButton button colour programmatically, and works on api level < 21, should use AppCompatRadioButton instead of RadioButton:

(otherwise will warn setbuttontintlist requrie api level 21)

import android.support.v7.widget.AppCompatRadioButton;

AppCompatRadioButton radioButton = new AppCompatRadioButton(getActivity());
radioButton.setSupportButtonTintList(
        ContextCompat.getColorStateList(getActivity(),
        R.color.single_choice_state_list));

single_choice_state_list.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:color="@color/single_choice_checked"></item>
    <item android:state_checked="false" android:color="@color/single_choice_unchecked"></item>
</selector>

Upvotes: 8

BooNonMooN
BooNonMooN

Reputation: 350

//get radio button reference from layout
RadioButton raPrivate = (RadioButton) layout.findViewById(R.id.radioPrivate);
//parse textColor from string hex code
int textColor = Color.parseColor("#000000");
//set textcolor to radioButton
raPrivate.setButtonTintList(ColorStateList.valueOf(textColor));

u can only assing ColorStateList objets as color for the radioButton, if u use valueOf it will only use one color.

Hope this helps :>

Upvotes: 4

Ansar
Ansar

Reputation: 364

Create an image !like this and place it in your drawable folders.. call it by,

 RadioButton rb=(RadioButton) findViewById(R.id.radioButton1);
        rb.setOnCheckedChangeListener(new OnCheckedChangeListener() {

            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                // TODO Auto-generated method stub
                rb.setButtonDrawable(R.drawable.'you image here');
            }
        });
    }

Upvotes: 0

user1764879
user1764879

Reputation: 122

Create a selector drawable for you radio button under drawable/radio_button.xml folder and mention all the required states for your radio button.

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
 android:state_checked="true"
 android:state_window_focused="false"
 android:drawable="@drawable/radio_button_on" />
<item
 android:state_checked="false"
 android:state_window_focused="false"
 android:drawable="@drawable/radio_button_off" />
<item 
 android:state_checked="true" 
 android:state_pressed="true"
 android:drawable="@drawable/radio_button_on_pressed" />
<item
 android:state_checked="false" 
 android:state_pressed="true"
  android:drawable="@drawable/radio_button_off_pressed" />
<item
 android:state_checked="true"
  android:state_focused="true"
  android:drawable="@drawable/radio_button_on_selected" />
<item
  android:state_checked="false"
  android:state_focused="true"
  android:drawable="@drawable/radio_button_off_selected" />
<item
 android:state_checked="true"
 android:drawable="@drawable/radio_button_on" />
<item
 android:state_checked="false"
 android:drawable="@drawable/radio_button_off" />
</selector>

And specify android:button="@drawable/radio_button" for your radio button

Dont forget to add the corresponding images for different states of radio button.

Upvotes: 4

fecub
fecub

Reputation: 944

This site is really good for customizing Android components in general: android-holo-colors

Just choose the radio button, make the color red, download and use it in your project!

Upvotes: 4

Related Questions