Radio button in gridview

Question

Is it possible to add radio buttons in gridview ? Or can i make checkbox works like a radio button in gridview ?

Actully i wanted to add radio button in gridview but it seems that is somthing not possible so how can i make use check box in grid view to work like a radio button ? — Ravi Bhojani, Jul 12 '12 at 13:14
In my application, user can check one video from mutiple video displayed in gridview for that i want to add radio button/Check box for selection — Ravi Bhojani, Jul 12 '12 at 13:14
My dear, you can customize any view including GridView. So its possible to add Radio button or any view in GridView. — Paresh Mayani, Jul 12 '12 at 13:15
yes but how ? i think radio button is not possible in gridview. So i am trying with checkbox but i want to check view only one at a time. — Ravi Bhojani, Jul 12 '12 at 13:24
hello i m facing the same problem please see this link ,..i would be greatfull of u ..link: http://stackoverflow.com/questions/11536802/add-radio-button-dynamically-android — SRam, Jul 18 '12 at 09:28
@paresh Mayani actually in my project i have a requirment like i have a question and there are some answer based on this with radio button , options are coming dynamically , some question have 4 options and some have 5, or 6 so i need to implement it dynamically..i think u get my point..so now if u can please help me — SRam, Jul 18 '12 at 09:29
`RadioGroup` is a subclass of `LinearLayout`. Hence, the `RadioButton`s are aligned vertically or horizontally. If you want them in a grid, check [this question](https://stackoverflow.com/q/2381560/4034572) for some solutions. I've posted there [a custom GridLayout subclass](https://stackoverflow.com/a/55422560/4034572) that I've created that mimics the `RadioGroup` functionality but aligns the items in a grid. — Albert Vila Calvo, Mar 29 '19 at 17:48

score 1 · Accepted Answer · answered Jul 12 '12 at 13:37

Heres an example. Its really possible to just use a radio button. But this is an example that should help. Of course I did not give you EVERYTHING but this should show you it is possible

import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.RadioButton;
import android.widget.TableLayout;
import android.widget.TableRow;


public class ToggleButton extends TableLayout  implements OnClickListener {

    private static final String TAG = "ToggleButton";
    private RadioButton activeRadioButton;

    /** 
     * @param context
     */
    public ToggleButton(Context context) {
        super(context);
        // TODO Auto-generated constructor stub
    }

    /**
     * @param context
     * @param attrs
     */
    public ToggleButton(Context context, AttributeSet attrs) {
        super(context, attrs);
        // TODO Auto-generated constructor stub
    }

    @Override
    public void onClick(View v) {
        final RadioButton rb = (RadioButton) v;
        ///////// do whatever /////////////


    }

    /* (non-Javadoc)
     * @see android.widget.TableLayout#addView(android.view.View, int, android.view.ViewGroup.LayoutParams)
     */
    @Override
    public void addView(View child, int index,
            android.view.ViewGroup.LayoutParams params) {
        super.addView(child, index, params);
        setChildrenOnClickListener((TableRow)child);
    }


    /* (non-Javadoc)
     * @see android.widget.TableLayout#addView(android.view.View, android.view.ViewGroup.LayoutParams)
     */
    @Override
    public void addView(View child, android.view.ViewGroup.LayoutParams params) {
        super.addView(child, params);
        setChildrenOnClickListener((TableRow)child);
    }


    private void setChildrenOnClickListener(TableRow tr) {
        final int c = tr.getChildCount();
        for (int i=0; i < c; i++) {
            final View v = tr.getChildAt(i);
            if ( v instanceof RadioButton ) {
                v.setOnClickListener(this);
            }
        }
    }

    public int getCheckedRadioButtonId() {
        if ( activeRadioButton != null ) {
            return activeRadioButton.getId();
        }

        return -1;
    }
}

and create a layout like this (of course you need to clean it up but you got the idea)

<?xml version="1.0" encoding="utf-8"?>
<com.example.android.view.ToggleButton
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content" android:layout_height="wrap_content"
    android:id="@+id/radGroup1">
    <TableRow>
            <RadioButton android:id="@+id/rad1" android:text="Button1"
                android:layout_width="105px" android:layout_height="wrap_content"
                android:textSize="13px" />
            <RadioButton android:id="@+id/rad2" android:text="Button2"
                android:layout_width="105px" android:textSize="13px"
                android:layout_height="wrap_content" />
            <RadioButton android:id="@+id/rad3" android:text="Button3"
                android:layout_width="105px" android:textSize="13px"
                android:layout_height="wrap_content" />
    </TableRow>
    <TableRow>
            <RadioButton android:id="@+id/rad1" android:text="Button1"
                android:layout_width="105px" android:layout_height="wrap_content"
                android:textSize="13px" />
            <RadioButton android:id="@+id/rad2" android:text="Button2"
                android:layout_width="105px" android:textSize="13px"
                android:layout_height="wrap_content" />
            <RadioButton android:id="@+id/rad3" android:text="Button3"
                android:layout_width="105px" android:textSize="13px"
                android:layout_height="wrap_content" />
    </TableRow>
    <TableRow>
            <RadioButton android:id="@+id/rad1" android:text="Button1"
                android:layout_width="105px" android:layout_height="wrap_content"
                android:textSize="13px" />
            <RadioButton android:id="@+id/rad2" android:text="Button2"
                android:layout_width="105px" android:textSize="13px"
                android:layout_height="wrap_content" />
            <RadioButton android:id="@+id/rad3" android:text="Button3"
                android:layout_width="105px" android:textSize="13px"
                android:layout_height="wrap_content" />
    </TableRow>
</com.example.android.view.ToggleButton>

Thanks falcon, I have used checkbox to make it work. though, i havent use your code but i am accepting your ans as it's using radio buttons and it's perfect :) — Ravi Bhojani, Jul 12 '12 at 14:09
<33 thank you. I've used Check Boxes as radio buttons before (when I first started programming in Android and was having 'issues') and that works fine. It requires a little more thinking by the processor but heck, it works, and doesn't drain battery too much. Hopefully you don't run into any more problems! Good luck! — Falcon165o, Jul 12 '12 at 14:10

score 0 · Answer 2 · answered Jul 12 '12 at 14:07

I have used checkbox to make it work. here checkedVideo is boolean array which holdes the value of checkbox which is checked.

selectCB.setId(position);
                selectCB.setOnClickListener(new OnClickListener() {

                    public void onClick(View v) {
                        // TODO Auto-generated method stub

                        CheckBox cb = (CheckBox) v;
                        int id = cb.getId();
                        Log.i(LOG_TAG, "Clicked ? "+id);
                        if(checkedVideo[id])
                        {
                            checkedVideo[id] = false;
                            cb.setChecked(false);
                        }
                        else
                        {
                            for(int index = 0; index < count; index++)
                            {
                                checkedVideo[index] = false;
                            }
                            checkedVideo[id] = true;
                            cb.setChecked(true);
                            notifyDataSetChanged();
                        }
                    }
                });

                Log.i(LOG_TAG, "Checked ? "+checkedVideo[position]);
                selectCB.setChecked(checkedVideo[position]);

pretty angela · Answer 3 · 2013-01-03T06:33:32.560

You can make a customview like this...

public class RadioGridView extends LinearLayout {

    private int mClickedPosition = -1;

    private Context mContext;

    private int[] mItems;
    private ImageView[] iv_items;

    public RadioGridView(Context context, int[] items) {
       super(context);

       this.mContext = context;
       this.mItems = items;

       init();
    }

    private void init() {

    if (mItems != null) {
        iv_items = new ImageView[mItems.length];

        GridView gv = new GridView(mContext);
        addView(gv);

        gv.setBackgroundColor(0xffffffff);
        gv.setColumnWidth(50);
        gv.setNumColumns(GridView.AUTO_FIT);
        gv.setVerticalSpacing(10);
        gv.setHorizontalSpacing(10);
        gv.setStretchMode(GridView.STRETCH_COLUMN_WIDTH);
        gv.setGravity(Gravity.CENTER);

        final RadioGridViewAdapter adapter = new RadioGridViewAdapter();

        gv.setAdapter(adapter);

        gv.setOnItemClickListener(new OnItemClickListener() {

        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
            if (mClickedPosition >= 0) {
            iv_items[mClickedPosition].setBackgroundColor(Color.WHITE);
            }
            iv_items[position].setBackgroundColor(Color.RED);
            mClickedPosition = position;

            if (mOnGridItemClickListener != null) {
            mOnGridItemClickListener.onItemClick(position);
            }

                adapter.notifyDataSetChanged();

        }
        });
    }

    }

    public int getSelectedPosition() {
        return mClickedPosition;
    }

    /*********************************************************
     * Listener Interface
     ********************************************************/
    public interface OnGridItemClickListener {
    public void onItemClick(int position);
    }

    public OnGridItemClickListener mOnGridItemClickListener = null;

    public void setOnGridItemClickListener(OnGridItemClickListener l) {
        mOnGridItemClickListener = l;
    }

    /*********************************************************
     * RadioGidViewAdapter
     *********************************************************/
    class RadioGridViewAdapter extends BaseAdapter {

    @Override
    public int getCount() {
        return mItems.length;
    }

    @Override
    public Object getItem(int position) {
        return mItems[position];
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        if (convertView == null) {
        convertView = new ImageView(mContext);
        }

        iv_items[position] = (ImageView) convertView;
        iv_items[position].setImageResource(mItems[position]);

        return convertView;
    }

    }
}

And then, use it in the activity like this.

public class RadioGridActivity extends Activity {

    private int[] mItems = {
        R.drawable.gv_img_01, 
        R.drawable.gv_img_02, 
        R.drawable.gv_img_03, 
        R.drawable.gv_img_04
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        final RadioGridView rgv = new RadioGridView(this, mItems);
        setContentView(rgv);

        rgv.setOnGridItemClickListener(new OnGridItemClickListener() {

        @Override
        public void onItemClick(int position) {

        Toast.makeText(RadioGridActivity.this, "pos=" + position, 0).show();
        }
    });



    }

}

pretty angela · Answer 4 · 2013-01-03T11:25:58.673

I edit my code. RadioGridView should be changed like this...

Because the first item in Gridview is not refreshed in the above code.

Background mItemsBg should have been set very first time... Hmm...

public class RadioGridView extends LinearLayout {

    private int mClickedPosition = -1;

    private Context mContext;

    private int[] mItems;
    private int[] mItemsBg;
    private ImageView[] iv_items;

    RadioGridViewAdapter adapter;

    public RadioGridView(Context context, int[] items) {
        super(context);

        this.mContext = context;
        this.mItems = items;

        init();
    }

    private void init() {

    if (mItems != null) {
        iv_items = new ImageView[mItems.length];

        mItemsBg = new int[mItems.length];
        for (int i = 0; i < mItems.length; i++) {
        mItemsBg[i] = Color.WHITE;
        }

        GridView gv = new GridView(mContext);
        addView(gv);

        gv.setBackgroundColor(0xffffffff);
        gv.setColumnWidth(50);
        gv.setNumColumns(GridView.AUTO_FIT);
        gv.setVerticalSpacing(10);
        gv.setHorizontalSpacing(10);
        gv.setStretchMode(GridView.STRETCH_COLUMN_WIDTH);
        gv.setGravity(Gravity.CENTER);

        adapter = new RadioGridViewAdapter();
        gv.setAdapter(adapter);

        gv.setOnItemClickListener(new OnItemClickListener() {

        @Override
        public void onItemClick(AdapterView<?> parent, View view,
            int position, long id) {

            if (mClickedPosition >= 0) {
            mItemsBg[mClickedPosition] = Color.WHITE;
            }
            mItemsBg[position] = Color.RED;
            mClickedPosition = position;

            adapter.notifyDataSetChanged();

            if (mOnGridItemClickListener != null) {
            mOnGridItemClickListener.onItemClick(position);
            }

        }
        });

    }

    }

    /*********************************************************
     * Listener Interface
     ********************************************************/
    public interface OnGridItemClickListener {
         public void onItemClick(int position);
    }

    public OnGridItemClickListener mOnGridItemClickListener = null;

    public void setOnGridItemClickListener(OnGridItemClickListener l) {
         mOnGridItemClickListener = l;
    }

    /*********************************************************
     * RadioGidViewAdapter
     *********************************************************/
    class RadioGridViewAdapter extends BaseAdapter {

    @Override
    public int getCount() {
        return mItems.length;
    }

    @Override
    public Object getItem(int position) {
        return mItems[position];
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        if (convertView == null) {
            convertView = new ImageView(mContext);
        }

        iv_items[position] = (ImageView) convertView;
        iv_items[position].setImageResource(mItems[position]);
        iv_items[position].setBackgroundColor(mItemsBg[position]);

        return convertView;
    }

    }
}

Radio button in gridview

4 Answers4