ViewPager2 + TabLayout

기존 ViewPager의 문제점을 보완한 ViewPager2를 사용하여 TabLayout과 연결시켜 보겠습니당~!
뷰페이저2를 통해서 손가락 동작이나 스와이프를 통해 탭 화면이나 리스트 화면 이동 가능~~

1. 의존성 추가

implementation 'androidx.viewpager2:viewpager2:1.0.0'

2. activity_main.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

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

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

</LinearLayout>

LinearLayout 안에 탭레이아웃과 뷰페이저2를 넣어줍니다.

3. 프래그먼트 생성

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".Fragment1">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:textSize="40sp"
        android:text="1" />

</FrameLayout>

원하는 프래그먼트를 생성해 줍니다. 저는 예시로 3개의 프래그먼트를 생성 했습니다.

3. 어댑터 생성

뷰페이저의 프래그먼트를 관리할 어댑터를 생성해야 합니다.
createFragment메소드를 오버라이딩 받아 포지션 별로 생성해야할 프래그먼트들을 지정해 줍니다.

public class PagerAdapter extends FragmentStateAdapter {

    private final ArrayList<Fragment> mFragmentList = new ArrayList<>();
    private Fragment1 fragment1;
    private Fragment2 fragment2;
    private Fragment3 fragment3;

    public PagerAdapter(AppCompatActivity activity) {

        super(activity);

    }
    @NonNull
    @Override
    public Fragment createFragment(int position) {

        switch (position){
            case 0:
                fragment1 = new Fragment1();
                addFragment(fragment1);
                break;
            case 1:
                fragment2 = new Fragment2();
                addFragment(fragment2);
                break;
            case 2:
                fragment3 = new Fragment3();
                addFragment(fragment3);
                break;
            default:
                return null;
        }

        return mFragmentList.get(position);

    }

    public void addFragment(Fragment fragment){

        mFragmentList.add(fragment);

    }

    @Override
    public int getItemCount() {
        return mFragmentList.size();
    }
}

4. 메인액티비티

탭레이아웃메디에이터를 생성해서 뷰페이저와 탭레이아웃을 연결해 줍니다.

public class MainActivity extends AppCompatActivity {

    private ActivityMainBinding binding;
    private ViewPager2 viewPager;
    private PagerAdapter pagerAdapter;
    private TabLayout tabLayout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        binding = ActivityMainBinding.inflate(getLayoutInflater());
        setContentView(binding.getRoot());
        setViewPager();
        setTabLayout();
    }

    private void setViewPager(){
        viewPager = binding.pager;
        pagerAdapter = new PagerAdapter(this);
        pagerAdapter.createFragment(0);
        pagerAdapter.createFragment(1);
        pagerAdapter.createFragment(2);
        viewPager.setAdapter(pagerAdapter);
    }

    private void setTabLayout(){

        tabLayout = binding.tabLayout;
        new TabLayoutMediator(tabLayout, viewPager,
                (tab, position) -> tab.setText("탭" + (position + 1))
        ).attach();

    }
    
}

5. 실행결과

실행결과로 스와이프를 통해 탭이 이동 되는 것을 확인 가능합니다.