[kotlin] 코틀린 데이터 바인딩을 사용하여 레이아웃을 동적으로 변경하는 방법

코틀린에서 데이터 바인딩을 사용하면 레이아웃을 동적으로 변경하는 것이 매우 간단해집니다. 이 기술을 사용하면 앱 UI를 업데이트하는 데 필요한 코드 양을 줄일 수 있습니다.

데이터 바인딩 설정

우선 데이터 바인딩을 사용하려면 build.gradle 파일에 아래 코드를 추가해야 합니다.

android {
    ...
    buildFeatures {
        dataBinding true
    }
}

이후에 데이터 바인딩을 적용하려는 XML 레이아웃 파일의 최상위 요소에 다음 코드를 추가합니다.

<layout xmlns:android="http://schemas.android.com/apk/res/android">
    <data>
        <variable
            name="viewModel"
            type="com.example.ViewModel" />
    </data>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        ...
    </LinearLayout>
</layout>

ViewModel 만들기

다음으로 ViewModel 클래스를 만들어야 합니다. 이 클래스는 레이아웃과 상호작용하는 데 사용됩니다. 아래는 ViewModel 클래스의 간단한 예시입니다.

import androidx.databinding.BaseObservable
import androidx.databinding.Bindable

class ViewModel : BaseObservable() {
    @get:Bindable
    var text: String = "Initial Text"
        set(value) {
            field = value
            notifyPropertyChanged(BR.text) // BR 자동 import 확인
        }
}

레이아웃 사용하기

이제 데이터 바인딩을 사용하여 UI를 업데이트할 수 있습니다.

val binding : YourLayoutBinding = DataBindingUtil.setContentView(this, R.layout.your_layout)
val viewModel = ViewModel()
binding.viewModel = viewModel
viewModel.text = "Updated Text"

레이아웃에서 데이터를 바인딩하려는 경우, 다음과 같이 XML에 추가할 수 있습니다.

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@{viewModel.text}" />

이렇게하면 바인딩된 데이터가 변경될 때마다 자동으로 UI가 업데이트됩니다.

이렇게하면 코틀린 데이터 바인딩을 사용하여 레이아웃을 동적으로 변경할 수 있습니다. 코드가 훨씬 간결해지고 유지보수도 쉬워집니다.