Android

KotlinでAndroidの双方向DataBindingを利用する

投稿日:2017年7月19日 更新日:

はじめに

今回は、AndroidのDataBindingをKotlinで実装する方法について、記事を書きたいと思います。AndroidのDataBindingについての概要はAndroid Developerサイトなどを参照いただければと思いますが、MVVMのアーキテクチャでAndroidを実装する場合は、非常に威力を発揮し、開発が捗ること間違いなしです。

最初は、色々と戸惑いがあるかもしれませんが、一度DataBaindingを利用するともうDataBindingなしでは開発はできなくなるでしょう!

 

MVVMアーキテクチャ

まずは、簡単にMVVMアーキテクチャについて、説明しておきます。

MVVMは、Model-View-ViewModelの略になります。Wikipediaからの引用させていただくと各層で下記のような役割となっています。

Model

アプリケーションのドメイン(問題領域)を担う、そのアプリケーションが扱う領域のデータと手続きを表現する要素である。

View

アプリケーションの扱うデータをユーザーが見るのに適した形で表示し、ユーザーからの入力を受け取る要素である。ViewModelに含まれたデータをデータバインディング機構のようなものを通じて自動的に描画するだけで自身の役割を果たす。ActivityやFragmentがこの部分に該当します。

ViewModel

Viewを描画するための状態の保持と、Viewから受け取った入力を適切な形に変換してModelに伝達する役目を持つ。Viewとの通信はデータバインディング機構のような仕組みを通じて行うため、ViewModelの変更は開発者から見て自動的にViewに反映される。

これから紹介するAndroid DataBindingとは、上記にあるデータバインディング機構の一つとなります。

 

KotlinでAndroid DataBindingを設定

まずは、DataBindingの設定の前に、Android StudioでKotlinで実装できるようにしましょう。こちらの記事に設定方法がありますので、ご参照ください。

次にDataBindingの設定についてです。設定として、「app/build.gradle」に3箇所だけ追記して、「Sync Now」をするだけです。※追記箇所は下記にコメントで記載しています。

説明用のサンプルアプリについて

DataBindingを説明するにあたり、1つのEditTextと1つのTextViewだけのアプリを作ります。EditTextに文字を入力するとTextViewにEditTextの文字数がカウントされるだけのアプリです。

実装対象のファイルはたったの3つです。とてもシンプルですが、DataBindingの概要を掴むには問題ないと思います。

  • activity_main.xml(View)
  • MainActivity.kt(View)
  • MainViewModel.kt(ViewModel)

activity_main.xmlの実装

いきなりですが、コードです。ポイントは大きく3つあり、それぞれについて説明します。

従来のlayout xmlをlayoutタグで囲む

これはそいうものだと思って、layoutタグで囲んでください。後述しますが、こうすることで、AcitivityやFragmentなどから変数を使って、layoutにアクセスできるようになります。

dataタグ内のvariableタグにViewModelのクラスを指定する

type属性にViewModelのクラスを、name属性にxml内でアクセスする際に使う変数名を指定してください。後述しますが、ActivityやFragmentから実際にインスタンスを紐付けします。

タグ属性にViewModelのプロパティを設定する

ViewModelでのプロパティに変更があった場合に、Viewにもその変更を反映したい場合は、下記のように指定してください。(一方向)

今回の場合は、EditTextに入力された文字数をViewModelから通知してもらう必要があるので、下記の部分で設定されています。

ユーザからの入力をViewからViewModelへ通知したい場合は、双方向にする必要があり、下記のように指定します。一方向との違いは、=があるかないかです。EditTextにユーザが入力した値をViewModelに通知するために双方向である必要があります。

 

MainActivity.ktの実装

コードです。ポイントは大きく2つあり、それぞれについて説明します。

DataBindingインスタンスの取得

Activityとlayout xmlの関連付けには従来は、コメントアウトされているようにsetContentViewメソッドを利用していました。DataBindingでは、setContentViewメソッドではなく、DataBindingUtilを利用します。

前述の通りlayoutタグを親とするlayout xmlを記述するとActivityMainBindingクラスというxmlファイル名に沿った名前のクラスが自動生成されますので、下記のようにインスタンスを取得します。(生成されない場合は、一度[Build]-[Rebuild Project]を実行してください)

ViewModelインスタンスの設定

DataBindingのインスタンスが取得できたら、下記のようにViewModelのインスタンスを設定して、関連付けをしてください。

 

MainViewModel.kt

コードです。ポイントは大きく2つあり、それぞれについて説明します。

 

Viewに変更を通知する

@get:Bindableを指定したプロパティは、xlayout xmlの属性に指定することで、Viewに反映させることができます。今回の場合は、messageLengthがそれにあたり、前述のTextViewに指定されているものになります。

また、下記で説明しますが、messageLengthに変更があったことを通知することで、Viewにも即座に反映させることができます。

Viewからの変更の通知を受けて、さらにViewにも変更を通知する

@Bindableを指定したプロパティは、Viewからの変更の通知を受け取ることもできます。(双方向)今回の場合は、messageEditTextプロパティになり、前述のEditTextに指定されているものになります。

ユーザがEditTextに文字を入力すると、messageEditTextプロパティのsetterが呼ばれます。そのsetterないで、messageLengthにも変更があったことを通知することで、ViewのTextViewにも変更内容(messageEditText.length)が反映されます。

 

さいごに

いかがでしたでしょうか。かなり単純な内容ではありますが、DataBindingの利便性が少しは理解できたのではないでしょうか。DataBindingはここで紹介したもの以外にも多くのことができますので、さらに詳しく知りたい方はAndroid Developerサイトで一読してみると良いと思います。

また、DataBindingを組み込むとコンパイルエラー時にどこで、なぜエラーとなっているのかがわかりにくい場合があります。その際は、こちらの記事でエラー内容の出力設定をしてみてください。

ぜひ、Kotlin + DataBindingで快適なAndroid開発ライフをお過ごしください。

age_footer_300rect




age_footer_300rect




-Android
-, ,

執筆者:


comment

メールアドレスが公開されることはありません。

関連記事

Kotlinをはじめよう〜コレクションなど〜

1 はじめに2 配列3 レンジ4 コレクション(リスト)5 コレクション(セット)6 コレクション(マップ)7 コレクションまとめ8 さいごに はじめに 前回のKotlin基本文法編に続きまして、今回 …

Android Studioでエラーログを詳細表示する

1 はじめに2 初期設定でのビルドエラーメッセージ3 詳細なビルドエラーメッセージを出力4 おまけ5 さいごに はじめに こんにちは。Android開発を久しぶりにやっているのですが、Data Bin …

Kotlinをはじめよう〜Kotlin基本文法〜

1 はじめに2 事前準備3 基本データ型4 変数5 条件分岐 if式6 条件分岐 when式7 繰り返し制御 while文8 繰り返し制御 for文9 さいごに はじめに こんにちは、今回は改めてKo …

Android JavaでS3への画像アップロード

1 はじめに2 AWS上での事前準備3 Android StudioのGradleでAWS SDKをインストール4 ManifestにPermissionの追加5 カメラで写真を撮影し、保存先のPat …

はじめてのKotlinとAndroid StudioのKotlinプラグイン

1 はじめに2 Kotlinとは?3 Android Studio 2.3でのKotlinプラグイン導入3.1 Kotlinプラグインのインストール3.2 JavaコードをKotlinコードに変換3. …

page_side_300rect




bitFlyer

bitFlyer ビットコインを始めるなら安心・安全な取引所で

アプリ情報

私たちは、目標を達成したい方を応援する、TODOアプリもリリースしております。
下記のアイコンから無料でダウンロードできます。

リンク



follow us in feedly

2017年7月
« 6月   8月 »
 1
2345678
9101112131415
16171819202122
23242526272829
3031