Search code examples
android-fragmentshorizontalscrollview

FragmentTabHost with horizontal scroll


I am trying to build a FragmentTabHost and make it horizontal Scrollable. I've been searching for a solution but couldn't find anything, all posts are about normal TabHost.

I am using the support library as explained in the android site for FragmentTabHost

My layout is :

<android.support.v4.app.FragmentTabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/tabhost"
android:tag="trip_entry_tab"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <TabWidget
        android:id="@android:id/tabs"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />
    <FrameLayout
        android:id="@android:id/tabcontent"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_weight="0"/>
    <FrameLayout
        android:id="@+id/realtabcontent"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>
</LinearLayout>

Already tried to nest the tabwidget into an horizontal scroll view (this is the solution I could find in other posts, but always for TabHost and not for FragmentTabHost), but nothing changes:

<HorizontalScrollView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:fillViewport="true"
            android:scrollbars="none" >

            <TabWidget
                android:id="@android:id/tabs"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" >
            </TabWidget>
        </HorizontalScrollView>

My tabs just got shrinked and that is really not nice looking. Has somebody make it to get a fragment tab host scrollable?

Thanks


Solution

  • Based on my experience, the FragmentTabHost doesn't care much about the xml definitions, things must be made programmatically. I got it working by leaving out the HorizontalScrollView from the xml and adding it in my onCreate for the FragmentActivity.

    The xml:

    <android.support.v4.app.FragmentTabHost xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@android:id/tabhost"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >
    
            <TabWidget
                android:id="@android:id/tabs"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal" />
    
            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_weight="0" />
    
            <FrameLayout
                android:id="@+id/realtabcontent"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1" />
        </LinearLayout>
    
    </android.support.v4.app.FragmentTabHost>
    

    Then in the onCreate after adding the tabs (also programmatically):

    TabWidget tw = (TabWidget) findViewById(android.R.id.tabs);
    LinearLayout ll = (LinearLayout) tw.getParent();
    HorizontalScrollView hs = new HorizontalScrollView(this);
    hs.setLayoutParams(new FrameLayout.LayoutParams(
        FrameLayout.LayoutParams.MATCH_PARENT,
        FrameLayout.LayoutParams.WRAP_CONTENT));
    ll.addView(hs, 0);
    ll.removeView(tw);
    hs.addView(tw);
    hs.setHorizontalScrollBarEnabled(false);
    

    Don't know if this is the most elegant solution but it seems to work OK.