[Android/Kotlin] DataBinding (데이터 바인딩)

 

 

저번 포스팅에서 ViewBinding에 대해서 자세히 다뤄보았다. 프로젝트 하면서도 ViewBinding을 많이 사용해왔었는데, 최근 MVVM에 관심이 많아져 살펴보다보니 ViewBinding 보다 DataBinding을 더 많이 사용하는 것을 알게 되었다. 본격적으로 MVVM 공부를 하기 전에 DataBinding에 대해서 공부를 하고 넘어가는 것이 좋을 것 같아서 포스팅을 하게 되었다.

 

 

 

1. DataBinding의 장점

Android 공식 문서를 살펴보니 DataBinding의 장점을 3가지 정도 소개하고 있었다.

✏️ DataBinding의 장점

1. 많은 UI 프레임워크 호출을 삭제 → 파일을 더욱 단순화 시키고, 유지관리가 쉽다.
2. 앱 성능을 향상시킨다.
3. 메모리 누수 및 NullPointerException을 방지해준다.

 

🤔 "어라...? 어디서 많이 봤는데...?"

 

 

찾아보니 DataBinding에 ViewBinding이 포함된 것이라고 봐도 무방하다고 한다. 이러한 포함관계 때문에 ViewBinding의 장점과 DataBinding의 장점이 상당 부분 겹치게 되었다고 한다. 여기서 또 다른 의문이 들게 되었다.

DataBinding, ViewBinding 포함 관계

 

 

 

 

🤔 "그럼 DataBinding을 쓰면 좋은거 아닌가? 왜 굳이 ViewBinding을 사용하지?"

 

ViewBinding과 DataBinding의 차이점과 어떤 기준으로 사용하는지에 대해서 궁금해졌고, 이 둘의 특징에 대해서 조사해보았다.

 

 

 

2. ViewBinding  vs  DataBinding 비교

• 차이점

ViewBinding	DataBinding
단방향 바인딩 (양방향 바인딩 지원X)	양방향 바인딩
코드에 view를 binding하기 위해 사용한다.	view를 binding할 뿐만 아니라 + 데이터를 직접 view에 binding하기 위해 사용한다.
속도가 더 빠르고, 효율적이다.	빌드 시간이 더 걸리고, 코드 구현이 어렵다.
<layout> 태그 없이도 자동으로 모든 layout에 대해 binding 클래스가 생성된다.	<layout> 태그로 감싸줘야 binding 클래스가 생성된다.

 

 

• 사용 목적

- ViewBinding : 단순히 view만 참조할 경우에 사용하는 것이 좋다.

- DataBinding : view와 data를 연결하는 작업을 할 경우에 사용하는 것이 좋다.

   (+ DataBinding은 ViewModel과 LiveData와 함께 많이 쓰인다고 한다. 이 부분은 MVVM 공부하면서 다시 살펴볼 예정이다.)

 

 

 

ViewBinding과 DataBinding은 모두 findViewById()를 대체할 수 있는데, Android 공식 문서에서 아래와 같이 권장하고 있다.

"ViewBinding은 구현이 더 간단하고 성능이 우수하면서도 DataBinding과 같은 장점을 가지고 있다.

때문에 findViewById()를 대체할 경우 DataBinding을 사용하는 것보다 ViewBinding을 대신 사용해 보십시오."

 

 

 

cf.) 한 눈에 보기 좋게 정리되어 있는 표를 발견해서 공유하고자 한다.

	findViewById	DataBinding	ViewBinding
Always null-safe	❌	✅	✅
Provides the correct type of view	❌	✅	✅
Requires boilerplate code	High	Medium	Low
Build time impact	✅	❌	✅
Supported languages	Kotlin, Java	Kotlin, Java	Kotlin, Java

 

 

 

3. DataBinding 사용하기

• build.gradle(:app)

plugins {
    ...
    id 'kotlin-kapt' // 추가하기
}


android {
    ...
    
// Android Studio 4.0 버전 미만일 때
    dataBinding {
        enabled = true
    }
	
// Android Studio 4.0 버전 이상일 때
    buildFeatures {
        dataBinding = true
    }
}

 

• 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>
        
    </data>

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

앞에서 살펴봤듯이, DataBinding은 <layout> 태그로 감싸줘야 binding 클래스가 생성된다.

 

• MainActivity.kt

class MainActivity : AppCompatActivity() {

    private lateinit var binding : ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = DataBindingUtil.setContentView(this, R.layout.activity_main)
    }
}

Activity에 DataBinding을 세팅해준다.

 

---

binding이 잘 되는지 간단하게 확인하기 위해서 데이터를 넣어 확인해보는 실습을 진행해보았다.

 

• User.kt

data class User(
    val name : String,
    val age : String,
    val phone : String,
    val address : String,
)

데이터를 넣기 위해 'User'라는 data class를 생성해주었다.

 

• 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="user"
            type="com.practice.mvvmpractice.User" />
    </data>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        tools:context=".MainActivity">

        <TextView
            android:id="@+id/nameTextView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.name}" />

        <TextView
            android:id="@+id/ageTextView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.age}" />

        <TextView
            android:id="@+id/phoneTextView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.phone}" />

        <TextView
            android:id="@+id/addressTextView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.address}" />

    </LinearLayout>
</layout>

- <data> 태그 안에서 <variable>로 변수를 만들어주고, 원하는 Activity와 연결시켜주면 → 해당 클래스의 속성을 사용할 수 있다.

 

- <variable> 태그 속성

   1) name : 개발자가 임의로 지정하는 값 (레이아웃에서 사용할 변수 이름)

   2) type : xml과 연결될 데이터 (변수의 타입 / 클래스~기본타입 모두 설정 가능O)

 

- 지정한 변수를 사용하기 위해서는 @{ } 구문을 사용하면 된다.

   ex) android:text="@{user.name}"

   

   cf.) @{ } 구문 안에 간단한 표현식도 넣을 수 있다. (아래 링크 참고)

 

• MainActivity.kt

class MainActivity : AppCompatActivity() {

    private lateinit var binding : ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = DataBindingUtil.setContentView(this, R.layout.activity_main)

        binding.user = User("Mike", "30", "010-1234-5678", "Seoul, Republic of Korea")
    }
}

MainActivity에서 binding으로 xml에서 만든 user 변수에 접근하여 데이터를 넣어준다.

 

 

• 결과

User 데이터가 잘 들어간 것을 확인할 수 있었다.

 

 

 

---

 

자세한 내용은 공식 문서를 참고하자.

데이터 결합 라이브러리  |  Android 개발자  |  Android Developers

레이아웃 및 결합 표현식  |  Android 개발자  |  Android Developers