滑动视图分页片段不会移动选项卡。

Question

我跟随这个教程Android TabLayout Example using ViewPager and Fragments Android TabLayout Example。

但是如果我滑动片段，视图页将不会移动。 我得到了这个结果output I got。 我仅仅按照上述教程进行操作，没有作出任何更改，但当我们滑动片段时，标签不会移动。请帮助我。谢谢。

这是activity_main.xml。

<LinearLayout
android:id="@+id/main_layout"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<!-- our toolbar -->
<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimary"
    android:minHeight="?attr/actionBarSize"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

<!-- our tablayout to display tabs  -->
<android.support.design.widget.TabLayout
    android:id="@+id/tabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimary"
    android:minHeight="?attr/actionBarSize"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

<!-- View pager to swipe views -->
<android.support.v4.view.ViewPager
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="fill_parent"/>

 </LinearLayout>

- user6619854

---

展示一些代码。此外，在创建活动时，Android Studio中有一个默认模板，选择带有选项卡+ViewPager的活动，您将获得可供检查和学习的工作代码。 - Vucko

我按照上面的教程操作，一切都很完美，除了一个问题。当我滑动选项卡时，为什么它们不会切换呢？ - user6619854

不了解您的代码，没有人能知道问题所在。请分享相关代码（特别是您声明TabLayout的xml代码）。 - Vucko

请确保在 Activity 中使用以下代码设置您的 ViewPager 和 TabLayout：tabLayout.setupWithViewPager(yourViewPager); - Mark

你找到问题了吗？ - faranjit

Answer 1

在viewpager上滑动页面，因此它在页面上显示"Tab 3"。这是由于ViewPager的滑动属性导致的。但是选项卡没有相应地更改，所以它显示在TAB1上。因为选项卡布局和viewpager之间没有建立链接。

如果您正在使用ViewPager与此选项卡布局一起使用，则可以调用setupWithViewPager(ViewPager)将两者链接在一起，在此处描述。

因此不需要调用addTab()。

mTabLayout = (TabLayout)findViewById(R.id.tabLayout);
mViewPager = (ViewPager)findViewById(R.id.pager);

//mTabLayout.addTab(mTabLayout.newTab().setText("Tab1"));
//mTabLayout.addTab(mTabLayout.newTab().setText("Tab2"));
//mTabLayout.addTab(mTabLayout.newTab().setText("Tab3"));
//mTabLayout.setTabGravity(TabLayout.GRAVITY_FILL);

Pager pager = new Pager(getSupportFragmentManager(),3);
mViewPager.setAdapter(pager);

mTabLayout.setupWithViewPager(mViewPager);

这个TabLayout将自动从PagerAdapter的页面标题中填充。为此，需在...

class Pager extends FragmentStatePagerAdapter{...

@Override
public CharSequence getPageTitle(int position) {
    super.getPageTitle(position);

    switch (position){
        case 0:
            return "Tab1";
        case 1:
            return "Tab2";
        case 2:
            return "Tab3";

        default:
            return null;
    }
}

- Annada

Answer 2

viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
    tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
        @Override
        public void onTabSelected(TabLayout.Tab tab) {
            viewPager.setCurrentItem(tab.getPosition());
        }

        @Override
        public void onTabUnselected(TabLayout.Tab tab) {

        }

        @Override
        public void onTabReselected(TabLayout.Tab tab) {

        }
    });

- faranjit