FragmentTabHost graphical layout doesn't render

Question

The graphical layout for a simple android.support.v4.app.FragmentTabHost never renders in either Eclipse or Android Studio.
The Console error I get is consistently:
Exception raised during rendering: No tab known for tag null

I'm using the most basic XML file:

<android.support.v4.app.FragmentTabHost
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

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

        <TabWidget
            android:id="@android:id/tabs"
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0"/>

        <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>
</android.support.v4.app.FragmentTabHost>

but the same error occurs.

I just wanted to add more views above or below the tab widget and frame layout.
I don't care so much about seeing the tab content; I just want to see the rest of my layout - but the problem is that NO OTHER VIEWS are rendered when a android.support.v4.app.FragmentTabHost resides in the layout.

I've read and tried to resolve the issue from the answer to this post:
Android: Tabs at the bottom with FragmentTabHost
but I don't think that that is my problem; I'm not looking to put a TabWidget on the bottom.

Every other one of my XML files opens perfectly.

The same problem occurs in Android Studio:

Answer 1

I had the same rendering problem as well as compilation error. I fixed the problem by finding that I was not passing Fragment when i was creating Addtab. You must pass atleast one fragment on mTabHost.addTab. Below is the working code.

private FragmentTabHost mTabHost;
mTabHost = (FragmentTabHost)findViewById(android.R.id.tabhost);
            mTabHost.setup(HomeActivity.this, getSupportFragmentManager(), android.R.id.tabcontent);

            mTabHost.addTab(mTabHost.newTabSpec("home").setIndicator("Home"), HomeFragment.class, null);
            mTabHost.addTab(mTabHost.newTabSpec("mysheets").setIndicator("MySheets"));
            mTabHost.addTab(mTabHost.newTabSpec("bookmarks").setIndicator("Bookmarks"));

Answer 2

Not sure about the error you've got (sorry, I'm really busy right now so can't spend more time checking) but in general it seems that the FragmentTabHost from the support libs doesn't care about the xml at all. See my previous answer to another question:

FragmentTabHost with horizontal scroll

Answer 3

From Layout i am getting the same Error..so,I resolve that Problem by Code only...It's working fine..Please try this code

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentTabHost;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class DetailFragment extends Fragment {

    /******************************************************************************************************************
     * Mandatory empty constructor for the fragment manager to instantiate the fragment (e.g. upon screen orientation changes).
     *****************************************************************************************************************/
    public DetailFragment() {
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        // R.layout.fragment_tabs_pager contains the layout as specified in your question
        View rootView = inflater.inflate(R.layout.fragment_tabs_pager, container, false);

        // Initialise the tab-host
        FragmentTabHost mTabHost = (FragmentTabHost) rootView.findViewById(R.id.tabhost);
        mTabHost.setup(getActivity(), getChildFragmentManager(), R.id.realtabcontent);

        // Initialise this list somewhere with the content that should be displayed
        List<String> itemsToBeDisplayed;

        for (String subItem : itemsToBeDisplayed) {
            // Give along the name - you can use this to hand over an ID for example
            Bundle b = new Bundle();
            b.putString("TAB_ITEM_NAME", subItem);

            // Add a tab to the tabHost
            mTabHost.addTab(mTabHost.newTabSpec(subItem).setIndicator(subItem), YourContentFragment.class, b);
        }
        return rootView;
    }
}



/********************************************************
This class contains the actual content of a single tab  
**********************************************************/
public class YourContentFragment extends Fragment {

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

        Bundle extras = getArguments();
        if (extras != null) {
            if (extras.containsKey("TAB_ITEM_NAME")) {
                String subItem = extras.getString("TAB_ITEM_NAME");
                // Do something with that string
            }
        }
    }
}

Answer 4

If U need to put fragmented tabs at bottom of screen ... @fallow undermentioned --

Make your xml file like this ..

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

       <!--   <RelativeLayout 
            android:layout_width="fill_parent" 
            android:layout_height="fill_parent">  android:layout_alignParentTop="true"  -->

         <FrameLayout
            android:id="@+id/realtabcontent"
            android:layout_width="match_parent"
            android:layout_height="0dip"
            android:layout_weight="1" />


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

            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="0dip"
                android:layout_height="0dip"
                android:layout_weight="0" />

        </android.support.v4.app.FragmentTabHost>

    </LinearLayout>

---

Now if your concern is opening several fragments with in single fragmented tabs ...

@follow steps ::

1. Create a container fragment. This container fragment will be default for all of your's tabs content.
2. For every tab content replace fragment U need with this container.

For ex:- Just like you replace your bed with different bed sheets .. :)

Your container fragment class that will be used differently in different tabs ... "LearnContainerFragment.java "

    public class LearnContainerFragment extends BaseContainerFragment {

        private boolean mIsViewInited;

        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
            Log.e("test", "tab 1 oncreateview");
            return inflater.inflate(R.layout.container_fragment, null);
        }

        @Override
        public void onActivityCreated(Bundle savedInstanceState) {
            super.onActivityCreated(savedInstanceState);
            Log.e("test", "tab 1 container on activity created");
            if (!mIsViewInited) {
                mIsViewInited = true;
                initView();
            }
        }

        private void initView() {
            Log.e("test", "tab 1 init view");
            replaceFragment(new Learn(), false);
        }

    }

LearnContainerFragment.java --- > it's xml file container_fragment.xml

    <?xml version="1.0" encoding="utf-8"?>
    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/container_framelayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">


    </FrameLayout>

@ How to use Conatiner..

1. For every fragment U need will be replaced with id of this container fragment.

@last your BaseContainerFragment.java class --

public class BaseContainerFragment extends Fragment {

    public void replaceFragment(Fragment fragment, boolean addToBackStack) {
        FragmentTransaction transaction = getChildFragmentManager().beginTransaction();
        if (addToBackStack) {
            transaction.addToBackStack(null);
        }
        transaction.replace(R.id.container_framelayout, fragment);
        transaction.commit();
        getChildFragmentManager().executePendingTransactions();
    }

    public boolean popFragment() {
        Log.e("test", "pop fragment: " + getChildFragmentManager().getBackStackEntryCount());
        boolean isPop = false;
        if (getChildFragmentManager().getBackStackEntryCount() > 0) {
            isPop = true;
            getChildFragmentManager().popBackStack();
        }
        return isPop;
    }

}

Hope it helps..... Cheers!

Answer 5

not sure.... but shouldn't your layout have a tabhost tag in it above the tabwidget's linear layout?

<TabHost
    android:id="@+id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/background"
>

i made an app a while back that implented tabs using tabhost and this is how my layout was...one tab had a calendar view one had an image switcher and one had a listview...sorry i can't be of more help

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/background"
tools:context=".MainActivity" >

<TabHost
    android:id="@+id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/background"
>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/background"
        android:orientation="vertical" >

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

        </TabWidget>

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

            <LinearLayout
                android:id="@+id/tab1"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical" >

                <ListView
                    android:id="@+id/listView1"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent" >
                </ListView>
            </LinearLayout>

            <LinearLayout
                android:id="@+id/tab2"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical" >

                <ImageSwitcher
                    android:id="@+id/imageSwitcher1"
                    android:layout_width="match_parent"
                    android:layout_height="251dp" >
                </ImageSwitcher>

                <TextView
                    android:id="@+id/tv"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:scrollbars="vertical" />

            </LinearLayout>

            <LinearLayout
                android:id="@+id/tab3"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical" >

                <CalendarView
                    android:id="@+id/calendarView1"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent" />
            </LinearLayout>

        </FrameLayout>
    </LinearLayout>

</TabHost>