Dunes Buggy
Dunes Buggy

Reputation: 1819

FragmentTabHost tabs overlap tabcontent

I'm using a FragmentTabHost (Support library, Android) to load my fragments into tabs. However, I see that the tabs are hosted over my tabcontent. But I want my tabcontent to be laid below the tabs. How is this possible?

I have search but couldn't find anything related to this.

Upvotes: 2

Views: 696

Answers (3)

Vlad
Vlad

Reputation: 8552

I noticed when setting height of TabWidget (e.g. 56dp) all is ok

        <TabWidget
            android:background="@color/TabWidget"
            android:layout_width="match_parent"
            android:layout_height="56dp" />

Upvotes: 0

jujyfruits
jujyfruits

Reputation: 86

Setting a margin or a padding won't work because, like you said in the comment, the size of the tabs may vary and that solution depends on the height of the TabHost being constant.

I answered this already here: FragmentTabHost content filling remaining space

You don't need to have the container for the fragments (the tabcontent) inside the Tabhost, when you do that you're using the same space for the content of the fragments and the tabs themselves.

Just put the Tabhost inside a vertical LinearLayout and put the FrameLayout outside, below the TabHost, just like in the following sample:

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

    <android.support.v4.app.FragmentTabHost
        android:id="@android:id/tabhost"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <TabWidget 
            android:id="@android:id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"/>
    </android.support.v4.app.FragmentTabHost>

    <FrameLayout 
        android:id="@+id/realtabcontent"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />

</LinearLayout>

Upvotes: 3

Eugene H
Eugene H

Reputation: 3568

You can add margin to the layouts that hold the fragments. I believe the tabs height is 56dp.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    <!--here-->
    android:layout_marginTop="56dp"

    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:orientation="vertical">

   <!--your content-->
</LinearLayout>

Upvotes: 2

Related Questions