Live Data + View Model + Data Binding 설명

안녕하세요. 훈츠 입니다. 금일은 Live Data 와 View Modle 그리고 데이터 바이딩 실습에 대해 포스팅 합니다. 

---

실습 순서

1. Dependency 추가 
2. Model class, ViewModel (LiveData object) 만들기 
3. .XML DataBinding Setting 
4. DataBindingUtil 이용 해서 setContentView 하기 
5. ViewModel 인스턴스 만들고 Data Binding object 에 assign 후 Data Binding object 에 라이프싸이클 set 하기  

---

1. Dependency 추가 

현재 최신 버전 이며, 추후는 안드로이드 AndroidX 에 배포 노트를 확인 하시면 됩니다. 

1 2 3 4 5 6 7 8

apply plugin: 'kotlin-kapt' dependencies {     ...     def lifecycle_version = "2.2.0"     implementation "androidx.lifecycle:lifecycle-viewmodel-ktx:$lifecycle_version"     implementation "androidx.lifecycle:lifecycle-livedata-ktx:$lifecycle_version" }   Colored by Color Scripter

cs

 

---

2. Model class, ViewModel (LiveData object) 만들기 

• TrigModel 생성

class Trigger (var count : Int = 0) //초기값 '0' 세팅

• MainViewModel 생성 (LiveData object)

1 2 3 4 5 6 7 8 9 10

class MainViewModel :ViewModel() {       val liveData = MutableLiveData<Trigger>() //MutableLiveData<Trigger> 생성      val trigger = Trigger()        fun trigger() {         trigger.count++         liveData.value =trigger     } } Colored by Color Scripter

cs

 

---

3. XML DataBinding Setting 

• 바인딩 할 xml 파일을 <layout> <data> <variable> 태그로 감싸기 
• <variable name = "viewModel" 
  • type ="org.MainViewModle"/>

※ layout은 예시 입니다.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43

<?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="viewModel"             type="com.example.livedatatest.MainViewModel" />     </data>   <androidx.constraintlayout.widget.ConstraintLayout     android:layout_width="match_parent"     android:layout_height="match_parent"     tools:context=".MainActivity">       <TextView         android:id="@+id/textView"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:text='@{"Count value:" + viewModel.liveData.count }'         app:layout_constraintBottom_toBottomOf="parent"         app:layout_constraintLeft_toLeftOf="parent"         app:layout_constraintRight_toRightOf="parent"         app:layout_constraintTop_toTopOf="parent"         />       <Button         android:id="@+id/button"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:text="Button"         android:onClick="@{() -> viewModel.trigger()}"         app:layout_constraintBottom_toBottomOf="parent"         app:layout_constraintEnd_toEndOf="parent"         app:layout_constraintHorizontal_bias="0.5"         app:layout_constraintStart_toStartOf="parent"         app:layout_constraintTop_toBottomOf="@+id/textView"         app:layout_constraintVertical_bias="0.1" />   </androidx.constraintlayout.widget.ConstraintLayout>   </layout> Colored by Color Scripter

cs

 

https://rain2002kr.tistory.com/206

UI 관련 Tips and Trick

---

4. DataBindingUtil 이용 해서 setContentView 하기 

• 바인딩할 액티비티 혹은 프래그먼트에서 작업 
  • DataBindingUtil.setContentView(this, R.layout.activity.main)

1 2 3 4 5 6 7 8 9 10

class MainActivity : AppCompatActivity() {     private lateinit var dataBinding : ActivityMainBinding           override fun onCreate(savedInstanceState: Bundle?) {         super.onCreate(savedInstanceState)         setContentView(R.layout.activity_main)         dataBinding = DataBindingUtil.setContentView(this, R.layout.activity_main)     } }   Colored by Color Scripter

cs

 

---

5. ViewModel 인스턴스 만들고 Data Binding object 에 assign 후 Data Binding object 에 라이프싸이클 set 하기  

 

• MainViewModel 인스턴스 만들기
• ViewModelProvider.AndroidViewModelFactory application 인스턴스 전달
• dataBinding object 에 라이프 싸이클 set 하기 

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

class MainActivity : AppCompatActivity() {     private lateinit var dataBinding : ActivityMainBinding     private lateinit var viewModel: MainViewModel     private lateinit var viewModelFactory : ViewModelProvider.AndroidViewModelFactory       override fun onCreate(savedInstanceState: Bundle?) {         super.onCreate(savedInstanceState)         setContentView(R.layout.activity_main)           dataBinding = DataBindingUtil.setContentView(this, R.layout.activity_main)           // Get the ViewModel         viewModelFactory = ViewModelProvider.AndroidViewModelFactory.getInstance(application)         viewModel = ViewModelProvider(this, viewModelFactory).get(MainViewModel::class.java)           // DataBinding with MainView model         dataBinding.viewModel = viewModel         // 라이프 사이클 오너 등록         dataBinding.setLifecycleOwner (this)       } } Colored by Color Scripter

cs

 

 

---

Live Data 실습 Code

https://github.com/rain2002kr/LiveDataTest.git

rain2002kr/LiveDataTest