Android ViewModelとDataBindingを使ってみた

はじめに

学習記録
開発業務でも使用しているViewModelとDataBindingを触ってみる

導入

・ViewModelを使用するため、以下設定

build.gradle

implementation 'androidx.lifecycle:lifecycle-extensions:2.2.0'

・DataBindingを使用するため、以下設定

build.gradle

// android{・・・}内
    buildFeatures {
        dataBinding = true
    }

続いて、各ファイルの編集・作成
・ViewModel

MainViewModel.kt

package com.example.sampleapp

import androidx.lifecycle.ViewModel

class MainViewModel : ViewModel() {
// 画面に表示するデータ
    var text = "This is Sample Message"
}

・レイアウト

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">
    <data>
// MainViewModelクラスを変数viewModelとして定義
        <variable
            name="viewModel"
            type="com.example.sampleapp.MainViewModel" />
    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView
            android:id="@+id/message"
// MainViewModelの変数textの値を設定
            android:text="@{viewModel.text}"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <Button
            android:id="@+id/main_button"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Button"
            app:layout_constraintTop_toBottomOf="@+id/message"/>
    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

・Activity

MainActivity.kt

package com.example.sampleapp

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.databinding.DataBindingUtil
import androidx.lifecycle.ViewModelProvider
import com.example.sampleapp.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        // ViewModel, DataBindingの設定
        val binding: ActivityMainBinding = DataBindingUtil.setContentView(this, R.layout.activity_main)
        val viewModel: MainViewModel = ViewModelProvider(this).get(MainViewModel::class.java)

        binding.viewModel = viewModel
        binding.message.text = viewModel.text

        binding.mainButton.setOnClickListener {
            viewModel.text = "Button clicked"
            binding.message.text = viewModel.text
        }


    }
}

動作確認

おわりに

これまで関わったMVVMアーキテクチャを使用しているプロジェクトではこのViewModelかなり使ってます。
データ管理、役割の分担、Activityの肥大化を防ぐ等、目的やメリット・デメリットをもっと深く理解して開発できるようになりたいです。