본문 바로가기
🖥 Programming/📱 Android (Kotlin)

[Android][kotlin] DataBinding & LiveData 같이 사용하기

by MinChan-Youn 2021. 10. 28.

ViewBindng이 있다면 이번에는 DataBinding&LiveData에 대해서 알아 보겠습니다.

DataBinding을 통해 View에 LiveData를 Binding시키면 LiveData값이 변경이 될때 View의 Data가 자동적으로 변경되기 때문에 소스코드를 줄일 수 있고 온전히 Data의 변화에만 집중 할 수 있습니다.

 

다음 예제를 통해 알아 보겠습니다.

 

Step 1. DataBinding을 하기위해서 build.gradle파일에 DataBinding 사용을 위한 코드를 명시 해주어야 합니다. LiveData 동일!

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

android {
    compileSdkVersion 30
    buildToolsVersion "30.0.3"

    defaultConfig {
        applicationId "com.example.databinding_kotlin"
        minSdkVersion 21
        targetSdkVersion 30
        versionCode 1
        versionName "1.0"

        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
    }

    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
        }
    }
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
    kotlinOptions {
        jvmTarget = '1.8'
    }

    //(추가)dataBinding & viewBinding
    buildFeatures {
        dataBinding true
        viewBinding true
    }
}

dependencies {

    implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
    implementation 'androidx.core:core-ktx:1.6.0'
    implementation 'androidx.appcompat:appcompat:1.3.1'
    implementation 'com.google.android.material:material:1.4.0'
    implementation 'androidx.constraintlayout:constraintlayout:2.1.1'
    testImplementation 'junit:junit:4.+'
    androidTestImplementation 'androidx.test.ext:junit:1.1.3'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0'


    //(추가)LiveData
    implementation 'androidx.appcompat:appcompat:1.1.0'
}

 

DataBinding 및 LiveData를 사용하기 위한 gradle선언을 주석처리와 함께 정리 해두었습니다. 참고해 주세요!

 

 

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

<?xml version="1.0" encoding="utf-8"?>
<!-- activity_main.xml -->
<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.example.databinding_kotlin.MainActivity" />
    </data>

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

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#F0F0F0"
            android:padding="10dp"
            android:text="@{activity.liveText}"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <Button
            android:id="@+id/m_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="10dp"
            android:text="DataBinding"
            android:textColor="#FFFFFF" />
    </LinearLayout>

</layout>

- 기존 LinearLayout이 전체적으로 감싸져 있다면 DataBinding을 사용하기 위해 전체를 <layout>으로 감싸 주었습니다.

- (주의)<layout>으로 대문자를 사용하는 일이 없도록 주의해 주세요! <Layout>등 안됩니다!

- <variable>은 layout에서 사용할 변수 또는 객체 입니다. MainActivity에서 선언과 동일하게 이름이 같아야 합니다.

- TextView속성이 liveText로 셋팅하여 자동적으로 Text가 변경될 수 있도록 하였습니다.

 

 

Step 3. Kotlin 파일 작성

//MainActivity.kt
class MainActivity : AppCompatActivity() {
    private lateinit var binding: ActivityMainBinding
    var liveText = MutableLiveData<String>()
    var count = 1

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater)
        binding.apply {
            //(중요) DataBinding에 LifeCycleOwner를 지정해줘야 LiveData가 실시간적으로 변경됨
            lifecycleOwner = this@MainActivity
            //xml파일에서 선언한 activity (이름이 같아야함!)
            activity = this@MainActivity
        }
//        binding = DataBindingUtil.setContentView(this, R.layout.activity_main)
        setContentView(binding.root)


        liveText.observe(this, Observer {
            Log.e("YMC", "observe: ${binding.mButton.text.toString()}")
        })


        //DataBinding 예제
        //xml파일에서 설정한 value값은 kotlin에서 MutableLiveData로 선언이 되있다! - 변경을 바로 확인하기 위해서!
        binding.mButton.setOnClickListener {
            liveText.value = "DataBinding으로 변경된 textview ${count++}"
//            binding.invalidateAll() //data가 변한 후 연결된 view들에게 변화를 알려주는 함수
        }
    }
}

- onCreate안에 binding을 정의

- binding의 LifeCycleOwner와 activity를 지정 , Button을 눌렀을때 liveText값이 변경되도록 onClickListener작성

 

 

결론. 

TextView에서 viewBinding을 통해 값을 변경하거나 그런 부분이 없습니다. 즉 kotlin파일에서 livedata에 접근하여 알아서 TextView의 Text값을 변경시켜주게 됩니다.