使用 TabItem 时如何将 TabLayout 与 ViewPager 同步

Question

我想通过以下代码将 TabLayout 与 TabItem 一起使用：

  <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/color_primary"
        app:tabGravity="fill"
        app:tabIndicatorColor="@color/white"
        app:tabMode="fixed"
        app:tabSelectedTextColor="@color/white"
        app:tabTextColor="@color/gray_light">

        <android.support.design.widget.TabItem
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:icon="@drawable/ic_language" />


        <!-- other tabs ... -->


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

这是正确显示图标的方式：

但问题是当我想将我的 TabLayout 添加到 ViewPager 时，使用以下代码，它们都存在并且可以单击但消失了。我错过了什么吗？

 MyPagerAdapter adapter = new MyPagerAdapter(getFragmentManager());
 pager.setAdapter(adapter);

 tabLayout.setupWithViewPager(pager);

这是结果：

Answer 1

tabLayout.setupWithViewPager(pager) 要做的是在视图寻呼机的适配器上调用 getPageTitle() 并使用返回的字符串创建选项卡。我建议不要调用 setupWithViewPager()。然后你需要做两件事：

使用 OnPageChangeListener 实现调用 viewPager.addOnPageChangeListener，该实现将 select 选项卡基于 selected 页面。
使用 OnTabSelectedListener 实现调用 tabLayout.setOnTabSelectedListener，该实现将使用 selected 选项卡编号调用 viewPager.setCurrentPage()。

只需确保您的 PagerAdapter 计数与 TabLayout 中的标签数相匹配。

Answer 2

这很有帮助：

/////// 正在同步！！！

替换

setupWithViewPager();

有

tablayout.addOnTabSelectedListener(new TabLayout.ViewPagerOnTabSelectedListener(viewPager));
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tablayout));

使用 TabItem 时如何将 TabLayout 与 ViewPager 同步

How sync TabLayout with ViewPager when using TabItem

android

material-design

android-tablayout

android-support-design