Making RadioGroup radio buttons with images in Android... How?

Question

Is it possible to make Radio Buttons in Android, where there are image representation to a button instead of a regular buttons? I want it to look something like that:

The cyan in the middle represents the selected button.

How can I do it?

Solution

The RadioButton class has a buttonDrawable member, derived from CompoundButton.

There are multiple ways you can change this drawable.

From java:

myRadioButton.setButtonDrawable(resourceId or Drawable);

From xml:

<RadioButton
    android:button="@drawable/yourdrawable" 
    ...
/>

If you just want the checked/unchecked state look differently, then

• Add a new selector xml by rightclicking your res folder -> New -> Android xml -> select Drawable in the upper dropdown -> choose selector (in eclipse)
• To setup this selector, please take a look at this link
• From now on you can set your freshly created selector to any of your checkboxes/radiobuttons by using its id.