[Android/Kotlin] ViewPager2

Study/Android

[Android/Kotlin] ViewPager2 - Infinite Loop

힝쏘 2022. 4. 12. 16:44

이 글에서는 어떻게 무한로딩 ViewPager2를 만드는지,

Infinite Loop ViewPager2를 만드는 방법에 대해 다룰 것이다.

말만 확장이지 일반적인 ViewPager2와 별 차이 없고

약간의 트릭으로 무한 루프처럼 보이게 할 뿐이다.

1. FragmentStateAdapter 추가

위에서 말했듯이 약간의 트릭으로 무한 루프처럼 보이게 만들어야 한다.

Adapter를 붙일 때 fragment의 수를 엄청 많이 만들어서

사용자가 페이지를 아무리 넘겨도 끝이 없는 것처럼 만드는 방법이다.

찝찝하지만 며칠동안 찾아본 예제 중에 내가 원하는대로 작동하는 예제는 이것밖에 없는 것 같다.

FragmentStateAdapter에서 getItemCount()의 반환값을 Int.MAX_VALUE로 지정해서

무한 루프 ViewPager2처럼 보이게 해준다.

class FirstFragmentStateAdapter(fragmentActivity: FragmentActivity)
    : FragmentStateAdapter(fragmentActivity) {

    var fragments = mutableListOf<CalendarFragment>()
    val firstFragmentPosition = Int.MAX_VALUE / 2
    
    override fun getItemCount(): Int = fragments.size

    override fun createFragment(position: Int): Fragment = 
        CalendarFragment(fragments[position.rem(fragments.size)], position)

    fun updateFragments(list: List<CalendarFragment>) {
        fragments.apply {
            clear()
            addAll(list)
        }
        notifyDataSetChanged()
    }

}

Stackoverflow에서 본 방법인데

기존의 FragmentStateAdapter를 사용하는 방법처럼

Adapter를 사용할 화면(FirstFragment)에서 Adapter에 List<Fragmet>()를 넘겨

ViewPager2에 넣을 Fragment의 개수를 정하는게 아니라

Adapter의 getItemCount에서 fake 값으로 ItemCount를 반환하기 때문에

굳이 updateFragmets()는 필요없을 것 같아 없앴다.

class FirstFragmentStateAdapter(fragmentActivity: FragmentActivity)
   : FragmentStateAdapter(fragmentActivity) {

    private val pageCount = Int.MAX_VALUE
    val firstFragmentPosition = Int.MAX_VALUE / 2

    override fun getItemCount(): Int = Int.MAX_VALUE

    override fun createFragment(position: Int): Fragment {
        val calendarFragment = CalendarFragment()
        calendarFragment.pageIndex = position
        return calendarFragment
    }

}

createFragment()에서 CalendarFragment를 반환하면서 position값을 CalendarFragment의 pageIndex로 지정한다.

pageIndex는 CalendarFragment에서 캘린더의 월을 지정하는 값으로 쓰인다.

2. FragmentStateAdapter 연결

이제 FirstFragment의 ViewPager2에 FirstFragmentStateAdapter를 붙이자.

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        initView()
    }

    fun initView() {
       val firstFragmentStateAdapter
            = FirstFragmentStateAdapter(requireActivity())
        calendarViewPager.adapter = firstFragmentStateAdapter
        calendarViewPager.orientation = ViewPager2.ORIENTATION_VERTICAL
        calendarPagerFragmentStateAdapter.apply {
           firstFragmentStateAdapter.setCurrentItem(this.firstFragmentPosition, false)
        }
    }

MainActivity - ViewPager2의 orientation이 horizontal이기 때문에

Swipe 이벤트가 겹치는걸 피하기 위해 orientation을 Vertical로 지정했다.

그리고 FirstFragment에서 ViewPager2를 위아래로 넉넉하게 이동할 수 있도록

FirstFragmentStateAdapter에서 변수로 만들어뒀던 firstFragmentPosition으로

ViewPager2의 currentItem을 지정한다.

currentItem을 firstFragmentPosition으로 지정하는 이유는

firstFragmentPosition의 값은 Int.MAX_VALUE/2이며 이는 Int.MAX_VALUE의 딱 중간위치이기 때문이다.