Making Android RadioGroup Scrollable inside a tabhost

Question

I have a TabActivity which the layout file is the following,I have the tab options in the radiogroup,I want to set size of the radio buttons according to the display size and make the radiogroup scrollable.

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >


            <RadioGroup
                android:id="@+id/radio_group"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                android:orientation="horizontal" 
               >

                <RadioButton
                    android:id="@+id/radio_sale"
                    style="@style/main_tab_bottom"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/tabs_bg_imag_selector"
                    android:checked="true"
                    android:drawableTop="@drawable/selector_sale_tab_img"
                    android:paddingTop="5dp"
                    android:text="@string/sale"
                    android:textSize="12sp" />


                <RadioButton
                    android:id="@+id/radio_bill"
                    style="@style/main_tab_bottom"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/tabs_bg_imag_selector"
                    android:drawableTop="@drawable/selector_bill_tab_img"
                    android:paddingTop="5dp"
                    android:text="@string/billpay"
                    android:textSize="12sp" />

                  <RadioButton
                    android:id="@+id/radio_charge"
                    style="@style/main_tab_bottom"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/tabs_bg_imag_selector"
                    android:drawableTop="@drawable/selector_charge_tab_img"
                    android:paddingTop="5dp"
                    android:text="@string/charge"
                    android:textSize="12sp" />

                 <RadioButton
                    android:id="@+id/radio_balance"
                    style="@style/main_tab_bottom"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/tabs_bg_imag_selector"
                    android:drawableTop="@drawable/selector_balance_tab_img"
                    android:paddingTop="5dp"
                    android:text="@string/balance"
                    android:textSize="12sp" />


                    <RadioButton
                    android:id="@+id/radio_report"
                    style="@style/main_tab_bottom"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/tabs_bg_imag_selector"
                    android:drawableTop="@drawable/selector_report_tab_img"
                    android:paddingTop="5dp"
                    android:text="@string/report"
                    android:textSize="12sp" />

                <RadioButton
                    android:id="@+id/radio_config"
                    style="@style/main_tab_bottom"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/tabs_bg_imag_selector"
                    android:drawableTop="@drawable/selector_config_tab_img"
                    android:paddingTop="5dp"
                    android:text="@string/config"
                    android:textSize="12sp" />

                <RadioButton
                    android:id="@+id/radio_about"
                    style="@style/main_tab_bottom"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/tabs_bg_imag_selector"
                    android:drawableTop="@drawable/selector_about_tab_img"
                    android:paddingTop="5dp"
                    android:text="@string/about"
                    android:textSize="12sp" />
                  <RadioButton
                    android:id="@+id/radio_about"
                    style="@style/main_tab_bottom"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/tabs_bg_imag_selector"
                    android:drawableTop="@drawable/selector_about_tab_img"
                    android:paddingTop="5dp"
                    android:text="@string/about"
                    android:textSize="12sp" />

            </RadioGroup>


        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_weight="1" >
        </FrameLayout>
     <HorizontalScrollView
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:fillViewport="false"
                android:scrollbars="horizontal" >
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#808080"
            android:visibility="gone" >

        </TabWidget>
           </HorizontalScrollView>
    </LinearLayout>

</TabHost>

Nouran S. Ahmad · Accepted Answer · 2015-11-10T09:30:00.617

I have tried this code myself and it worked. just wrap your radio group with a scroll view like this:

    <?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

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

    <RadioGroup
        android:id="@+id/radio_group"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:orientation="horizontal"

        >

        <RadioButton
            android:id="@+id/radio_sale"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:checked="true"
            android:paddingTop="5dp"
            android:text="sale"
            android:textSize="20sp" />


        <RadioButton
            android:id="@+id/radio_bill"
            style="main_tab_bottom"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingTop="5dp"
            android:text="billpay"
            android:textSize="20sp" />

        <RadioButton
            android:id="@+id/radio_charge"
            style="main_tab_bottom"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingTop="5dp"
            android:text="charge"
            android:textSize="20sp" />

        <RadioButton
            android:id="@+id/radio_balance"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingTop="5dp"
            android:text="balance"
            android:textSize="20sp" />


        <RadioButton
            android:id="@+id/radio_report"
            style="main_tab_bottom"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingTop="5dp"
            android:text="report"
            android:textSize="20sp" />

        <RadioButton
            android:id="@+id/radio_config"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingTop="5dp"
            android:text="config"
            android:textSize="20sp" />

        <RadioButton
            android:id="@+id/radio_about2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingTop="5dp"
            android:text="about"
            android:textSize="20sp" />
        <RadioButton
            android:id="@+id/radio_about"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingTop="5dp"
            android:text="about"
            android:textSize="20sp" />

    </RadioGroup>

</HorizontalScrollView>
    <FrameLayout
        android:id="@android:id/tabcontent"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >
    </FrameLayout>
    <HorizontalScrollView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:fillViewport="false"
        android:scrollbars="horizontal" >
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#808080"
            android:visibility="gone" >

        </TabWidget>
    </HorizontalScrollView>
</LinearLayout>

EDIT: for text size check this code:

int screenSize = getResources().getConfiguration().screenLayout & Configuration.SCREENLAYOUT_SIZE_MASK;
        switch (screenSize) {
            case Configuration.SCREENLAYOUT_SIZE_XLARGE:
                //set text size
                break;
            case Configuration.SCREENLAYOUT_SIZE_LARGE:
                //set text size
                break;
            case Configuration.SCREENLAYOUT_SIZE_NORMAL:
                //set text size
                break;
            case Configuration.SCREENLAYOUT_SIZE_SMALL:
                //set text size
                break;

            default:
                //default 

        }

please check edit, and provide your java code, perhaps their is something preventing the scroll — Nouran S. Ahmad, Nov 10 '15 at 08:59
Thank you tons!!!!your code works,although I couldn't find the problem of my code,marked as an answer! — Shadi, Nov 10 '15 at 09:15

score 3 · Answer 2 · answered Nov 10 '15 at 08:42

3

RadioGroup is inherit from LinearLayout,which itself is not scrollable.I think you can wrap your RaidoGroup in a HorizontalScrollViewjust like the normal LinearLayout do.Hope it can help u

answered Nov 10 '15 at 08:42

Zuo VJ

149
1
2

Thanks a lot, I've got the solution. – Shadi Nov 10 '15 at 09:15

Making Android RadioGroup Scrollable inside a tabhost

2 Answers2