[Android, Databinding] 데이터 바인딩 라이브러리 사용기

안녕하세요. 블랙진입니다.

이번 시간에는 데이터 바인딩에 대해 포스팅 해보겠습니다.

source of the image 

데이턴 바인딩은 데이터를 xml 상에 바로 연동시키는 작업을 말합니다.

자바 코드상에서 textView.setText() 해줄 필요 없이 데이터만 변경해 주면 자동으로 xml 로 연결되는 마법!!

그럼 데이터바인딩에 대해 쉬운 예제로 알아보겠습니다.

1. APP 단계의 build.gradle 에 dataBinding 을 추가해 줍니다.

dataBinding {
    enabled = true
}

에러) unresolved reference databinding 발생

kotlin 으로 작업 할 때  바인딩 에러가 발생할 수 있습니다.

unresolved reference databinding 를 통해 에러를 해결해 주세요!

혹은  APP 단계의 build.gradle 상단에

apply plugin: 'kotlin-kapt'

코드만 붙여줘도 충분히 해결이 된답니다 :)

2. User 클래스를 새로 만들어 줍니다.

User.kt

class User(val firstName: String, val lastName: String)

3.  activity_main.xml 을 <layout> 으로 둘러 싸도록 합니다.

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">
    
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>

        <TextView 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

    </LinearLayout>

</layout>

xml을 <layout> 으로 둘러 싸면 바인딩된 xml 을 불러다 사용할 수 있게 됩니다.

이제 위 코드에서 User 클래스를 바인딩 해주겠습니다.

4. User 클래스를 바인딩 해줍니다.

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">

    <data>
        <!-- data 이름을 user 로 설정하였습니다. -->
        <!-- type 은 User 클래스 위치와 함께 표시되어야 합니다. -->
        <variable name="user" type="{packageName}.User"/>
    </data>

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <!-- user 의 firstName 을 설정해줍니다. -->
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.firstName}"/>

        <!-- user 의 lastName 을 설정해줍니다. -->
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.lastName}"/>

    </LinearLayout>

</layout>

  

제 User.kt 의 파일 입니다. 따라서 data 의 type 은 "com.tistory.black_jin0427.mydatabinding.User"가 됩니다.

5. User 에 데이터를 넣고 화면에 보이게 해줍니다.

MainActivity.kt

class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        //setContentView(R.layout.activity_main)
        binding = DataBindingUtil.setContentView(this, R.layout.activity_main)
        binding.user = User("Black","Jin")

    }
}

2번에서 activity_main 을 <layer> 로 감싸주었습니다. 그렇게 되면 AcitivityMainBinding 이라는 클래스가 내부적으로 자동 생성됩니다.

(생성이 안되 있다면 Build - Rebuild Project 를 실행해 주세요)

firstName = 'Black',  lastName = 'Jin' 데이터를 가지는 User 클래스를 생성한 후 binding 변수에 setUser 해주면 User 데이터가 가지고 있는 firstName 과 lastName이 자동으로 xml 에 적용됩니다.

<!-- user 의 firstName 을 설정해줍니다. -->
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@{user.firstName}"/>

<!-- user 의 lastName 을 설정해줍니다. -->
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@{user.lastName}"/>

위와 같이 설정해 주신것 기억나시죠?

TextView 의 아이디를 설정해 주지 않고 setText 를 안해줘도 xml 상에서 바로 데이터를 입력해 줄 수 있는 데이터바인딩!!

이것 말고도 정말 다양한 기능이 있습니다. 이는 안드로이드 공식 사이트 에서 확인하시고 적용해 주시면 됩니다.