RadioGroup - Radio Buttons with Selectors

In this post, I created a layout with three Radio buttons. Since all three radio buttons are distinct, therefore, one selector for each radio button. Selector is used to switch between Checked and Un-Checked states and load different images when radio button is checked and un-checked.

First things first, we create three selectors.

Selector One for First Radio Button:

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

Selector Two for Second Radio Button:

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

Selector Three for Third Radio Button:

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

*one_selected / one_unselected etc. are two images which are shown when button is checked OR unchecked accordingly. Similarly, images required for other two radio buttons.

Now, create a layout and use aforementioned three selectors in respective radio buttons as below:

<?xml version="1.0" encoding="UTF-8"?>
<RadioGroup xmlns:android="http://schemas.android.com/apk/res/android"
                 android:padding="5dp"
                 android:gravity="center"
                 android:layout_height="wrap_content"
                 android:layout_width="wrap_content"
                 android:layout_gravity="center_horizontal"
                 android:orientation="horizontal">

<RadioButton
                 android:layout_height="wrap_content"
                 android:layout_width="wrap_content" "
                 android:button="@null"
                 android:background="@drawable/selector_one"
                 android:layout_margin="5dp"
                 android:id="@+id/one"/>

<RadioButton
                 android:layout_height="wrap_content"
                 android:layout_width="wrap_content"
                 android:button="@null"
                 android:background="@drawable/selector_two"
                 android:layout_margin="5dp"
                 android:id="@+id/two"/>

<RadioButton
                 android:layout_height="wrap_content"
                 android:layout_width="wrap_content"
                 android:button="@null"
                 android:background="@drawable/selector_three"
                 android:layout_margin="5dp"
                 android:id="@+id/three"/>
</RadioGroup>

That's it.

Please don't hesitate to contact me.
Thank you