Estoy tratando de hacerNested Fragment Tabs En mi aplicación de Android.

Quiero obtener una segunda fila con las subpestañas como esta:

Pero las pestañas anidadas se superponen así:

Este es mi código:

MainActivity.java

public class MainActivity extends ActionBarActivity {
    // Declare Variables    
    FragmentTabHost mTabHost;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Set the view from main_fragment.xml
        setContentView(R.layout.main_fragment);

        // Locate android.R.id.tabhost in main_fragment.xml
        mTabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);

        // Create the tabs in main_fragment.xml
        mTabHost.setup(this, getSupportFragmentManager(), R.id.tabcontent);

        // Create Parent Tab1 
        mTabHost.addTab(mTabHost.newTabSpec("parent1").setIndicator("Parent1"),
                FragmentParentTab1.class, null);

        // Create Parent Tab2
        mTabHost.addTab(mTabHost.newTabSpec("parent2").setIndicator("Parent2"),
                FragmentParentTab2.class, null);
    }
}

FragmentParentTab2.java

public class FragmentParentTab2 extends Fragment {
    FragmentTabHost mTabHost;

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {

        mTabHost = new FragmentTabHost(getActivity());

        mTabHost.setup(getActivity(), getChildFragmentManager(),
                R.layout.fragmentparenttab2);

        // Create Child Tab1
        mTabHost.addTab(mTabHost.newTabSpec("child1").setIndicator("Child1"),
                FragmentChildTab1.class, null);

        // Create Child Tab2
        mTabHost.addTab(mTabHost.newTabSpec("child2").setIndicator("Child2"),
                FragmentChildTab2.class, null);
        return mTabHost;
    }

    @Override
    public void onDestroyView() {
        super.onDestroyView();
        mTabHost = null;
    }
}

FragmentChildTab1.java

public class FragmentChildTab1 extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View rootView = inflater.inflate(R.layout.fragmentchildtab1, container, false);
        return rootView;
    }
}

main_fragment.xml

<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="match_parent" >

        <FrameLayout
            android:id="@+id/tabcontent"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </android.support.v4.app.FragmentTabHost>

</LinearLayout>

fragmentparenttab2.xml

<RelativeLayout 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" >

</RelativeLayout>

fragmentchildtab1.xml

<RelativeLayout 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" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="@string/FragmentChildTab1" />

</RelativeLayout>

Obtuve este código de un tutorial que usabaActionBarSherlock y funcionó bien, pero intenté migrarlo aappcompat y obtuve el problema de superposición. (no se puede pegar el enlace de origen, solo se permiten 2 enlaces)