13.[Android] RecyclerView 예제

LinearLayout 형태에 RecyclerView를 만들어 보겠습니다.

 

1. gradle에 RecyclerView 정의 

 app -> build.gradle에 들어가서 정의를 해줍니다.

 뒤에 버전은 최신 버전에 맡게 작성해주시면 됩니다.

dependencies {
    implementation "com.google.android.material:material:1.0.0"
}

2. itemlayout.xml 만들기 

  RecyclerView에 들어갈 item layout을 만들어 줍니다.

  LinearLayout으로 TextView를 넣어 보겠습니다.

<?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="wrap_content"
    android:orientation="vertical"
    android:padding="10dp">

    <TextView
        android:id="@+id/tv_food_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#FFEEEE" />

</LinearLayout>

3. Adapter 만들기

CustomAdapter라는 이름으로  RecyclerView.Adapter를 상속받는 class 하나를 만들어 주겠습니다.

상속을 받기 위해서는 3가지의 메서드를 필수적으로 오버라이드 해야 합니다.

onCreateViewHolder(parent: ViewGroup, viewType: Int)	viewType으로 지정한 형태의 뷰홀더 객체를 생성합니다.
getItemCount()	전체 아이템의 크기를 리턴합니다.
onBindViewHolder(holder: CustomViewHolder, position: Int)	position이 가르키는 위치에 데이터를  뷰홀더의 아이템뷰에 표시합니다.

 

package com.cnm.recyclerviewsample2

import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.recyclerview.widget.RecyclerView
import kotlinx.android.synthetic.main.itemlayout.view.*

class CustomAdapter : RecyclerView.Adapter<CustomAdapter.CustomViewHolder>() {

    //   RecyclerView에 뿌릴 아이템을 담을 리스트
    private val listdata = mutableListOf<String>()

    //    아이템 리스트를 받아와 listdata에 넣어주는 메서드
    fun setList(list: List<String>) {
        listdata.addAll(list)
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): CustomViewHolder {

//        LayoutInflater를 만들어 줍니다.
        val inflater = LayoutInflater.from(parent.context)
//        LayoutInflater를 통하여 xml을 View의 형태로 만들어 줍니다.
        val view = inflater.inflate(R.layout.itemlayout, parent, false)
//        만들어진 View를 ViewHolder에 넘겨줍니다.
        return CustomViewHolder(view)
    }

    //    listdata의 크기를 리턴합니다.
    override fun getItemCount(): Int {
        return listdata.size
    }

    //     position이 가르키는 listdata에 있는 data를 표시하기 위해 넘겨줍니다.
    override fun onBindViewHolder(holder: CustomViewHolder, position: Int) {
        holder.Bind(listdata[position])
    }


    class CustomViewHolder(view: View) : RecyclerView.ViewHolder(view) {
        //        data를 뷰에 넣어줍니다.
        fun Bind(data: String) {
            itemView.tv_food_name.text = data
        }
    }
}

4. RecycelerView 추가

activity_main.xml에 RecycelerView를 만들어 줍니다.

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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/rv_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</FrameLayout>

5. adapter 넣어주기, layoutManager 넣어주기

MainActivity.kt에 adapter를 넣어줍니다.

package com.cnm.recyclerviewsample2

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import androidx.recyclerview.widget.LinearLayoutManager
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {

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

        rv_content.run {
            // rv_content라는 id를 가진 RecyclerView의 adapter에 아까 만든 CustomAdapter().setList()를 통해 데이터리스트를 넣어줍니다.
            adapter = CustomAdapter().apply {
                setList(
                    listOf(
                        "소고기", "낙지", "고기", "날고기", "닭고기", "돼지고기", "육회", "말고기", "불고기",
                        "양고기",
                        "쥐고기",
                        "최고기",
                        "콩고기",
                        "타조고기",
                        "퍽퍽살",
                        "회"
                    )
                )
            }
//            layoutManager를 LinearLayout으로 만들어줍니다.
            layoutManager = LinearLayoutManager(this@MainActivity)
        }

    }
}

 

이제 실행을 해보겠습니다.