안드로이드 ViewPager2(with kotlin)

ViewPager2에 대해 공부해 보았습니다. 자세한 내용은여기에서 더 공부하실 수 있습니다.

다른 분들은 이미지와 색변경, tablayout등의 예시를 사용하였지만 저는 textview로 한 번 사용해보겠습니다.

먼저 viewpager2를 사용할 activity 또는 fragment xml에서 viewpager2를 선언해줍니다.

<TextView
        android:id="@+id/set_date"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginVertical="10dp"
        android:text="일정 - 11월 8일"
        android:textStyle="bold"
        android:background="@color/whiteblue"
        android:textSize="30dp"
        android:gravity="center"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/calendarview"
        />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="250dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/set_date"
        >
        <androidx.viewpager2.widget.ViewPager2
            android:id="@+id/schedule_viewpager2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="8dp"
            android:orientation="horizontal"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/set_date"
            />
    </LinearLayout>

아래와 같은 사진 처럼 세팅이 되었습니다.

viewpager2의 width와 height가 match_parent가 아닐 경우 오류가 발생할 수도 있어서
크기 조정을 위해 LinearLayout안에 viewpager2를 선언해 주었습니다.

그 후 viewpager2에 보여질 item을 생성해줍니다.
저는 단순히 textview 4개만 생성해주었습니다.

ViewPager2는 ViewPager와 다르게 RecyclerView를 기반으로 빌드되므로 viewpager2에 사용될 adapter를 만들어 주겠습니다.

class ScheduleAdapter : RecyclerView.Adapter<ScheduleAdapter.ScheduleViewHolder>(){
    private lateinit var binding : ViewitemScheduleBinding
    
    var scheduleData = mutableListOf<ScheduleData?>()
    private lateinit var context : Context

    inner class ScheduleViewHolder(private val binding : ViewitemScheduleBinding ) : RecyclerView.ViewHolder(binding.root) {
        private var position : Int? = null
        private val setDate : String = ""
        private val test : TextView = binding.tvsc1
        fun bind(scheduleData: ScheduleData, position : Int) {
            binding.tvsc1.text = scheduleData.scheduleText
            binding.tvsc2.text = "test"
            binding.tvsc3.text = "test"
            binding.tvsc4.text = "set"
        }
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ScheduleViewHolder {
        context = parent.context
        binding = ViewitemScheduleBinding.inflate(LayoutInflater.from(parent.context), parent, false)
        return ScheduleViewHolder(binding)
    }

    override fun onBindViewHolder(holder: ScheduleViewHolder, position: Int) {
        holder.bind(scheduleData[position]!!, position)
    }

    //뷰페이저 수
   override fun getItemCount(): Int {
        return scheduleData.size
    }

}

bind에는 간단하게 textview에 값을 넣어보았습니다.

이제 사용될 activity나 fragment에서 viewpager2와 연결해보겠습니다.

저는 fragment에서 사용해보았습니다.

//간단하게 데이터 추가
		addScheduleData.add(ScheduleData(0, "test", "10시"))
        addScheduleData.add(ScheduleData(1, "test1", "50시"))
        addScheduleData.add(ScheduleData(2, "test2", "30시"))
        addScheduleData.add(ScheduleData(3, "test3", "20시"))
        initViewPager()
        //onCreateView 종료
        
        ...
        
        
        private fun initViewPager() {
        scheduleAdapter = ScheduleAdapter()
        scheduleAdapter!!.scheduleData = addScheduleData
        calendarBinding.scheduleViewpager2.adapter = scheduleAdapter
        //calendarBinding.scheduleViewpager2.orientation = ViewPager2.ORIENTATION_HORIZONTAL
    }
        

1번페이지

2번페이지

3번페이지

잘 구현되어 넘어가지는 것을 확인할 수 있었습니다.