Android。另一个 tablayout 的选项卡内的 tablayout

Question

是否可以在另一个 tablayout 的标签内放置一个 tablayout？为了更好地解释，我创建了下图。所需的滑动移动如图所示。

我的主activity

Xml

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        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/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabMode="fixed"
            app:tabGravity="fill"/>
    </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>

代码

public class MainActivity extends AppCompatActivity {

    private TabLayout tabLayout;

    private final static int[] tabIcons = {
            R.drawable.ic_tab_1,
            R.drawable.ic_tab_2,
            R.drawable.ic_tab_3,
            R.drawable.ic_tab_4
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
        setupViewPager(viewPager);

        tabLayout = (TabLayout) findViewById(R.id.tabs);
        tabLayout.setupWithViewPager(viewPager);
        setupTabIcons();
    }

    private void setupTabIcons() {
        tabLayout.getTabAt(0).setIcon(tabIcons[0]);
        tabLayout.getTabAt(1).setIcon(tabIcons[1]);
        tabLayout.getTabAt(2).setIcon(tabIcons[2]);
        tabLayout.getTabAt(3).setIcon(tabIcons[3]);
    }

    private void setupViewPager(ViewPager viewPager) {
        ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
        adapter.addFrag(new Fragment1());
        adapter.addFrag(new Fragment2());
        adapter.addFrag(new Fragment3());
        adapter.addFrag(new Fragment4());
        viewPager.setAdapter(adapter);
    }

    class ViewPagerAdapter extends FragmentPagerAdapter {

        private final List<Fragment> mFragmentList = new ArrayList<>();

        ViewPagerAdapter(FragmentManager manager) {
            super(manager);
        }

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

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

        void addFrag(Fragment fragment) {
            mFragmentList.add(fragment);
        }
    }
}

碎片

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:background="@android:color/holo_blue_light"
    android:id="@+id/fragment_1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="myContext">

    <TextView
        android:text="It is just a text."
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/textView"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true" />

</RelativeLayout>

代码

public class Fragment1 extends Fragment {

    public Fragment1() { }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment.
        return inflater.inflate(R.layout.fragment_1, container, false);
    }
}

Fragment2_A和Fragment2_BXML和Java代码应该如何？

Answer 1

好的，所以在你的片段中你只有 TextView。现在为 fragment_2 放置另一个 TabLayout 和 ViewPager（您不需要 AppBar 和 Coordinator，它们已经存在于 [= 的父布局中17=])

frag2.xml

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <android.support.design.widget.TabLayout
        android:id="@+id/frag2_tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabMode="fixed"
        app:tabGravity="fill"/>
    <android.support.v4.view.ViewPager
        android:id="@+id/frag2_viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"  />
</LinearLayout>

你必须创建 Frag2 Fragment ，在 OnCreateView 中使用上面的布局初始化，然后为 frag2_viewpager ViewPager class 设置另一个仅适用于 frag2a.xml 和 frag2b.xml Fragments 的适配器，他们可能只假设 TextViews 或其他。 TabLayout 将被放置在 Frag2 的上方（和 Activity 中的一个，如图所示）

Answer 2

我知道这不是问题的直接答案，我可能会因此受到处罚，但您不应该在选项卡中嵌套选项卡。 Google 使用称为 material 设计的设计概念。选项卡的规则之一是不要嵌套它们。这是页面的 link：https://material.google.com/components/tabs.html#tabs-usage。我认为我们作为开发人员遵循这一点非常重要，以使 Android 平台尽可能通用且令人惊叹。

谢谢，橡树

Answer 3

简单

Everything 将保持相同，就像您在 Activity 中设置 ViewPager 一样。只需要在 Fragment 中使用 getChildFragmentManager() 而不是 getFragmentManager().

来自getChildFragmentManager() documentation

Return a private FragmentManager for placing and managing Fragments inside of this Fragment.

来自getFragmentManager() documentation

Return the FragmentManager for interacting with fragments associated with this fragment's activity.

完整代码见@this answer

Android。另一个 tablayout 的选项卡内的 tablayout

Android. Tablayout inside a tab of another tablayout

android

slide

android-fragments

android-viewpager

android-tablayout

简单