[Android] DataBinding으로 RecyclerView 만들기 (리스트 높이 제한 방법)

 

1. DataBinding 설정

build.gradle(Module)에 DataBinding 설정을 추가합니다.

plugins {
    id 'com.android.application'
    id 'kotlin-android'
}

android {
	...
	// 설정 추가 
	buildFeatures {
		dataBinding = true
	}
}

2. RecyclerView의 아이템 layout 생성

1) 리스트의 아이템으로 사용될 layout의 xml을 생성합니다.

- 전체 레이아웃을 <layout> 태그로 감싸게 되면 레이아웃 이름의 카멜형태로 데이터바인딩 객체가 생성됩니다.

- list_item.xml으로 만들면 ListItemBinding 객체가 생성됩니다.

2) 이미지와 텍스트로 구성된 아이템으로 상단에 표시할 텍스트를 변수명으로 선언합니다.

3) 변수명을 TextView에 android:text=@{변수명} 형태로 넣어줍니다.

<?xml version="1.0" encoding="utf-8"?>
<layout>

    // 표시될 텍스트 명시 
    <data>
        <variable
            name="name"
            type="String" />
    </data>

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:src="@android:drawable/star_on"
            android:layout_gravity="center_vertical"/>

        <TextView
            android:id="@+id/textview_item"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="12dp"
            android:textSize="14sp" 
            
            /* 상단에 선언한 String 변수명 입력 */
            android:text="@{name}" 
        />
    </LinearLayout>
</layout>

3. 리스트가 표시될 화면의 layout xml에 RecyclerView 추가

1) layout xml에 RecyclerView를 추가합니다.

2) RecyclerView 태그의 orientation으로 리스트가 표시/스크롤될 방향을 명시합니다. (vertical: 세로, horizontal: 가로)

3) 리스트가 그려질 모양에 맞게 layoutManager를 명시합니다.

- 목록 형태: LinearLayoutManager

- 그리드 형태 (바둑판 형태): GridLayoutManager

<?xml version="1.0" encoding="utf-8"?>
<layout>

    <LinearLayout 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"
        android:orientation="vertical"
        tools:context=".MainActivity">

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recyclerview"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            
            /* 리스트가 그려질 방향 */ 
            android:orientation="vertical" 
            
            /* 리스트가 그려질 모양 */ 
            app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"  
        />

    </LinearLayout>
</layout>

4. RecyclerView의 Adapter와 ViewHolder 생성

1) RecyclerView.Adapter를 상속받는 Adapter 클래스를 생성합니다.

2) 생성한 Adapter 클래스의 안에 inner class로 RecyclerView.ViewHolder를 상속받는 ViewHolder 클래스를 생성합니다.

3) Adapter 클래스의 onCreateViewHolder()에서 2번에서 생성한 item layout을 binding한 후 ViewHolder 클래스를 반환합니다.

4) ViewHolder 클래스에 데이터를 바인딩하기위한 bind()를 생성한 후 item layout에 명시한 변수명으로 데이터를 바인딩합니다.

class CustomAdapter(private val list : List<String>) : RecyclerView.Adapter<CustomAdapter.CustomViewHolder>() {
        override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
            // item layout 바인딩 객체 생성         
            // item layout의 xml 파일 명을 list_item.xml으로 만들었기 때문에, ListItemBinding 객체가 생성됨 
            val binding = DataBindingUtil.inflate<ListItemBinding>(
                LayoutInflater.from(parent.context),
                R.layout.list_item, parent, false
            )
            return CustomViewHolder(binding)
        }

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

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

        inner class CustomViewHolder(private val binding: ListItemBinding) : RecyclerView.ViewHolder(binding.root) {
            fun bind(text: String) {
                // item layout에 명시한 변수인 "name"에 값을 넣음            
                binding.name = text
            }
        }

    }

5. Recyclerview와 Adapter 연결

Adapter를 생성하여 RecyclerView에 연결합니다.

val binding = DataBindingUtil.setContentView(this, R.layout.activity_main)
val items = listOf("Sophia", "Emma", "Olivia", "Abigail")
val adapter = ListAdapter(items)
binding.recyclerview.adapter = adapter

 

⭐️ 6. RecyclerView의 길이를 제한하고 싶을 경우 ⭐️

1) RecyclerView가 ConstraintLayout 아래에 있어야 합니다.

2) RecyclerView 태그에 아래와 같이 값을 설정합니다.

- app:layout_constrainedHeight="true"

- app:layout_constraintHeight_max="200dp" // 리스트의 높이 값

<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="match_parent"
        android:background="#f1f1f1"
        android:orientation="vertical">

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recyclerview"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintVertical_bias="0"
            
            // 추가할 설정 
            app:layout_constrainedHeight="true"
            app:layout_constraintHeight_max="200dp"
            />

</androidx.constraintlayout.widget.ConstraintLayout>