片段内的片段选项卡

Posted 2023-04-18

【中文标题】片段内的片段选项卡

【英文标题】：Fragment Tabs inside Fragment

【发布时间】：2017-05-15 18:04:33

【问题描述】：

我在我的主活动中有一个操作栏导航，使用使用 Fragments 的选项卡（使用 Material Design），如下所示，效果很好，但现在我希望在我的 Fragments 中有选项卡导航...

// 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 Activity 的帖子，还是我使用扩展为 Fragment 的 Activity？

【问题讨论】：

答案似乎在此期间有效...***.com/a/27918056/1423608

你能分享你的例子吗

***.com/a/41656303/1423608

github.com/sanjeevkumar2017/Tab-Inside-Fragment

【参考方案1】：

请参阅下面我通过在 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_
android:layout_
xmlns:app="http://schemas.android.com/apk/res-auto">


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

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_
        android:layout_
        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_
            android:layout_
            app:tabMode="scrollable"/>
    </android.support.design.widget.AppBarLayout>

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

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

</RelativeLayout>

希望这有助于或为其他人指明解决方案的方向..

附：如果在实现后出现白屏，则可能已将相同的父片段添加到它的子片段。

【讨论】：

那么 OnFragmentInteractionListener 应该去哪里呢？在父活动中还是在片段中？

我知道已经晚了，但对于未来的观众：@SankaDarshana 它是由父活动实现的

永远不会太晚的伙伴

@BENN1TH 这或多或少类似于我正在寻找的内容，只是我希望将其转换为片段的活动中有动态选项卡，您是否知道如何修复我的问题在这里：***.com/questions/59910317/…

404 on that link @Angela Heely

【参考方案2】：

我在 Han 和 BENN1TH 解决方案中更改了一些内容，因为选项卡没有正确对齐，我只添加了两个片段。 （他们添加了五个片段）。 我希望这会有所帮助。

        <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_
        android:layout_
        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_
            android:layout_>
        </android.support.design.widget.TabLayout>

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

【讨论】：

你的意思是：app:tabMaxWidth="0dp" app:tabGravity="fill" app:tabMode="fixed" android:id="@+id/result_tabs" android:layout_ android:layout_