RadioButton is leaving black checked circle after unchecking

Question

My RadioButtons in my RadioGroup are leaving a black checked circle after I uncheck them or click on another RadioButton in the group. How do I prevent this from happening?

<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:text="Test"
            android:textAlignment="textStart"
            android:layoutDirection="rtl"
            android:layout_gravity="start"
            android:background="?android:selectableItemBackground"/>

        <RadioButton
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textAlignment="textStart"
            android:layoutDirection="rtl"
            android:layout_gravity="start"
            android:background="?android:selectableItemBackground"/>

</RadioGroup>

Happens on my API 19 real device, not my API 27

Edit:_________________________________________________

Have tried using a custom selector which doesn't work

<RadioGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/qrmenu_toolbar"
        android:orientation="vertical">

<RadioButton
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Resume"
            android:layoutDirection="rtl"
            android:layout_gravity="start"
            android:drawablePadding="12dp"
            android:paddingStart="16dp"
            android:paddingTop="12dp"
            android:paddingEnd="16dp"
            android:paddingBottom="12dp"
            app:drawableLeftCompat="@drawable/ic_resume"
            android:button="@drawable/radiobutton_selector"

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/radio_checked" android:state_checked="true" />
    <item android:drawable="@drawable/radio_unchecked" android:state_checked="false" />
</selector>

Theme:

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorBlack</item>
        <item name="colorPrimaryDark">@color/colorBlack</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

Bump still can't find a solution

Edit:______________________________________

Have also tried using custom radio buttons.. still doesn't work:

<RadioButton
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:button="@drawable/custom_radio_button"/>

Custom RadioButton:

<?xml version="1.0" encoding="utf-8" ?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:drawable="@drawable/ic_radio_button_checked"/>
    <item android:state_checked="false" android:drawable="@drawable/ic_radiobutton_unchecked"/>
</selector>

Madelynmademoiselle

Did you try to remove android:background attribute from your RadioButton and test it? Please, provide device model. – Collusion

Yes I removed the background attribute and it still has it. Samsung galaxy note3. – Madelynmademoiselle

I think you could try some manual clearing. Add listener to RadioGroup through setOnCheckedChangeListener and in it first clear current check through clearCheck and immediately after that set check item through check method. – Collusion

try to give ids for every RadioButton like for example android:id="@+id/one" , android:id="@+id/two" – Reentry

Check this :- It will help https://mcmap.net/q/125254/-change-the-circle-color-of-radio-button – Marte

Answer 1

Remove the background from the radio button

android:background="?android:selectableItemBackground"

and use android:button="@drawable/radiobutton_selector"

Here is an example of a custom radio button in Android. please look into this. Maybe this help for you. http://www.apnatutorials.com/android/android-radiobutton-customization-and-usage.php?categoryId=2&subCategoryId=62&myPath=android/android-radiobutton-customization-and-usage.php

Campbellite

Hey Dave, Hav you tried this? This is working for me. – Campbellite

Answer 2

Use MaterialRadioButton from support library(com.google.android.material). The problem may occur because of different implementation of RadioButton depending on API version in conjunction with themes and selectors. Usage of MaterialRadioButton will unify behaviour across the API versions.

Here is a small give for this component.

'com.google.android.material:material:1.0.0' dependency should be imported to the project and one of Material themes used for the app.

Hope it will help.

Leonhard

Could you please expand your question with code of your selector, theme and java code. Use Button attribute instead of background. – Leonhard

No java code only XML, added selector and theme above. – Madelynmademoiselle

Answer 3

You have to use buttonTint for this.

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

Your radioButton should be like this. However this does not work before api 21 There is a solution here for before API 21 devices Change Circle color of radio button

Gadmon