안드로이드에서 Kotlin으로 recyclerView 구현하기

김명진·2021년 8월 31일
0

안드로이드

목록 보기
22/25

recyclerView를 구현할 activity 또는 fragment

activity_main.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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

recyclerView에 표시될 항목의 레이아웃 구성

item_recyclerview.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="wrap_content"
    android:padding="10dp">

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="아이템 제목"
        android:textSize="20dp"
        app:layout_constraintBottom_toTopOf="@id/subtitle"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/subtitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="이것은 본문입니다."
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/title" />

</androidx.constraintlayout.widget.ConstraintLayout>

항목 레이아웃은 간단하게 제목과 본문 textView 2개만 구현.

recyclerView에 등록할 어댑터 생성

package com.mj.recyclerview_sample

import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import androidx.recyclerview.widget.RecyclerView

class RecyclerViewAdapter(): RecyclerView.Adapter<RecyclerViewAdapter.RecyclerViewViewHolder>() {

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerViewViewHolder {
        val itemView = LayoutInflater.from(parent.context).inflate(R.layout.item_recyclerview, parent, false)
        return RecyclerViewViewHolder(itemView)
    }

    override fun onBindViewHolder(holder: RecyclerViewViewHolder, position: Int) {
        holder.bind(recyclerViewItems[position])
    }

    override fun getItemCount(): Int {
        return recyclerViewItems.size
    }

    inner class RecyclerViewViewHolder(itemView: View): RecyclerView.ViewHolder(itemView) {

        private val title: TextView = itemView.findViewById(R.id.title)
        private val subtitle: TextView = itemView.findViewById(R.id.subtitle)

        fun bind(recyclerViewItem: RecyclerViewItem) {
            title.text = recyclerViewItem.title
            subtitle.text = recyclerViewItem.subtitle
        }

    }

}

어댑터를 만들때는 3가지 메서드를 오버라이드 해야한다. 각각 onCreateViewHolder, onBindViewHolder, getItemCount를 구현해야한다. ViewHolder는 아이템에 대한 뷰와 그와 관련된 메타데이터를 가지고 있는 객체이다.

  • onCreateViewHolder - 레이아웃을 만들고 해당 아이템에 관련된 자료를 담을 ViewHolder를 만든다.
  • onBindViewHolder - ViewHolder가 실제로 연결될 때 호출된다.
  • getItemCount - 리스트에 표시될 아이템의 개수를 리턴한다.

코틀린 코드에서 recyclerView 사용하기

MainActivity.kt

package com.mj.recyclerview_sample

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Toast
import androidx.recyclerview.widget.LinearLayoutManager
import androidx.recyclerview.widget.RecyclerView

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

	//리스트에 사용될 ArrayList를 생성한다. 
        val recyclerViewItems: ArrayList<RecyclerViewItem> = ArrayList()
        recyclerViewItems.add(RecyclerViewItem(1, "title1", "subtitle1"))
        recyclerViewItems.add(RecyclerViewItem(2, "title2", "subtitle2"))
        recyclerViewItems.add(RecyclerViewItem(3, "title3", "subtitle3"))
        recyclerViewItems.add(RecyclerViewItem(4, "title4", "subtitle4"))
        recyclerViewItems.add(RecyclerViewItem(5, "title5", "subtitle5"))

	//recyclerView 연결
        val recyclerView = findViewById<RecyclerView>(R.id.recyclerView)
        recyclerView.layoutManager = LinearLayoutManager(this)
        val adapter = RecyclerViewAdapter()
        recyclerView.adapter = adapter

    }
}

//리스트에 사용될 객체
data class RecyclerViewItem(
    var id: Int = 0,
    var title: String = "",
    var subtitle: String = ""
)

recyclerView에 클릭 구현하기

어댑터 생성자에 클릭 리스너 람다 함수를 매개 변수로 설정하기

class RecyclerViewAdapter(
	private var recyclerViewItems: ArrayList<RecyclerViewItem>, 
    	val itemClick: (RecyclerViewItem) -> Unit
        ): RecyclerView.Adapter<RecyclerViewAdapter.RecyclerViewViewHolder>()

Adpater에서 아이템 View 클릭 리스너 호출하기

    inner class RecyclerViewViewHolder(itemView: View): RecyclerView.ViewHolder(itemView) {

        private val title: TextView = itemView.findViewById(R.id.title)
        private val subtitle: TextView = itemView.findViewById(R.id.subtitle)

        fun bind(recyclerViewItem: RecyclerViewItem) {
            title.text = recyclerViewItem.title
            subtitle.text = recyclerViewItem.subtitle

            itemView.setOnClickListener { itemClick(recyclerViewItem) }
        }

    }

코틀린 코드에서 Adpater 생성 시 클릭 이벤트 함수를 넘겨준다

val adapter = RecyclerViewAdapter(recyclerViewItems) { recyclerViewItem ->
	Toast.makeText(this, "${recyclerViewItem.title} 클릭", Toast.LENGTH_SHORT).show()
}
profile
꿈꾸는 개발자

0개의 댓글