[Android/Kotlin] Viewpager2로 이미지 슬라이드 & indicator

HomeBannerFragmentStateAdapter

class HomeBannerFragmentStateAdapter(fragmentActivity: FragmentActivity, val bannerList:List<ResultBanner>): FragmentStateAdapter(fragmentActivity) {

    override fun getItemCount(): Int = 4

    override fun createFragment(position: Int): Fragment {
        return when(position) {
            0 -> HomeBannerFragment(bannerList[0].thumbnailUrl, bannerList[0].title, bannerList[0].postId)
            1 -> HomeBannerFragment(bannerList[1].thumbnailUrl, bannerList[1].title, bannerList[1].postId)
            2 -> HomeBannerFragment(bannerList[2].thumbnailUrl, bannerList[2].title, bannerList[2].postId)
            else -> HomeBannerFragment(bannerList[3].thumbnailUrl, bannerList[3].title, bannerList[3].postId)
        }
    }
}

 

HomeBannerFragment

class HomeBannerFragment(private var image:String, var title:String, var postId:Int) : BaseFragment<LayoutBannerBinding>(LayoutBannerBinding::bind,
    R.layout.layout_banner) {

    override fun onActivityCreated(savedInstanceState: Bundle?) {
        super.onActivityCreated(savedInstanceState)

        Glide.with(this)
            .load(image)
            .into(binding.banneritem)

        //binding.banneritem.alpha = 0.7F

        binding.bannerTitle.text = title

       // binding.banneritem.setOnClickListener {
       //     val intent = Intent(requireContext(), FeedDetailActivity::class.java)
       //     intent.putExtra("postId", postId)
       //     startActivity(intent)
       // }
    }
}

 

✔️ viewpager에 HomeBannerFragmentStateAdapter 세팅

 

val pagerAdapter = HomeBannerFragmentStateAdapter(this, response.result //배너리스트)

binding.viewpager.adapter = pagerAdapter

 

✔️  indicator 연결

 

위에서 사용한 indicator library

https://github.com/tommybuonomo/dotsindicator

GitHub - tommybuonomo/dotsindicator: Three material Dots Indicators for view pagers in Android !

 

binding.pickedIndicator.setViewPager2(binding.pickedBannerViewPager)

 

✔️ 자동 슬라이드 되게하려면?

 

https://todaycode.tistory.com/27

[Kotlin] 뷰페이저2 활용 예제 : tabLayout, indicator, fragment, 자동 스크롤, 무한스크롤, 배너 등