嵌套的片段标签在Android上重叠[英] Nested fragment tabs overlap on Android

本文是小编为大家收集整理的关于嵌套的片段标签在Android上重叠的处理/解决方法,可以参考本文帮助大家快速定位并解决问题,中文翻译不准确的可切换到English标签页查看源文。

问题描述

我正在尝试在我的Android应用程序中制作Nested Fragment Tabs

我想用这样的子标签获得第二行:

 http://i.stack.imgur.com/dpo5x.png

但是嵌套的标签是这样重叠的:

 http://i.stack.imgur.com/lil8g.png

这是我的代码:

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>

我从使用ActionBarSherlock的教程中获得了此代码,并且它运行良好,但是我试图将其迁移到appcompat并得到重叠问题. (不能粘贴源链接,只允许2个链接)

推荐答案

我终于解决了它.只需要创建一个新的tabcontent

这是我添加的代码:

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

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

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

和 mainActivity.java

中的这条线
mTabHost.setup(this, getSupportFragmentManager(), R.id.tabcontent2);

其他推荐答案

我曾经陷入相同的问题,但通过清除堆栈解决了问题:

 FragmentManager fm = getActivity().getSupportFragmentManager();
       for(int i = 0; i < fm.getBackStackEntryCount(); ++i) {
        fm.popBackStack();
 }

 ft.addToBackStack(null);

每当您希望片段出现在后压时,每当切换下一个片段清除堆栈时,将片段添加到堆叠其他明智的片段.

本文地址:https://www.itbaoku.cn/post/102768.html

问题描述

I'm trying to make Nested Fragment Tabs in my android application.

I want to get a second row with the sub tabs like this:

http://i.stack.imgur.com/DPo5x.png

But the nested tabs are overlapping like this:

http://i.stack.imgur.com/liL8G.png

This is my code:

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>

I got this code from a tutorial which used ActionBarSherlock and it worked fine, but I tried to migrate it to appcompat and got the overlap issue. (can't paste source link, only 2 links allowed)

推荐答案

I finally solved it. Just needed to create a new tabcontent

This is the code that I have added:

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

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

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

and this line in MainActivity.java

mTabHost.setup(this, getSupportFragmentManager(), R.id.tabcontent2);

其他推荐答案

I once got stuck in the same problem but solved it by clearing the stack :

 FragmentManager fm = getActivity().getSupportFragmentManager();
       for(int i = 0; i < fm.getBackStackEntryCount(); ++i) {
        fm.popBackStack();
 }

and

 ft.addToBackStack(null);

when ever you want the fragment to appear in back press add the fragment to stack other wise when ever you are switching next fragment clear the stack.