TabLayout 滑动不会改变 Tab 焦点

Question

我在它下面有一个tabLayout和一个viewPager 。 当我单击选项卡时，它可以很好地切换选项卡。 但是，当我滑动时，viewPage 会滑动，但选项卡不会改变焦点。 我必须手动单击相应的选项卡才能更改焦点（viewPager 不会更改）。

例如，如果我在第 4 张幻灯片上，我向左滑动，viewPage 会转到第 3 张幻灯片，但选项卡没有聚焦。 我必须手动点击第三个选项卡才能更改焦点。

我想知道当我在 viewPager 中从一个视图滑动到另一个视图时如何让选项卡跟随滑动。

片段 XML：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">

    <com.google.android.material.tabs.TabLayout
        android:layout_height="wrap_content"
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintBottom_toTopOf="@id/pager"/>

    <androidx.viewpager.widget.ViewPager
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/pager"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</androidx.constraintlayout.widget.ConstraintLayout>

寻呼机片段：

public class PagerFragment extends Fragment {
   
    ViewPagerAdapter pagerAdapter;

    ViewPager pager;
    TabLayout tl;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        pagerAdapter = new ViewPagerAdapter(this.getContext(), getChildFragmentManager(), 4, getActivity());
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        final View view = super.onCreateView(inflater, container, savedInstanceState);
        ViewGroup root = (ViewGroup) inflater.inflate(R.layout.fragment_pager, null);
        pager = root.findViewById(R.id.pager);
        pager.setAdapter(pagerAdapter);
        tl = root.findViewById(R.id.tab_layout);
        tl.addTab(tl.newTab().setText("1"));
        tl.addTab(tl.newTab().setText("2"));
        tl.addTab(tl.newTab().setText("3"));
        tl.addTab(tl.newTab().setText("4"));

        tl.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                pager.setCurrentItem(tab.getPosition());
            }

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

            }

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

            }
        });
        tl.addOnTabSelectedListener(new TabLayout.ViewPagerOnTabSelectedListener(pager));

        return root;
    }
}

适配器：

public class ViewPagerAdapter extends FragmentPagerAdapter {

    private Context myContext;
    int totalTabs;

    public ViewPagerAdapter(Context context, FragmentManager fm, int totalTabs, FragmentActivity fa) {
        super(fm);
        myContext = context;
        this.totalTabs = totalTabs;
    }

    public Fragment getItem(int position) {
        graph_test gt = new graph_test(String.valueOf(position), position);
        return gt;
    }

    @Override
    public int getCount() {
        return totalTabs;
    }
}

注意：我知道 FragmentPagerAdapter 已被弃用。 我被要求这样做。

谢谢。

Answer 1

使用androidx.viewpager.widget.ViewPager您还必须使用TabLayout.TabLayoutOnPageChangeListener设置ViewPager.OnPageChangeListener ，如下所示：

 pager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tl));

通过执行上述操作，您应该能够在向左或向右滑动 ViewPager 时更改 Tab 焦点。

Answer 2

onViewCreated() 使用

TabLayoutMediator(tabLayout, viewPager){ tab, position ->
    // set tab text by given *position*
    tab.text = "Tab_{position}" // for example
}.atach()

链接 TabLayout 和 ViewPager 并附加它