코틀린 공부32

리사이클러 뷰- 목록화면 구성

리사이클러 뷰 – 목록 화면 구성 리사이클러 뷰 기초 사용법

 

리사이클 뷰는 여러 가지 항목을 나열하는 목록 화면을 만들 때 사용합니다. 리사이클 뷰는 RecyclerView클래스를 이용하지만  이것만으로는 화면에 아무것도 출력되지 않습니다. 다음과 같은 구성요소를 이용해야 합니다.

 

구성요소	설명
ViewHolder(필수)	항목에 필요한 뷰 객체를 가집니다.
Adapter(필수)	항목을 구성합니다.
LayoutManager(필수)	항목을 배치합니다.
ItemDecoration(옵션)	항목을 꾸밉니다

 

참고 

https://developer.android.com/guide/topics/ui/layout/recyclerview?hl=ko 

RecyclerView로 동적 목록 만들기  |  Android 개발자  |  Android Developers

 

그래들 파일 설정(안드로이드 스튜디오 4.1부터 자동으로 추가)

implementation 'androidx.recyclerview:recyclerview:1.1.0'

 

리사이클 뷰 레이아웃 XML 파일에 등록(activity_main.xml)

<android.recyclerview.widget.RecyclerView
	xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/recyclerview" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" />

 

목록에 표시할 항목을 디자인한 레이아웃 XML 생성(item_main.xml)

<LinearLayout 
	android:id="@+id/item_root"
	xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="16dp">
    <TextView
        android:id="@+id/item_data"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:textStyle="bold"
        android:textSize="16dp" />
</LinearLayout>

 

뷰 홀더 준비

각 항목에 해당하는 뷰 객체를 가지는 뷰 홀더는 RecyclerView.ViewHolder를 상속받아 작성합니다.

class MyViewHolder(val binding: ItemMainBinding): RecyclerView.ViewHolder(binding.root)

---

어댑터 준비

 

어댑터는 뷰 홀더의 뷰에 데이터를 출력해 각 항목을 만들어 주는 역할을 합니다.

class MyAdapter(val binding: ItemMainbinding):
	RecyclerView.Adapter <RecyclerView.ViewHolder>() {
    override fun getItemCount(): Int {
		TODO("Not yet implemented")
	}
    override fun onCreateViewHolder (parent: ViewGroup, viewType: Int): 
    RecyclerView.ViewHolder {
		TODO("Not yet implemented")
	}
	override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
		TODO("Not yet implemented")
    }
}

어뎁터에서 재정의 필요 함수	설명
getItemCount()	항목 개수를 판단하려고 자동으로 호출됩니다.
onCreateViewHolder()	항목의 뷰를 가지는 뷰 홀더를 준비하려고 자동으로 호출됩니다.
onBindViewHolder()	뷰 홀더의 뷰에 데이터를 출력하려고 자동으로 호출됩니다.

 

getItemCount() / 반환하는 숫자만큼  onBindViewHolder() 함수가 호출되어 항목을 만듭니다.

override fun getItemCount(): Int = datas.size

 

onCreateViewHolder() / 항목을 구성함때 이용할 뷰 홀더 객체를 준비합니다.

override fun onCreateViewHolder (parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder 
	= MyViewHolder (ItemMainBinding.inflate(LayoutInflater.from(parent.context),parent, false))

 

onBindViewHolder() / 뷰에 데이터 출력

override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
	Log.d("kkang", "onBindViewHolder : $position") 
	val binding = (holder as MyViewHolder).binding 
	//뷰에 데이터 출력
	binding.itemData.text = datas[position]
	// 뷰에 이벤트 추가
	binding.itemRoot.setOnClickListener {
		Log.d("kkang", "item root click : $position")
    }
}

---

리사이클러 뷰 출력

 

어댑터를 준비했으면 마지막으로 리사이클러 뷰에 어댑터와 레이아웃 매니저를 등록해 화면에 출력합니다.

class RecyclerViewActivity : AppCompatActivity() { 
	override fun onCreate(savedInstanceState: Bundle?) {
		super.onCreate(savedInstanceState)
		val binding = ActivityRecyclerViewBinding.inflate(LayoutInflater) 
        setContentView(binding.root) 
        val datas = mutableListof<String>() 
        for(i in 1..10){
			datas.add("Item $i")
        }
        binding recyclerView.layoutManager = LinearLayoutManager(this) 
        binding.recyclerView.adapter = MyAdapter(datas) 
        binding.recyclerView.addItemDecoration(DividerItemDecoration(this, LinearLayout Manager.VERTICAL))
    }
}

---

항목을 동적으로 추가 · 제거

 

항목을 동적으로 추가나 제거를 하고 싶다면 항목을 구성하는 데이터에 새로운 데이터를 추가하거나 제거한 후 어댑터의 notifyDataSetChanged() 함수를 호출하면 됩니다.

datas.add("new data") 
adapter.notifyDataSetChanged()

---