在Fragment中嵌套Fragment标签页

Question

在Fragment中嵌套Fragment标签页

35

我在我的主活动中使用片段（使用 Material Design）和选项卡来使用操作栏导航条，如下所示，它的功能良好，但现在我希望在我的片段内实现选项卡导航...

// Add Fragments to Tabs in Main Activity
private void setupViewPager(ViewPager viewPager) {
    Adapter adapter = new Adapter(getSupportFragmentManager());
    adapter.addFragment(new FeedsFragment(), "Latest Updates");
    adapter.addFragment(new ClubTeamsFragment(), "Club Teams");
    adapter.addFragment(new FixturesFragment(), "Fixtures");
    adapter.addFragment(new ResultsFragment(), "Results");
    adapter.addFragment(new ClubFieldsFragment(), "Club Fields");
    viewPager.setAdapter(adapter);
}

我相信TabHost现在已经被弃用了。

我希望实现附图所示的效果。蓝色的选项卡在主活动层级中，灰色的日期选项卡在所选片段视图中。

我已经阅读了一些有关使用Tab Host或Fragment活动的帖子，或者我是否使用扩展到片段的活动？

- BENN1TH

答案在临时中似乎起作用... http://stackoverflow.com/a/27918056/1423608 - BENN1TH

请问您能否分享您的示例代码？ - Pallavi

https://dev59.com/-lgR5IYBdhLWcg3wXMTe#41656303 - BENN1TH

https://github.com/sanjeevkumar2017/Tab-Inside-Fragment - Sanjeev Kumar

2个回答

1

我对Han和BENN1TH的解决方案进行了一些修改，因为选项卡没有对齐，我只添加了两个片段。（他们添加了五个片段）希望这可以帮到你。

        <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_scrollFlags="scroll|enterAlways"
        android:paddingTop="@dimen/appbar_padding_top"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.design.widget.TabLayout
            android:id="@+id/result_tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
        </android.support.design.widget.TabLayout>

    </android.support.design.widget.AppBarLayout>

- Bukunmi

你的意思是： app:tabMaxWidth="0dp" app:tabGravity="fill" app:tabMode="fixed" android:id="@+id/result_tabs" android:layout_width="match_parent" android:layout_height="wrap_content" - kfir

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- BENN1TH · Accepted Answer

请查看下面的答案，我使用了在我的MainActivity中的片段标签内部使用片段标签来实现。

在我的片段中使用getChildFragmentManager()

public class FixturesTabs extends Fragment {

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

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

    View view = inflater.inflate(R.layout.fixtures_new_tabs,container, false);
    // Setting ViewPager for each Tabs
    ViewPager viewPager = (ViewPager) view.findViewById(R.id.viewpager);
    setupViewPager(viewPager);
    // Set Tabs inside Toolbar
    TabLayout tabs = (TabLayout) view.findViewById(R.id.result_tabs);
    tabs.setupWithViewPager(viewPager);


    return view;

}


// Add Fragments to Tabs
private void setupViewPager(ViewPager viewPager) {


    Adapter adapter = new Adapter(getChildFragmentManager());
    adapter.addFragment(new TodaysFixturesFragment(), "Today");
    adapter.addFragment(new WeekFixturesFragment(), "Week");
    adapter.addFragment(new MonthFixturesFragment(), "Month");
    adapter.addFragment(new AllFixturesFragment(), "Month");
    adapter.addFragment(new MyTeamsFixturesFragment(), "My Teams");
    viewPager.setAdapter(adapter);



}

static class Adapter extends FragmentPagerAdapter {
    private final List<Fragment> mFragmentList = new ArrayList<>();
    private final List<String> mFragmentTitleList = new ArrayList<>();

    public Adapter(FragmentManager manager) {
        super(manager);
    }

    @Override
    public Fragment getItem(int position) {
        return mFragmentList.get(position);
    }

    @Override
    public int getCount() {
        return mFragmentList.size();
    }

    public void addFragment(Fragment fragment, String title) {
        mFragmentList.add(fragment);
        mFragmentTitleList.add(title);
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return mFragmentTitleList.get(position);
    }
}



}

我需要将我的XML文件命名为"fixtures_new_tabs.xml"，以匹配填充的布局。

<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:app="http://schemas.android.com/apk/res-auto">


<android.support.design.widget.CoordinatorLayout
    android:id="@+id/main_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.TabLayout
            android:id="@+id/result_tabs"
            android:background="@color/grey"
            app:tabTextColor="@color/medium_grey"
            app:tabSelectedTextColor="@color/colorPrimary"
            app:tabIndicatorColor="@color/colorPrimary"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabMode="scrollable"/>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</android.support.design.widget.CoordinatorLayout>

</RelativeLayout>

希望这可以帮助其他人找到他们的解决方案的方向。

P.S. 如果你在实施这个方法后遇到白屏问题，可能是因为你把相同的父片段添加到了它的子片段中。