▼ 記事内のソースコードへ移動
@BindingAdapter でカスタムセッター
Syain クラスへ直接セットして表示
Google Gson と tools.jar を使用した REST API 経由の読み込み
Firebase API を使用した読込み
プロジェクトの Gradle に classpath "com.android.databinding:dataBinder:1.0-rc1" は必要ありません
Module(app) の Gradle に
dataBinding {
enabled = true
}
があれば動作します
去年より地味に進化していました。build.gradle(Module: app) の簡単な設定で利用可能になります
build.gradle(Module: app)
apply plugin: 'com.android.application'
android {
compileSdkVersion 22
buildToolsVersion "23.0.3"
dataBinding {
enabled = true
}
defaultConfig {
applicationId "lightbox.june.bindingbasic"
minSdkVersion 19
targetSdkVersion 22
versionCode 1
versionName "1.0"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
testCompile 'junit:junit:4.12'
compile 'com.android.support:appcompat-v7:22.2.1'
}
バインド用のクラスには、後々 Google Gson 使うので 超単純にしています。
※ @BindingAdapter はテキストを直接使えないコントロール用のカスタムセッターです
Syain.java
@{user.birthday} が app:dateText にセットされるよう画面で定義されているので、birthday が setDateText の引数として渡されます。
public class Syain {
public String code;
public String name;
public String birthday;
@BindingAdapter("dateText")
public static void setDateText(DatePicker datePicker, String text) {
if ( text != null && !text.equals("")) {
Log.i("lightbox",text);
int year = Integer.parseInt(text.substring(0, 4));
int month = Integer.parseInt(text.substring(5, 7)) - 1;
int day = Integer.parseInt(text.substring(8, 10));
datePicker.updateDate(year, month, day);
}
}
}
画面も、layout 要素の記述がスリムになりました。
<?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>
<variable name="user" type="lightbox.june.bindingbasic.Syain"/>
</data>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/textView"
android:textSize="40dp"
android:text="@{user.code}"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/textView2"
android:layout_marginTop="20dp"
android:textSize="40dp"
android:text="@{user.name}"/>
<DatePicker
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/datePicker"
android:layout_below="@+id/textView2"
android:datePickerMode="spinner"
android:calendarViewShown="false"
app:dateText="@{user.birthday}"/>
</LinearLayout>
</layout>
さて、MainActivity ですが、Android の公式ページがいまだに誤記しているのがタマに傷です。R.layout.main_activity では無く、R.layout.activity_main です。当たり前ですけれど。コピペするとえらい目にあいます。
MainActivity.java
最も単純なバインドのサンプルです。Syain クラスはコンストラクタも無く、JSON のプロパティは、public の同名の変数にセットされます。コメント部分は、JSON 文字列から Syain のインスタンスを作成して使用するパターンです( Google Gson は コンストラクタを使用しません )
package lightbox.june.bindingbasic;
import android.databinding.DataBindingUtil;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import lightbox.june.bindingbasic.databinding.ActivityMainBinding;
public class MainActivity extends AppCompatActivity {
private ActivityMainBinding binding;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding = DataBindingUtil.setContentView(MainActivity.this,R.layout.activity_main);
// String json = "{\"code\": \"0001\",\"name\": \"やまだ たろう\",\"birthday\": \"1959/10/10\"}";
// Gson gson = new Gson();
// Syain user = gson.fromJson(json,Syain.class);
Syain user = new Syain();
user.code = "0001";
user.name = "やまだ たろう";
user.birthday = "1959/10/10";
binding.setUser(user);
}
}
これで動くはずですが、良く解らないエラーが出る場合は以下の二つを試すといいはずです。画面に関しては以前からある問題点で、さらに動くまでは画面定義に日本語は直接書かないほうがいいと思います。
エラー時の対処 : パターン1
1) 画面定義の data 要素部分を削除してすぐ戻す
2) エラーが出るソースを開くと DataBindingUtil 部分のエラーがなくなる
3) binding.メソッドのエラーが残るので、プロジェクトをいったん閉じて開く
エラー時の対処 : パターン2
1) 画面定義の activity_main.xml を activity_main2.xml に変更して すぐに activity_main に戻す
2) ファイルメニューの Invalidate Caches / Restart を実行
Data Binding Android - Type parameter T has incompatible upper bounds : ViewDataBinding and MainActivity
DataBindingUtil.setContentView - Type parameter T has incompatible upper bounds
Google Gson と tools.jar を使用した読み込み
※ URL は、Firebase のログインの必要無いデータを使用しています
public class MainActivity extends AppCompatActivity {
private ActivityMainBinding binding;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Data Binding 仕様の画面表示
binding = DataBindingUtil.setContentView(MainActivity.this,R.layout.activity_main);
// アクセスする URL
String url = "https://freebase-44e8b.firebaseio.com/class/0001.json?print=pretty";
// URL から読み込み
Tools.callHttpGet(url, "utf-8", new Tools.OnAsyncTaskListener() {
@Override
public void onAsyncTaskListener(String s) {
Log.i("lightbox", s);
Gson gson = new Gson();
// JSON 文字列を Syain クラスのインスタンスに変換
Syain user = gson.fromJson(s,Syain.class);
// Data Binding で画面にデータをセット
binding.setUser(user);
}
});
}
}
Firebase Database REST API のドキュメント
Google Gson のダウンロード
tools.jar のダウンロード
Firebase API を使用した読込み
public class MainActivity extends AppCompatActivity {
private ActivityMainBinding binding;
private FirebaseDatabase database;
private DatabaseReference mDatabase;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Data Binding 仕様の画面表示
binding = DataBindingUtil.setContentView(MainActivity.this,R.layout.activity_main);
// Firebase database 参照用
database = FirebaseDatabase.getInstance();
mDatabase = database.getReference();
// データの参照
mDatabase.child("class/0001").addListenerForSingleValueEvent(new ValueEventListener() {
@Override
public void onDataChange(DataSnapshot dataSnapshot) {
// 取得したデータを Syain クラスのインスタンスとして取得
Syain user = dataSnapshot.getValue(Syain.class);
// Data Binding で画面にデータをセット
binding.setUser(user);
}
@Override
public void onCancelled(DatabaseError databaseError) {
// Firebase database の参照に失敗した時の処理
// ※ 参照権限がない場合等
}
});
}
}
Firebase API + Android Studio : Database のデータを Java に取得する方法は３通りあります。
Firebase API + Android Studio : Database 処理の基本設定
HTTP で直接通信すると手っ取り早いですが、いかんせん汎用性に欠けます。WebView を使うと途中のデバッグそのものが、他の開発に転用できそうなのでいいと思います。とにかく、いろいろ手順が満載です。 1) Android で入力した値を引数としてページに渡す これは一番簡単です。javascript:以降に関数名を記述して、引数を文字列として埋め込んで loadUrl するだけです。
JAVASCRIPT からデータを取得
(Android 側 : 行28〜行56)
JAVASCRIPT からデータを取得ボタンをクリックした結果です。取得するのは、一番下にある文字列で、WebView 内の テキストフィールドです。これは最も単純で、evaluateJavascript を使用して jQuery の文字列を直接渡してフィールドの結果を取得し、イベントで Android 内に戻って来ます。この文字列は ダブルクォート で挟まれているので、元の表示とダブルクォートを取り去った表示を同時に行っています。
JAVASCRIPT へデータを送る
単純に考えてしまうと、JavaScript の引数に文字列を指定すればいいですが、とても煩雑で問題が出そうです。ですから、データを用意した後、いったん『getAndroidUIData』を "request-02" のリクエストで呼び出して、『getAndroidUIData』 内から Android を呼び出す(getRequestData) 事によって、必要な文字列を JavaScript のメソッドの戻り値で取得するようにしています。
Android 側
仕様の概略
※ エキスパートモードで表示しています
アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります
