Can't change Radio Button color on Android

Question

I'm using Android Studio. I need to change the color of the Radio Button, after changing the Button Tint Color value to the one I need it works on the preview, but whenever I launch the app on a device the button is the standard green/blue-ish color.

Is this some kind of device API level issue? If so, is it possible to change the color for older devices?

Answer 1

This can be done in two ways (to support pre-Lollipop):

1. Use AppCompatRadioButton:

   AppCompatRadioButton radioButton;
   // now use following methods to set tint colour
   radioButton.setSupportButtonTintMode();
   radioButton.setSupportButtonTintList();
   

2. Apply this as style to your RadioButton in your XML:

   <style name="RadioButton.Login" parent="Widget.AppCompat.CompoundButton.RadioButton">
       <item name="android:textColor">@android:color/white</item>
       <item name="buttonTint">@android:color/white</item>
   </style>
   

Answer 2

If you want to change the color, but not change colorControlActivated and colorControlNormal for the entire app, you can override your apptheme just for the radio button by creating a new style:

<android.support.v7.widget.AppCompatRadioButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:layout_alignParentEnd="true"
    android:theme="@style/RadioButtonTheme"
    android:id="@+id/radioButton"/>



<style name="RadioButtonTheme" parent="@style/AppTheme">
    <item name="colorControlActivated">@color/colorAccent</item>
    <item name="colorControlNormal">@color/colorPrimaryDark</item>
</style>

Answer 3

I have done this way:

Screenshot

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context=".MainActivity"
    tools:showIn="@layout/app_bar_main">

    <RadioGroup
        android:id="@+id/radioGroup"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">


    </RadioGroup>

</RelativeLayout>

MainActivity.java

public class MainActivity extends AppCompatActivity
        implements NavigationView.OnNavigationItemSelectedListener {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);


        RadioGroup radioGroup = (RadioGroup) findViewById(R.id.radioGroup);

        /**
         * First Radio Buttonn
         */
        RadioButton radioButtonAndroid = (RadioButton) getLayoutInflater().inflate(R.layout.custom_radiobutton, null);
        radioButtonAndroid.setText("Hello Android");
        radioGroup.addView(radioButtonAndroid);

        /**
         * Second Radio Buttonn
         */
        RadioButton radioButtonIos = (RadioButton) getLayoutInflater().inflate(R.layout.custom_radiobutton, null);
        radioButtonIos.setText("Hello Ios");
        radioGroup.addView(radioButtonIos);
    }
}

custom_radiobutton.xml

<?xml version="1.0" encoding="utf-8"?>
<RadioButton xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:buttonTint="@color/colorPrimary"
    android:text="">

</RadioButton>

Hope this will help you.

Answer 4

//red is the color of the pressed state and activated state
<item name="colorControlActivated">@android:color/holo_red_light</item>
//black is the color of the normal state
<item name="colorControlNormal">@android:color/black</item>

From: user2968401

Once you have different styles for the radio button you can swap them by assigning them to a new Radio Button with the style already set to the new style:

(RadioButton)layout.findViewById(R.id.radioButton) = new RadioButton(this, null, R.style.RadioButton_style);

Answer 5

No need of additional styling. Android supports it via xml. Just add android:buttonTint="@color/yourColor" in your radio button.

For eg.

<RadioButton
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:buttonTint="@color/red"
 android:text="Upload"
 android:textColor="@color/text_dark_gray"
 android:textSize="14sp" />

Answer 6

RadioButton raPrivate = (RadioButton) layout.findViewById(R.id.radioPrivate);
int textColor = Color.parseColor(#000000);
raPrivate.setButtonTintList(ColorStateList.valueOf(textColor));

Answer 7

After reading @Ranjith's answer i did a little digging and this seemed to work. Just add it to your AppTheme.

    //red is the color of the pressed state and activated state
    <item name="colorControlActivated">@android:color/holo_red_light</item>
    //black is the color of the normal state
    <item name="colorControlNormal">@android:color/black</item>

My question is how do you do this programatically as I have dynamic radio buttons??

Answer 8

Assuming you are using appcompat in your app just add the below within styles.xml

<item name="colorAccent">@color/blue</item>

Now blue colorAccent will be set, just change color to any color you want.

For eg, the whole style.xml

<resources>
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">@color/accent_material_dark</item>
        <item name="colorPrimaryDark">@color/accent_color_dark</item>
        <item name="colorAccent">@color/accent_color</item>
        <item name="windowActionBar">false</item>
    </style>
</resources>