[DataBinding/LiveData] 안드로이드 DataBinding과 LiveData 같이 사용하기

안드로이드 DataBinding과 LiveData 같이 사용하기 - 기본

 얼마전에 Android DataBinding의 사용과 LiveData의 사용을 알아봤습니다. 각각의 글에서 DataBinding은 LiveData와, LiveData는 DataBinding과 같이 사용하면 더욱 편한 사용이 될 것이라고 설명드린적이 있습니다. 그 이유는 DataBinding을 이용해 View에 LiveData를 Binding 시키면 LiveData의 값이 변경될 때 View의 Data가 자동으로 바뀌기 때문에 소스코드를 이용한 Data Setting 같은 코드를 줄일 수 있습니다. 그렇기 때문에 우리는 Data의 변경만 신경쓸 수 있어 훨씬 편한 코딩이 될 수 있을것입니다.

 이번 포스팅에서 DataBinding을 LiveData와 함께 사용하는 방법을 알아보도록 하겠습니다.

 아직 DataBinding 또는 LiveData의 사용방법을 잘 모르시는 분들은 아래 글 들을 읽어보시면 도움이 되실 수 있습니다.

안드로이드 DataBinding 기본 사용법

안드로이드 LiveData 기본 사용법

 아래 예제는 Kotlin으로 진행될 예정이니 Kotlin을 아직 모르시는 분들은 아래 포스팅을 참고해 주시기 바랍니다.

Kotlin 기본 문법

 먼저 DataBinding을 사용하려면 App 수준의 build.gradle 파일에 DataBinding 사용을 위한 코드를 명시해주어야 하고 LiveData를 사용하기 위해서는 androidx를 사용해야 합니다. 그럼 소스코드를 보면서 알아보도록 하겠습니다.

1. App 수준의 build.gradle 수정

android {
    ...
    dataBinding {
        enabled = true
    }
}

- android scope에 위 코드를 추가합니다.

implementation 'androidx.appcompat:appcompat:1.1.0'

- LiveData를 사용하기 위해서 위와 같은 종송석이 추가 되어있어야 합니다.

2. xml 코드를 <layout>으로 감싸주기

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<layout 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">

    <data>

        <variable
            name="activity"
            type="com.imaec.bindingadapterex.MainActivity" />
    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

        <TextView
            android:id="@+id/text_view"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{activity.liveText}"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toTopOf="@id/btn_change"
            app:layout_constraintVertical_chainStyle="packed"/>

        <Button
            android:id="@+id/btn_change"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Change Text"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/text_view"
            app:layout_constraintBottom_toBottomOf="parent"/>

    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

- 최상위 Layout을 <layout>으로 감싸줍니다.

- TextView의 text가 자동으로 바뀌는 것을 확인하기 위해 Button을 추가해 줬습니다.

- <variable>은 layout에서 사용할 변수 or 객체입니다. 여기서는 MainActivity를 추가해줬습니다.

- TextView의 text 속성에 activity의 객체인 liveText를 세팅해준 모습입니다. liveText는 MainActivity에 정의합니다.

3. Activity에서 LiveData 변경

MainActivity.kt

private lateinit var binding: ActivityMainBinding

val liveText = MutableLiveData<String>()

- binding과 liveText를 선언 및 정의 해줍니다.

binding = DataBindingUtil.setContentView(this, R.layout.activity_main)
binding.apply {
    lifecycleOwner = this@MainActivity  // **중요** binding에 LifeCycleOwner을 지정해줘야 LiveData가 실시간으로 변화
    activity = this@MainActivity        // xml 파일에 선언한 activity

    btnChange1.setOnClickListener {
        liveText.value = "Hello LiveData!"
    }
    btnChange2.setOnClickListener {
        liveText.value = "Hello DataBinding!"
    }
}

liveText.value = "Hello DataBinding!"

- onCreate 안에서 binding을 정의해줍니다.

- binding의 lifeCycleOwner와 activity를 지정해주고 Button을 누르면 Text가 바뀌게 됩니다.

 위 코드에서 activity_main.xml의 TextView를 바꿔주는 코드는 없습니다. 하지만 btnChange1을 누르면 TextView가 Hello LiveData!로 바뀌게 되고 btnChange2를 누르면 TextView가 Hello DataBinding!으로 바뀌게 됩니다.

 아주 기본적인 사용 방법이지만 DataBinding과 LiveData를 함께 사용하는 것의 강점을 충분히 보여주는 코드라고 생각합니다. TextView 뿐만 아니라 ImageVIew, EditText 같은 것들에서 모두 사용할 수 있고 DataBinding의 BindingAdapter를 사용하면 상황에 따른 Visibility 변화, RecyclerView의 List 변화, RadioButton이나 CheckBox의 check 상태 변화 등 많은 작업을 손쉽게 수행할 수 있습니다.

 다음엔 BindingAdapter를 사용하는 방법을 포스팅 해보도록 하겠습니다. 좋은 기술 귀찮다고 포기하지 마시고 하나하나 천천히 익혀서 가치있는 개발자가 됐으면 좋겠습니다!

 궁금하신 점이나 틀린 내용을 댓글로 달아주시면 답변 드리도록 하겠습니다!

BindingAdapter 사용법

안드로이드 DataBinding에 BindingAdapter 사용법