【Android】 ViewPager2+Tablayout实现滑动分页

前言

ViewPager2是ViewPager的一个升级版,如果我们想要在项目中联动使用,我们需要导入如下依赖

implementation ‘androidx.viewpager2:viewpager2:1.0.0-alpha01’
implementation “com.google.android.material:material:1.1.0-beta01”

需要注意的是,viewPager2是AndroidX库下的Widget,所以请从support库过渡到AndroidX库。

创建一个xml布局

在这里插入图片描述

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".activity.settingActivity">

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tablayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <com.google.android.material.tabs.TabItem
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Monday" />

        <com.google.android.material.tabs.TabItem
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Tuesday" />

        <com.google.android.material.tabs.TabItem
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Wednesday" />
    </com.google.android.material.tabs.TabLayout>

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal" />
</LinearLayout>

创建一个FragmentStateAdapter

public class ScreenSlidePagerAdapter extends FragmentStateAdapter {
    private int NUM_PAGES = 3;
    public ScreenSlidePagerAdapter(FragmentActivity fa) {
        super(fa);
    }

    @Override
    public Fragment createFragment(int position) {

        switch (position)
        {
            case 0:
                return new OneFragment();

            case 1:
                return new TwoFragment();

            default:
                return new ThreeFragment();

        }
    }

    @Override
    public int getItemCount() {
        return NUM_PAGES;
    }
}

在Activity中绑定

public class settingActivity extends AppCompatActivity {

    @BindView(R.id.pager)
    ViewPager2 pager;

    @BindView(R.id.tablayout)
    TabLayout tabLayout;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_setting);
        ButterKnife.bind(this);

        pager.setAdapter(new ScreenSlidePagerAdapter(this));
        new TabLayoutMediator(tabLayout, pager, true,new TabLayoutMediator.TabConfigurationStrategy(){

            @Override
            public void onConfigureTab(@NonNull TabLayout.Tab tab, int position) {
                tab.setText("hello"+position);
            }
        }).attach();

    }
}

上面@BindViewButterKnife框架的使用,作用是去除类似于findviewById这类的模板化代码。

经过上面的配置,我们就通过ViewPager2+Tablayout两个组件实现了滑动分页

在这里插入图片描述

发布了245 篇原创文章 · 获赞 108 · 访问量 5万+

猜你喜欢

转载自blog.csdn.net/weixin_43889841/article/details/104354281