LoginSignup
5
8

More than 5 years have passed since last update.

DataBinding + LiveDataを使用したデータバインディング実装

Last updated at Posted at 2019-04-07

目的

ボタンをクリックすると1ずつカウントアップする単純なサンプルソースを作り、
DataBindingとLiveDataの使い方を知る。

DataBindingの使い方

(1)dataBinding要素をbuild.gradleファイルに追加する。

android {
    ....
    dataBinding {
        enabled = true
    }
}

(2)kotlin-kaptをbuild.gradleファイルに追加する。
※kaptの定義してないとコンパイルエラーになる。

apply plugin: 'kotlin-kapt'

(3)レイアウトファイルへdata要素を記述する。
layoutタグ -> data要素 -> Viewのroot要素と続く。
nameにはxml上で扱う変数名、typeにはバインド対象のオブジェクトを指定。

    <data>
        <variable name="viewModel" type="hamu.kai.com.databindingsample.MainViewModel"/>
    </data>

(4)ViewからMainViewModelオブジェクトのプロパティにアクセスするために、android:text=@{viewModel.text}のようにして、@{}で括る。

※公式抜粋

データ バインディングの観点では、この 2 つのクラスは同等です。TextView の android:text 属性に使われる @{user.firstName} 式は、先のクラス内で firstName フィールドに、後のクラス内で getFirstName() メソッドにアクセスすることになります。または、firstName() メソッドが存在すれば、そのメソッドに解決されます。

◾️全文

<?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="hamu.kai.com.databindingsample.MainViewModel"/>
    </data>

    <android.support.constraint.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:layout_marginBottom="8dp"
            android:text="@{viewModel.text}"
            android:textSize="18sp"
            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:layout_marginBottom="8dp"
            android:layout_marginEnd="8dp"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="8dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            android:text="Button"
            android:onClick="@{viewModel::onClick}"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/textView" />

    </android.support.constraint.ConstraintLayout>
</layout>

(5)データのバインディングを行う
デフォルトの場合、レイアウトファイル(ここではactivity_main.xml)の名前をパスカルケースへ変換したものの末尾にBindingをつけたものがバインディングクラスになる。

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val binding = DataBindingUtil.setContentView<ActivityMainBinding>(this, R.layout.activity_main).apply {
            setLifecycleOwner(this@MainActivity) // 重要。定義していないとLiveDataが正しく動作しない。
            viewModel = MainViewModel()
        }
    }
}

※公式抜粋

このクラスにはレイアウト プロパティ(viewModel 変数)からレイアウトのビューまでのすべてのバインディングが含まれ、バインディング式に値を適用する方法が指定されています。バインディングの作成はインフレート中に行うのが最も簡単です。

LiveDataの使い方

(1)LiveDataを利用するためのAAC(Android Architecture Component)を定義する。

implementation "android.arch.lifecycle:extensions:1.1.1"

(2)LiveDataとして扱いたいオブジェクトを定義する。

    var text = MutableLiveData<String>()

◾️全文

class MainViewModel: ViewModel() {

    var text = MutableLiveData<String>()
    private var count = 0

    fun onClick(view: View) {
        count++
        text.value = "count: $count"
    }
}

※公式抜粋

LiveDataオブジェクトを作成する LiveDataは、Listなどのコレクションを実装するオブジェクトを含む、あらゆるデータで使用できるラッパーです。 LiveDataオブジェクトは通常ViewModelオブジェクト内に格納され、次の例に示すようにgetterメソッドを介してアクセスされます。

参考リンク

5
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
8