Search code examples
android-radiogroup

how to style radio button that is on the right hand side of text


I have a radio group with three radio buttons I put the text on the left hand side of radio button with below command

android:drawableRight="@drawable/abc_btn_radio_material"

but the default button color is black and I can't change its color using android:theme command, does anyone know how can I change the default color? my full radio group code:

<RadioGroup
    android:id="@+id/main_loading_radioGroup"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_marginRight="6dp"
    android:layout_marginTop="6dp"
    android:checkedButton="@+id/main_wall_load"
    android:orientation="vertical">



    <RadioButton
        android:id="@+id/main_wall_load"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:button="@null"
        android:drawableRight="@drawable/abc_btn_radio_material"
        android:theme="@style/MyRadioButton"
        android:layout_gravity="right"
         android:text="A"
        android:textColor="#000000"
        android:textSize="12sp"/>

    <RadioButton
        android:id="@+id/main_roof_load"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:button="@null"
        android:layout_gravity="right"
        android:drawableRight="@drawable/abc_btn_radio_material"
        android:text="AA"
        android:textSize="12sp"/>

    <RadioButton
        android:id="@+id/main_stairCase_load"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:button="@null"
        android:layout_gravity="right"
        android:drawableRight="@drawable/abc_btn_radio_material"
        android:text="AAA"
        android:textColor="#000000"
        android:textSize="12sp"/>
</RadioGroup>

Solution

  • Try This code,

    Make this file in your res/drawable

    radiobutton_drawable.xml

    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:drawable="@drawable/radio_uncheck" android:state_checked="false" android:state_focused="true" />
        <item android:drawable="@drawable/radio_uncheck" android:state_checked="false" android:state_focused="false" />
        <item android:drawable="@drawable/radio_check" android:state_checked="true" android:state_focused="true" />
        <item android:drawable="@drawable/radio_check" android:state_checked="true" android:state_focused="false" />
    </selector>
    

    activity_main.xml:

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingTop="@dimen/activity_vertical_margin">
    
        <RadioGroup xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/main_loading_radioGroup"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:orientation="vertical">
    
            <RadioButton
                android:id="@+id/main_wall_load"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:button="@android:color/transparent"
                android:checked="true"
                android:drawablePadding="30dp"
                android:drawableRight="@drawable/radiobutton_drawable"
                android:text="A"
                android:textColor="#000000"
                android:textSize="12sp" />
    
            <RadioButton
                android:id="@+id/main_roof_load"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:button="@android:color/transparent"
                android:drawablePadding="24dp"
                android:drawableRight="@drawable/radiobutton_drawable"
                android:text="AA"
                android:textSize="12sp" />
    
            <RadioButton
                android:id="@+id/main_stairCase_load"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:button="@android:color/transparent"
                android:drawablePadding="18dp"
                android:drawableRight="@drawable/radiobutton_drawable"
                android:text="AAA"
                android:textColor="#000000"
                android:textSize="12sp" />
        </RadioGroup>
    </RelativeLayout>
    

    These are the drawables which i have used for checked and unchecked state of radio button,

    enter image description here

    enter image description here

    Hereby, i am attaching screenshot,

    enter image description here

    Hope it will help you!!!