【Android】ViewPager2和TabLayout协同使用，实现多Fragment页面切换类似于QQ音乐，bilibili效果

原创

已于 2023-12-09 14:51:26 修改 · 7.6k 阅读

标签

#android #java #ViewPager2 #TabLayout #Fragment

于 2023-11-14 20:37:45 首次发布

本文详细介绍了Android中ViewPager2的基本用法，包括Fragment的管理、自定义Adapter以及如何与TabLayout配合使用，涉及TabLayout的动画设置、Tab的动态和静态定制，以及ViewPager2的滑动监听和用户交互控制。

一、ViewPager2的基本用法

使用前先添加依赖：

   implementation 'androidx.appcompat:appcompat:1.4.0' // AndroidX AppCompat
    implementation 'com.google.android.material:material:1.4.0' // Material Design Components

1、制作Fragment

首先制作一个Fragment的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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="SSSSS"
        android:textSize="19sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

然后使用Fragment类绑定这个布局

public class HomeFragment extends Fragment {
   
   
    FragmentBinding binding;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
   
   
        binding = FragmentBinding.inflate(inflater,container,false);
        return binding.getRoot();
    }

    @Override
    public void onDestroyView() {
   
   
        super.onDestroyView();
        binding = null;
    }
}

2、制作Adapter

        <androidx.viewpager2.widget.ViewPager2
            android:id="@+id/viewPager"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

自定义自己的Adapter继承FragmentStateAdapter

制作一个fragmentList管理所有的fragment

public class MyPagerAdapter extends FragmentStateAdapter {
   
   

    List<Fragment> fragmentList;    //管理所有的fragment

    public MyPagerAdapter(@NonNull FragmentActivity fragmentActivity, List<Fragment> fragmentList) {
   
   
        super(fragmentActivity);
        this.fragmentList = fragmentList;
    }

    @NonNull
    @Override
    public Fragment createFragment(int position) {
   
   
        return fragmentList.get(position);
    }


    @Override
    public int getItemCount() {
   
   
        return fragmentList != null ? fragmentList.size() : 0;
    }
}