๐Ÿ”ฅTIL๐Ÿ”ฅ์ŠคํŒŒ๋ฅดํƒ€ | RecyclerView

hyihyiยท2024๋…„ 1์›” 5์ผ
0

TIL

๋ชฉ๋ก ๋ณด๊ธฐ
28/69
post-thumbnail

์ •๋ฆฌ

  1. ์ฝ”๋“œ
  • RecyclerView์— adapter๋ฅผ ์ง‘์–ด๋„ฃ๊ณ  layoutManager ๋„ฃ์–ด์ฃผ๊ธฐ
    val adapter = MyAdapter(dataList)
with(binding.recyclerView){
  //  binding.recyclerView.adapter = adapter //์•„๋ž˜์˜ ์ฝ”๋“œ์™€ ๊ฐ™์Œ
      this@with.adapter = adapter
      layoutManager = LinearLayoutManager(this@MainActivity)
  }

๐Ÿ“–ListView์™€ RecyclerView

ListView
: ์‚ฌ์šฉ์ž๊ฐ€ ์Šคํฌ๋กคํ•  ๋•Œ๋งˆ๋‹ค ์œ„์— ์žˆ๋˜ ์•„์ดํ…œ์€ ์‚ญ์ œ๋˜๊ณ  ๋งจ ์•„๋ž˜์˜ ์•„์ดํ…œ์€ ์ƒ์„ฑ ๋˜๊ธธ ๋ฐ˜๋ณต๋œ๋‹ค.
๋งŒ์•ฝ ์ƒ์„ฑํ•  ์•„์ดํ…œ์ด 100๊ฐœ๋ฉด ์ฒ˜์Œ๋ถ€ํ„ฐ 100๊ฐœ๊ฐ€ ๋งŒ๋“ค์–ด์ง„๋‹ค.
๊ณ„์† ์‚ญ์ œ์™€ ์ƒ์„ฑ์„ ๋ฐ˜๋ณตํ•˜๋ฏ€๋กœ ์„ฑ๋Šฅ์— ์ข‹์ง€ ์•Š๋‹ค.
RecyclerView
์‚ฌ์šฉ์ž๊ฐ€ ์Šคํฌ๋กคํ•  ๋•Œ ์œ„์— ์žˆ๋˜ ์•„์ดํ…œ์€ ์žฌํ™œ์šฉ ๋ผ์„œ ์•„๋ž˜๋กœ ์ด๋™ํ•˜์—ฌ ์žฌ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค.
์•„์ดํ…œ์ด 100๊ฐœ์—ฌ๋„ ํ™”๋ฉด์— ๋ณด์—ฌ์ง€๋Š” ๊ฐœ์ˆ˜(10๊ฐœ ์ •๋„)์˜ View๋งŒ ๋งŒ๋“ค๊ณ  10๊ฐœ๋ฅผ ์žฌํ™œ์šฉํ•ด์„œ ์‚ฌ์šฉํ•œ๋‹ค.

๐Ÿ“RecyclerView ์‚ฌ์šฉํ•˜๊ธฐ ์œ„ํ•ด ํ•„์š”ํ•œ ๊ฒƒ๋“ค

1. Adapter

๋ฐ์ดํ„ฐ์™€ RecyclerView ์‚ฌ์ด์— ์กด์žฌํ•˜๋Š” ๊ฐ์ฒด
๋ฐ์ดํ„ฐ ํ…Œ์ด๋ธ”์„ ๋ชฉ๋ก ํ˜•ํƒœ๋กœ ๋ณด์—ฌ์ฃผ๊ธฐ ์œ„ํ•ด ์‚ฌ์šฉ๋˜๋Š” ๊ฒƒ

2. ViewHolder

์–ด๋Œ‘ํ„ฐ ํด๋ž˜์Šค ๋‚ด๋ถ€์— ์ •์˜ํ•จ
ํ™”๋ฉด์— ํ‘œ์‹œ๋  ๋ฐ์ดํ„ฐ๋‚˜ ์•„์ดํ…œ๋“ค์„ ์ €์žฅํ•˜๋Š” ์—ญํ• 
์žฌ์‚ฌ์šฉ๋˜๋Š” ๋ทฐ๋ฅผ ๊ธฐ์–ตํ•˜๊ณ  ์žˆ์–ด์•ผ ํ•œ๋‹ค.

๐Ÿ“RecyclerView ์‹ค์Šต

1. Adapter.kt

์›๋ณธ ๋ฐ์ดํ„ฐ๋ฅผ ์ „๋‹ฌ๋ฐ›์Œ
1) getItemCount : ๋ฆฌ์‚ฌ์ดํด๋Ÿฌ๋ทฐ์— ํ‘œ์‹œํ•  ํ•ญ๋ชฉ์˜ ์ด ๊ฐœ์ˆ˜๋ฅผ ๋ฐ˜ํ™˜

2) Holder : item_recyclerview ๋ ˆ์ด์•„์›ƒ์— ์žˆ๋Š” ๋ทฐ ํ˜•ํƒœ๋กœ Holder๋ฅผ ๋งŒ๋“ค์–ด์คŒ
๋ทฐํ™€๋” ๊ฐ์ฒด๊ฐ€ ์ƒ์„ฑ๋  ๋•Œ ํ˜ธ์ถœ๋˜๋ฉฐ, ๋ฆฌ์‚ฌ์ดํด๋Ÿฌ๋ทฐ์˜ ๊ฐ ํ•ญ๋ชฉ์„ ์œ„ํ•œ ๋ทฐ๋ฅผ ์ฐธ์กฐ

3) onCreateViewHolder : ๊ทธ๋Ÿฌ๋ฉด onCreateViewHolder์—์„œ ์•Œ์•„์„œ ๋งŒ๋“ค์–ด๋†“์€ Holder๋ฅผ ์‹คํ–‰์‹œ์ผœ Holder๋ฅผ ๋งŒ๋“ค์–ด์คŒ
ViewHolder ๊ฐ์ฒด๋ฅผ ์ƒ์„ฑํ•˜๊ณ  ์ดˆ๊ธฐํ™”

4) onBindViewHolder : onBindViewHolder๊ฐ€ ์‹คํ–‰๋˜๋ฉด์„œ ๋ฐ์ดํ„ฐ๋“ค์ด ํ•˜๋‚˜ํ•˜๋‚˜ ์‹คํ–‰๋จ
๊ฐ ํ•ญ๋ชฉ์— ๋ฐ์ดํ„ฐ๋ฅผ ๋ฐ”์ธ๋”ฉํ•จ

์Šคํฌ๋กค์„ ๋‚ด๋ฆฌ๋ฉด onCreateViewHolder๊ณผ onBindViewHolder๊ฐ€ ์ฐจ๋ก€๋กœ ์‹คํ–‰๋จ

์œ„์˜ 3๊ฐœ ํ•จ์ˆ˜๋ฅผ implement ํ•˜์ง€ ์•Š์œผ๋ฉด ์—๋Ÿฌ๋‚จ

2. item_recyclerview.xml

๋ฆฌ์‚ฌ์ดํด๋Ÿฌ๋ทฐ ํ•ญ๋ชฉ์˜ ๋ ˆ์ด์•„์›ƒ์„ ์ƒ์„ฑ

3. MainActivity.kt

1) ์›๋ณธ ๋ฐ์ดํ„ฐ ์ค€๋น„.

์—ฌ๊ธฐ์„œ๋Š” MyItem ๋ฐ์ดํ„ฐ ํด๋ž˜์Šค๋ฅผ ๋งŒ๋“ค์–ด์„œ ๋ฐ์ดํ„ฐ๋ฅผ ๋‹ด์•„๋†“์Œ.

val dataList = mutableListOf<MyItem>()
dataList.add(MyItem(R.drawable.til_1, "Bella", "1"))
dataList.add(MyItem(R.drawable.til_1, "Charlie", "2"))
dataList.add(MyItem(R.drawable.til_1, "Daisy", "1.5"))
dataList.add(MyItem(R.drawable.til_1, "Duke", "1"))

2) Adapter๋ฅผ ๋งŒ๋“ค์–ด์„œ ์›๋ณธ ๋ฐ์ดํ„ฐ๋ฅผ ์ง‘์–ด๋„ฃ์Œ

val adapter = MyAdapter(dataList)

3) RecyclerView์— adapter๋ฅผ ์ง‘์–ด๋„ฃ๊ณ  layoutManager ๋„ฃ์–ด์ฃผ๊ธฐ

  with(binding.recyclerView){
  //  binding.recyclerView.adapter = adapter //์•„๋ž˜์˜ ์ฝ”๋“œ์™€ ๊ฐ™์Œ
      this@with.adapter = adapter
      layoutManager = LinearLayoutManager(this@MainActivity)
  }

๐Ÿ“bind

ViewHolder์— bindํ•จ์ˆ˜๋ฅผ ์“ฐ๋ฉด onBindViewHolder๊ฐ€ ๊น”๋”ํ•ด์ง„๋‹ค.
VideoHolder์—์„œ ๋ณ€์ˆ˜๋ฅผ private์œผ๋กœ ์„ ์–ธํ•˜๊ณ  onBindViewHolder์—์„œ bind ํ•จ์ˆ˜๋กœ ์“ฐ๋ฉด onBindViewHolder์—์„œ holder๋กœ ์•„์ดํ…œ ํ•˜๋‚˜ํ•˜๋‚˜ ์„ค์ •ํ•ด์ฃผ์ง€ ์•Š์•„๋„ ๋œ๋‹ค.

โž•bind๋ฅผ ์“ฐ์ง€ ์•Š์•˜์„ ๋•Œ

override fun onBindViewHolder(holder: MyAdapter.Holder, position: Int) {
    holder.itemView.setOnClickListener{
        itemClick?.onClick(it, position)
    }
    holder.iconImageView.setImageResource(mItems[position].aIcon)
    holder.name.text = mItems[position].aName
    holder.age.text = mItems[position].aAge
}
inner class Holder(binding: ItemRecyclerviewBinding) : RecyclerView.ViewHolder(binding.root) {
    val iconImageView = binding.iconItem
    val name = binding.textItem1
    val age = binding.textItem2
}

โž–bind๋ฅผ ์ผ์„ ๋•Œ

override fun onBindViewHolder(holder: MyAdapter.Holder, position: Int) {
    val item = mItems[position]
    holder.bind(item)
    holder.itemView.setOnClickListener{
        itemClick?.onClick(it, position)
    }
}
inner class Holder(binding: ItemRecyclerviewBinding) : RecyclerView.ViewHolder(binding.root) {
    private val iconImageView = binding.iconItem
    private val name = binding.textItem1
    private val age = binding.textItem2

    fun bind(item: MyItem){
        iconImageView.setImageResource(item.aIcon)
        name.text = item.aName
        age.text = item.aAge
    }
}

๐Ÿ“Œ์š”์•ฝ

RecyclerView๋Š” ๋จผ์ € getItemCount๋กœ ์ „์ฒด ํ•ญ๋ชฉ์˜ ์ˆ˜๋ฅผ ํŒŒ์•…ํ•˜๊ณ , ํ•„์š”ํ•œ ViewHolder๋ฅผ ์ƒ์„ฑํ•˜๊ธฐ ์œ„ํ•ด onCreateViewHolder๋ฅผ ํ˜ธ์ถœํ•œ๋‹ค.
๊ทธ ํ›„, ๊ฐ ํ•ญ๋ชฉ์˜ ๋ฐ์ดํ„ฐ๋ฅผ ํ•ด๋‹น ๋ทฐ์— ๋ฐ”์ธ๋”ฉํ•˜๊ธฐ ์œ„ํ•ด onBindViewHolder๊ฐ€ ํ˜ธ์ถœ๋œ๋‹ค.
์‚ฌ์šฉ์ž๊ฐ€ ์Šคํฌ๋กคํ•˜์—ฌ ์ƒˆ ํ•ญ๋ชฉ์ด ํ™”๋ฉด์— ๋‚˜ํƒ€๋‚  ๋•Œ๋งˆ๋‹ค onBindViewHolder๊ฐ€ ๋‹ค์‹œ ํ˜ธ์ถœ๋˜์–ด ๋ฐ์ดํ„ฐ๋ฅผ ๋ทฐ์— ์„ค์ •ํ•œ๋‹ค.
์ด๋ฏธ ์กด์žฌํ•˜๋Š” ViewHolder๋Š” ์žฌ์‚ฌ์šฉ๋  ์ˆ˜ ์žˆ์œผ๋ฉฐ, ์ด ๊ฒฝ์šฐ onCreateViewHolder๋Š” ํ˜ธ์ถœ๋˜์ง€ ์•Š๋Š”๋‹ค.

profile
์ž์œ ๋กญ๊ฒŒ ์“ด ๋‚˜์˜ ์ž์œ ๋กœ์šด Development voyageโ›ต

0๊ฐœ์˜ ๋Œ“๊ธ€