user1256821
user1256821

Reputation: 1188

Styling RadioButton using XML drawable

I want to change RadioButton's indicator using a simple shape state selector. I've created the following XML named moon_radio.xml and placed it to a drawable folder.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:state_pressed="false">
        <shape
            android:shape="oval">
            <solid android:color="@color/moon_light_plate" />
        </shape>
    </item>
    <item android:state_checked="false" android:state_pressed="false">
        <shape
            android:shape="oval">
            <stroke
                android:width="2dp"
                android:color="@color/moon_light_plate" />
        </shape>
    </item>
    <item android:state_checked="true" android:state_pressed="true">
        <shape
            android:shape="oval">
            <solid android:color="@color/moon_light_plate_pressed" />
        </shape>
    </item>
    <item android:state_checked="false" android:state_pressed="true">
        <shape
            android:shape="oval">
            <stroke
                android:width="2dp"
                android:color="@color/moon_light_plate_pressed" />
        </shape>
    </item>
</selector>

Then I specify android:button="@drawable/moon_radio" property on a RadioButton in my layout. This does not work for some reason. What's wrong?

* EDIT * May be I've explained unclear, but I do not want change background, I want to change indicator, i.e. default dot.

This is what I get:

enter image description here

And This is what I want to get"

enter image description here

Upvotes: 0

Views: 1418

Answers (3)

Rick Falck
Rick Falck

Reputation: 1778

To see what the default RadioButton uses, based on the apps theme, go into the source code for one of the APIs. For example, from the SDK Manager you can install the "Sources for Android SDK" for API 18. It will get placed in:

sdk\platforms\android-18\data\res\drawable\

Find the btn_radio.xml, btn_radio_holo_dark.xml, and btn_radio_holo_light.xml files. They have state-selectors for the different states, and you can see what png files they use.

You can find those png files in the drawable-mdpi\ directory to see what they look like (like btn_radio_on.png).

Then you can copy the btn_radio.xml file to your drawable directory and make it use your images (or drawable shapes) for the different states.

Looking at one of those files, I think your states are wrong (like checked=true pressed=false). I don't see that in the default file , except for the last one that just has checked=true. It goes through the selectors from top to bottom. So, it only gets to the bottom one if the ones above it aren't selected.

And, you put your selector drawable in the android:button attribute.

Upvotes: 0

Balu
Balu

Reputation: 1069

You should specify this in android:button property of RadioButton is correct you just need to add android:background="@android:color/transparent"

Upvotes: 2

Pradip
Pradip

Reputation: 3177

You need to define RadioButton like below-

<RadioButton
    android:id="@+id/radio0"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/moon_radio"
    android:button="@android:color/transparent"
    android:checked="true"
    android:text="RadioButton1" />

Setting your radioButton background will serve your purpose if you set android:button="@android:color/transparent".

Upvotes: 1

Related Questions