[Android] ViewModel

ViewModel

설명

• 안드로이드는 Activity 생명주기를 갖고 있고, 화면 회전과 같은 동작에서 Activity가 초기화 되면서 데이터도 함께 초기화되는 현상이 발생한다.
• 따라서 화면 회전과 같은 동작 발생시 그에 따른 데이터 유지를 개발자가 직접 코딩으로 해결해야 한다.
• 생명 주기 상관 없이 앱이 살아있는 동안 데이터를 유지시켜주는 것이 ViewModel

코드

build.gradle

dependencies {
    ...
    implementation "androidx.activity:activity-ktx:1.1.0" // by viewModels()로 ViewModel 생성을 위해 추가
}

MainActivityViewModel

class MainActivityViewModel : ViewModel() {
    val count = MutableLiveData<Int>()
    val text = MutableLiveData<String>()

    init {
        count.value = 1
        text.value = "Hello World"
    }

    fun increaseCount(value: Int) {
        count.value = count.value?.plus(value)
    }
}

MainActivity

class MainActivity : AppCompatActivity() {
    lateinit var binding: ActivityMainBinding
    private val model: MainActivityViewModel by viewModels()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        binding = ActivityMainBinding.inflate(layoutInflater).apply {
            setContentView(root)
            lifecycleOwner = this@MainActivity
            model = this@MainActivity.model
        }

        model.count.observe(this, Observer {
            Toast.makeText(this@MainActivity, "count : ${it}", Toast.LENGTH_SHORT).show()
        })
    }
}

res/layout/activity_main.xml

• @{data} : 데이터를 get만 하는 표현식
• @={data} : 데이터를 get, set 모두 하는 표현식

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">
    <data>
        <variable
            name="model"
            type="com.example.android_example.MainActivityViewModel" />
    </data>

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

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="@={model.text}" />

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

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="@{`count : ` + model.count}" />

        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:onClick="@{() -> model.increaseCount(1)}"
            android:text="increase" />
    </LinearLayout>
</layout>

참고

• https://youtu.be/-b0VNKw_niY
• https://developer.android.com/kotlin/ktx?hl=ko
• https://developer.android.com/topic/libraries/data-binding/two-way?hl=ko
• https://fornewid.medium.com/android-ktx-databinding%EC%9C%BC%EB%A1%9C-view-layer-%EC%BD%94%EB%93%9C-%EC%A4%84%EC%9D%B4%EA%B8%B0-%EF%B8%8F-690cd61aec3d
• https://apt-info.github.io/%EA%B0%9C%EB%B0%9C/android-mvvm-edittext/