2016-08-19 (Fri)
BeaconDroid SDK(Android版Beacondo)のOnyx Beacon CMS組み込み手順の説明をします。管理ネイティブアプリツール - Beacondoを利用して、Onyx Beacon CMSのミドルウェアをiBeaconアプリに組み込んでビーコン端末にスマホが近接すると適切なクーポンが配信される仕組みです。Android環境のBeaconDroid v2.0をバージョンアップしましたのでお知らせいたします。
1.サンプルアプリ概要
1-1.Buildした開発環境:
・OS X El Capitan バージョン10.11.6
・Android Studio 2.1.2
・jdk1.8.0_102
・BeacondoDroid-b5
・OnyxBeacon.Android.SDK.2.3.1
||||
ダウンロード先
1-2.機能概要
・通知バーの「JapanTourismタップすると、クーポンを表示します。」をタップすると、クーポン一覧画面を表示します。
・クーポン一覧画面からクーポン名をタップすると、クーポン詳細(画像)画面を表示します。
・クーポン詳細(画像)画面をタップすると、クーポンに指定されたURLを表示します。
・クーポン一覧画面から「削除」ボタンをタップすると、クーポンを削除します。
2.OnyxBeacon SDKインテグレーション画面にパッケージ名登録
2-1.https://connect.onyxbeacon.com/admin/にログイン後、画面右上のログインIDをクリックし、ガイドを選択します。
図①

2-2.SDKインテグレーションをクリックします。
図②

2-3.インテグレーション画面からアプリケーション名とAndroid Studioプロジェクトに設定するパッケージ名を入力します。
図③

Android Studio
図④

3.Onyx Beacon SDKライブラリをAndroid Studioプロジェクトに追加
3-1.OnyxBeaconLibrary-release.aarをBeacondoのAndroid Studioプロジェクト内BeacondoApp/app/libsフォルダにコピーします。
図⑤

4.ソースファイル(設定ファイル及びjavaファイル)修正
OnxyBeaconSDKを使用するための設定、および初期処理、ビーコンからクーポン受信時の処理等をBeacondoのプロジェクトファイルに追加しています。追加部分については「OnyxBeacon SDK対応」のコメントを記載しています。追加内容についてはOnxyBeaconSDKに付属のSampleアプリからの流用ですので、Sampleアプリのプロジェクトも参考にしてください。
図⑥

4-1.AndroidManifest.xml
Beacondoの設定ファイルにOnyxBeaconSDKを使用するための設定を追加しています。
以下の部分については https://connect.onyxbeacon.com/admin/ からアプリIdとパスワードを取得して、設定してください。
android:name="clientid"
android:value="bff4028061729fb1d50fe39fed76f229221aaa04" />
android:name="secret"
android:value="77a069ab1f033e43d2b56f73575c57d94e7d98a9" />
4-2.build.gradle
Beacondoの設定ファイルにOnyxBeaconSDKを使用するための設定を追加しています。
4-3.RootActivity.java
BeacondoのソースファイルにOnyxBeaconSDKを使用するための初期処理を追加しています。
4-4.ContentReceiver.java
クーポンを受信するためのクラスです。
4-6.CouponListActivity.java
クーポン一覧を表示するためのクラスです。
4-5.CouponAdaper.java
クーポン一覧の一行を表示するためのクラスです。
4-7.activity_coupon_list.xml
クーポン一覧を表示するための画面レイアウトです。
4-8.item_coupon.xml
クーポン一覧の一行を表示するための画面レイアウトです。
5.Androidプロジェクトについて
Android Studio を使用してBeacondoのプロジェクトを開くと、以下のダイアログが表示される場合があります。その時は「Don’t remind me again for this project」または「Remind me later」をクリックしてください。
図⑦


1.サンプルアプリ概要
1-1.Buildした開発環境:
・OS X El Capitan バージョン10.11.6
・Android Studio 2.1.2
・jdk1.8.0_102
・BeacondoDroid-b5
・OnyxBeacon.Android.SDK.2.3.1
||||
ダウンロード先
http://www.ibeacondo.com/download/
1-2.機能概要
・通知バーの「JapanTourismタップすると、クーポンを表示します。」をタップすると、クーポン一覧画面を表示します。
・クーポン一覧画面からクーポン名をタップすると、クーポン詳細(画像)画面を表示します。
・クーポン詳細(画像)画面をタップすると、クーポンに指定されたURLを表示します。
・クーポン一覧画面から「削除」ボタンをタップすると、クーポンを削除します。
2.OnyxBeacon SDKインテグレーション画面にパッケージ名登録
2-1.https://connect.onyxbeacon.com/admin/にログイン後、画面右上のログインIDをクリックし、ガイドを選択します。
図①

2-2.SDKインテグレーションをクリックします。
図②

2-3.インテグレーション画面からアプリケーション名とAndroid Studioプロジェクトに設定するパッケージ名を入力します。
図③

Android Studio
図④

3.Onyx Beacon SDKライブラリをAndroid Studioプロジェクトに追加
3-1.OnyxBeaconLibrary-release.aarをBeacondoのAndroid Studioプロジェクト内BeacondoApp/app/libsフォルダにコピーします。
図⑤

4.ソースファイル(設定ファイル及びjavaファイル)修正
OnxyBeaconSDKを使用するための設定、および初期処理、ビーコンからクーポン受信時の処理等をBeacondoのプロジェクトファイルに追加しています。追加部分については「OnyxBeacon SDK対応」のコメントを記載しています。追加内容についてはOnxyBeaconSDKに付属のSampleアプリからの流用ですので、Sampleアプリのプロジェクトも参考にしてください。
図⑥

4-1.AndroidManifest.xml
Beacondoの設定ファイルにOnyxBeaconSDKを使用するための設定を追加しています。
以下の部分については https://connect.onyxbeacon.com/admin/ からアプリIdとパスワードを取得して、設定してください。
android:value="bff4028061729fb1d50fe39fed76f229221aaa04" />
android:value="77a069ab1f033e43d2b56f73575c57d94e7d98a9" />
4-2.build.gradle
Beacondoの設定ファイルにOnyxBeaconSDKを使用するための設定を追加しています。
4-3.RootActivity.java
BeacondoのソースファイルにOnyxBeaconSDKを使用するための初期処理を追加しています。
4-4.ContentReceiver.java
クーポンを受信するためのクラスです。
4-6.CouponListActivity.java
クーポン一覧を表示するためのクラスです。
4-5.CouponAdaper.java
クーポン一覧の一行を表示するためのクラスです。
4-7.activity_coupon_list.xml
クーポン一覧を表示するための画面レイアウトです。
4-8.item_coupon.xml
クーポン一覧の一行を表示するための画面レイアウトです。
5.Androidプロジェクトについて
Android Studio を使用してBeacondoのプロジェクトを開くと、以下のダイアログが表示される場合があります。その時は「Don’t remind me again for this project」または「Remind me later」をクリックしてください。
図⑦


- 関連記事
-
-
iOS版BeacondoアプリをOnyx Beacon CMSに組み込む手順 2016/08/25
-
BeaconDroid SDK【Android版Beacondo】のOnyx Beacon CMS組み込み手順 2016/08/19
-
Beacondo Android SDKでiBeacon観光アプリをつくる! 2015/05/27
-
Beacondoデザイナー v2.1日本語最終ベータのリリース 2015/05/21
-
iBeaconで教育用アプリデモ【Beacondoでコンテンツ制作】 2015/02/05
-
「Beacondoのしくみ」 2015/01/30
-
ネイティブアプリ制作ツール "Beacondo"のチラシを作りました! 2014/10/22
-
開運!なんでも鑑定団に鑑定士としてTV出演! 2014/10/17
-
iOSネイティブアプリを簡単に制作できる"Beacondo"短期集中セミナーの様子 2014/09/08
-
スポンサーサイト