Right to Left Custom Radio Buttons

Question

I saw this link: Adding custom radio buttons in android.

It is better than this picture (my design) but it is not right to left:

How can I put the text of radio button in left side of the button in that link? With thanks

EDITED: I want this output but right to left

EDITED: It is possible that the output looks like below figure?

Just so we're all clear, I think this is what you're looking for, right? https://cloud.githubusercontent.com/assets/8008527/21685683/764a7074-d330-11e6-9909-efd968874aaa.png — Matthew Regul, Jan 05 '17 at 15:20
OK and the "Radiobutton1" and "Radiobutton2" and "Radiobutton3" are the left side of buttons, first buttons and then text. — user2111639, Jan 05 '17 at 16:13
I want the shape of the first figure with the shape of buttons of the second figure. The buttons of the first figure is not nice. — user2111639, Jan 05 '17 at 16:20
The look/shape of the buttons is a separate question altogether. You should make another question for customizing the `appearance` of the radio buttons themselves. We were all addressing your right to left situation :) — Matthew Regul, Jan 05 '17 at 16:25
Could you please review all of the answers and comments, were you able to find a solution? :) — Matthew Regul, Jan 17 '17 at 15:34

Saeid · Answer 1 · 2017-01-05T15:39:46.697

you can set android:button="@null" ans then with android:drawable(position) define direction of drawable for RadioButton to left, right, top and bottom like below :

    <RadioButton
            android:id="@+id/rbYes"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:button="@null"
            android:drawableLeft="@android:drawable/btn_radio"
            android:text="RadioButton Text" />

Edit 1 :

as @Mubashar_Javed saidRadioGroup for multi RadioButton.

or for one RadioButton just add RadioButton inside an view fore example "LinearLayout" in this form :

             <LinearLayout
                android:gravity="center|right"
                android:layout_width="match_parent"
                android:layout_height="match_parent">
                 <RadioButton
                   android:id="@+id/rbName"
                   android:layout_width="match_parent"
                   android:layout_height="wrap_content"
                   android:button="@null"
                   android:drawableLeft="@android:drawable/btn_radio"
                   android:text="RadioButton Text" />
           </LinearLayout>

Thank you. I edited my post. EDITED: I want this output but right to left. — user2111639, Jan 05 '17 at 15:03

score 0 · Answer 2 · answered Jan 05 '17 at 14:35

Add android:gravity="right" in each of your RadioButton as given bellow

<RadioGroup
    android:id="@+id/radios"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_gravity="right"
    android:inputType="text"
    android:orientation="vertical" >

    <RadioButton
        android:id="@+id/first"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:background="@color/white"
        android:button="@null"
        android:drawablePadding="30dp"
        android:drawableRight="@android:drawable/btn_radio"
        android:text="first"
        android:textColor="@color/Black"
        android:textSize="20dip" 
        android:gravity="right"/>

    <RadioButton
        android:id="@+id/second"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@color/Black"
        android:button="@null"
        android:drawablePadding="30dp"
        android:drawableRight="@android:drawable/btn_radio"
        android:text="second"
        android:textColor="@color/White"
        android:textSize="20dp"
         android:gravity="right"/>

    <RadioButton
        android:id="@+id/third"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@color/Maroon"
        android:button="@null"
        android:drawablePadding="30dp"
        android:drawableRight="@android:drawable/btn_radio"
        android:text="third"
        android:textColor="@color/Vanilla"
        android:textSize="20dp"
        android:gravity="right" />
</RadioGroup>

Thank you. I edited my post. EDITED: I want this output but right to left. — user2111639, Jan 05 '17 at 15:04

Matthew Regul · Answer 3 · 2017-01-05T18:10:36.940

EDIT: Here is a new version with proper RTL appearance.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:measureWithLargestChild="false"
    android:gravity="left">

    <RadioGroup
        android:id="@+id/radios"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_gravity="right"
        android:inputType="text"
        android:orientation="vertical">

        <RadioButton
            android:id="@+id/Radiobutton1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:text="Radiobutton 1"
            android:button="@null"
            android:drawableRight="@android:drawable/btn_radio"
            android:gravity="center_vertical"
            android:checked="true"
            />

        <RadioButton
            android:id="@+id/Radiobutton2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:text="Radiobutton 2"
            android:button="@null"
            android:drawableRight="@android:drawable/btn_radio"
            android:gravity="center_vertical"
            />
        <RadioButton
            android:id="@+id/Radiobutton3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:text="Radiobutton 3"
            android:button="@null"
            android:drawableRight="@android:drawable/btn_radio"
            android:gravity="center_vertical"
            />

        <RadioButton
            android:id="@+id/Radiobutton4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:text="Radiobutton 4"
            android:button="@null"
            android:drawableRight="@android:drawable/btn_radio"
            android:gravity="center_vertical"
            />

    </RadioGroup>

    <Button
        android:id="@+id/myButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello" />

</LinearLayout>

EDITED: It is possible that the output looks like below figure? — user2111639, Jan 05 '17 at 17:31
If you looking for a version where the radio buttons are on the left side of the labels, check my EDIT history on this post — Matthew Regul, Jan 12 '17 at 16:09

Right to Left Custom Radio Buttons

3 Answers3