Android: custom layout for Radio Group

Question

I'm trying to create a 2x2 array of radio buttons, but I don't know how to customize layout other than horizontal or vertical. Any ideas?

I've only gotten

A B C D

and

A
B
C
D

but I want to have

A B
C D

EDIT: I resolved this issue. For anyone wondering, I set up two individual radio groups (i.e. one with AB and one with CD). I set onClickListener() for each RadioButton, and used clearCheck() on the second RadioGroup when a button in the first RadioGroup was clicked, and vice versa.

You could contain a GridLayout within your RadioGroup, and add your RadioButtons to there — ollien, Jun 13 '14 at 13:55
You need to supply us with more information then that for an answer. An image of what you want, the layout you have tried and how it looks, and/or anything else. And maybe [look through the docs](http://developer.android.com/guide/topics/ui/declaring-layout.html) to find what you want. Maybe a `RelativeLayout`, `TableLayout`, or `GridView`? — codeMagic, Jun 13 '14 at 13:56
http://stackoverflow.com/questions/2381560/how-to-group-a-3x3-grid-of-radio-buttons — Kristy Welsh, Dec 17 '14 at 20:11

score 3 · Answer 1 · answered Jun 25 '15 at 09:30

You can easily do it by including two LinearLayout into your RadioGroup with a orientation="horizontal".

<RadioGroup
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                <RadioButton
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAllCaps="true"
                    android:text="18-24"
                    />

                <RadioButton
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAllCaps="true"
                    android:text="36-45"
                    />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                <RadioButton
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAllCaps="true"
                    android:text="25-35"
                    />

                <RadioButton
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAllCaps="true"
                    android:text=">45"
                    />
            </LinearLayout>

radio group wont work. you can check more than 1 radio button — zihadrizkyef, Nov 18 '21 at 03:47

score 2 · Answer 2 · answered Mar 24 '15 at 07:09

Better solution of the above example. This should be use when we have to use radiobuttons without radiogroup.

    ///////////////////////////  for call setting rb ////////////////////////////////////////////////////

    grbtn = (RadioButton) findViewById(R.id.grbtn);
    vrbtn = (RadioButton) findViewById(R.id.vrbtn);
    srbtn = (RadioButton) findViewById(R.id.srbtn);
    arbtn = (RadioButton) findViewById(R.id.arbtn);

    grbtn.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {
            vrbtn.setChecked(false);
            srbtn.setChecked(false);
            arbtn.setChecked(false);
            ///////////////////////////////////////////////

        }
    });

    vrbtn.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {
            grbtn.setChecked(false);
            srbtn.setChecked(false);
            arbtn.setChecked(false);
            ///////////////////////////////////////////////

        }
    });

    srbtn.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {
            vrbtn.setChecked(false);
            grbtn.setChecked(false);
            arbtn.setChecked(false);
            ///////////////////////////////////////////////

        }
    });

    arbtn.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {
            vrbtn.setChecked(false);
            srbtn.setChecked(false);
            grbtn.setChecked(false);
            ///////////////////////////////////////////////

        }
    });

    /////////////////////////////////////////////////////////////////////////////////////////////////////


`

this kind of code produce too much boiler plate. that's why we have radio group — zihadrizkyef, Nov 18 '21 at 02:30

CodeMonkey · Answer 3 · 2014-06-13T15:51:48.313

If this is what you are asking about, here is what i would do. There is probably a better way, but this works well enough for me.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/radioGroup"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:layout_gravity="top|left">
    <RadioButton
        android:id="@+id/radio1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/radioOneText" />
    <RadioButton
        android:id="@+id/radio2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/radioTwoText"
        android:layout_toRightOf="@id/radio1"
        android:layout_alignBaseline="@id/radio1"
        android:layout_marginLeft="10dp" />
    <RadioButton
        android:id="@+id/radio3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/radioThreeText"
        android:layout_below="@id/radio1"
        android:layout_alignLeft="@id/radio1" />
    <RadioButton
        android:id="@+id/radio4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/radioFourText"
        android:layout_below="@id/radio2"
        android:layout_toRightOf="@id/radio3"
        android:layout_alignBaseline="@id/radio3"
        android:layout_alignLeft="@id/radio2" />
</RelativeLayout>

Here is an example of using 'setOnClickListener' to handle the changes...

package com.example.breakable;

import android.os.*;
import android.app.*;
import android.view.View;
import android.widget.*;

public class MainActivity extends Activity
{   
    RadioButton radioOne;
    RadioButton radioTwo;
    RadioButton radioThree;
    RadioButton radioFour;
    @Override
    public void onCreate(Bundle icicle)
    {       
        super.onCreate(icicle);
        setContentView(R.layout.main);

        radioOne = (RadioButton)findViewById(R.id.radio1);
        radioTwo = (RadioButton)findViewById(R.id.radio2);
        radioThree = (RadioButton)findViewById(R.id.radio3);
        radioFour = (RadioButton)findViewById(R.id.radio4);

        radioOne.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                if (radioTwo.isChecked()){
                    radioTwo.setChecked(false);
                    radioOne.setChecked(true);
                } else if (radioThree.isChecked()) {
                    radioThree.setChecked(false);
                    radioOne.setChecked(true);
                } else if (radioFour.isChecked()) {
                    radioFour.setChecked(false);
                    radioOne.setChecked(true);
                } else {
                    radioOne.setChecked(true);
                }
            }
        });
        radioTwo.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (radioOne.isChecked()){
                    radioOne.setChecked(false);
                    radioTwo.setChecked(true);
                } else if (radioThree.isChecked()) {
                    radioThree.setChecked(false);
                    radioTwo.setChecked(true);
                } else if (radioFour.isChecked()) {
                    radioFour.setChecked(false);
                    radioTwo.setChecked(true);
                } else {
                    radioTwo.setChecked(true);
                }
            }
        });
        radioThree.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (radioOne.isChecked()){
                    radioOne.setChecked(false);
                    radioThree.setChecked(true);
                } else if (radioTwo.isChecked()) {
                    radioTwo.setChecked(false);
                    radioThree.setChecked(true);
                } else if (radioFour.isChecked()) {
                    radioFour.setChecked(false);
                    radioThree.setChecked(true);
                } else {
                    radioThree.setChecked(true);
                }
            }
        });
        radioFour.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (radioOne.isChecked()){
                    radioOne.setChecked(false);
                    radioFour.setChecked(true);
                } else if (radioTwo.isChecked()) {
                    radioTwo.setChecked(false);
                    radioFour.setChecked(true);
                } else if (radioThree.isChecked()) {
                    radioThree.setChecked(false);
                    radioFour.setChecked(true);
                } else {
                    radioFour.setChecked(true);
                }
            }
        });
    }
}

But this doesn't deselect the other buttons when one is selected — rjvani, Jun 13 '14 at 14:39
There, i added code where you can have an onClickListener for when you press another radio button, it will select the current clicked one and select the one you want. — CodeMonkey, Jun 13 '14 at 15:52

Android: custom layout for Radio Group

3 Answers3

Linked