Darko Petkovski
Darko Petkovski

Reputation: 3912

Custom radio button with a checked indicator on the right

Can someone tell me how can I create a radioGroup with radio buttons that will have the look like on the image:

enter image description here

Here is my xml code:

<RadioGroup
            android:id="@+id/network_creation_radiogroup"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:paddingRight="20dp">

            <RadioButton
                android:id="@+id/network_creation_private"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:checked="false"
                android:drawableRight="@drawable/lock"
                android:text="Private"
                android:textAppearance="?android:attr/textAppearanceMedium" />

            <TextView
                style="@style/TextView_LightGrey"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Anyone can join" />

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:layout_margin="10dp"
                android:background="@color/dark_gray" />

            <RadioButton
                android:id="@+id/network_creation_public"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:checked="true"
                android:drawableRight="@drawable/unlock"
                android:text="Public"
                android:textAppearance="?android:attr/textAppearanceMedium" />

            <TextView
                style="@style/TextView_LightGrey"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Join via a suggest from existing\nnetwork members" />
        </RadioGroup>

Upvotes: 1

Views: 1677

Answers (2)

Rathan Kumar
Rathan Kumar

Reputation: 2577

Instead of radio button you can use Checked Text View here and here is the example but in this you have to handle the checked states like radio group. Means if one is checked you have to make another one is unchecked.

Upvotes: 0

Apurva
Apurva

Reputation: 7911

Radio Button Selector xml

res/drawable/radio_selector.xml

<?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/btn_selected" android:state_checked="true"/>
    <item android:drawable="@drawable/btn_unselected" android:state_checked="false"/>

 </selector>

Now add android:background="@drawable/radio_selector" android:drawableRight="@drawable/radio_selector" to every radio button tag.

Upvotes: 1

Related Questions