2016-08-25 (Thu)
iOS版Beacondo SDKとXcodeでビルドしたネイティブアプリにOnyx Beacon SDKを組み込み、ビーコン端末に近接した際、アプリにクーポンをプッシュ通知する手順の内容です。
第1章 サンプルアプリの概要
1-1 ビルド開発環境
・Xcode Version 7.2
※クーポン一覧画面とクーポン詳細(画像)画面はMaster-Detail Application
テンプレートを使用しています。
・Beacondo-sdk-v.2
・OnyxBeacon.iOS.SDK.2.1.8.2
1-2機能の概要
・トップ画面下のクーポンボタンをタップすると、クーポン一覧画面を表示します。
・クーポン一覧画面からクーポン名をタップすると、クーポン詳細(画像)画面を表示します。
・クーポン詳細(画像)画面をタップまたは右から左へスワイプするとWEBブラウザを起動し、クーポンに指定されたURLを表示します。
・クーポン画像画面(画像)を左から右へスワイプするとクーポン一覧画面を表示します。
第2章 Onyx Beacon SDKインテグレーション
2-1 Onyx Beacon SDKインテグレーション画面にバンドルID登録
https://connect.onyxbeacon.com/admin/にログイン後、画面右上のログインIDをクリックし、
ガイドを選択します。
図-01

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

2-3バンドルIDの入力
インテグレーション画面からアプリケーション名とXcodeプロジェクトに設定するバンドルIDを入力します。
図-03

*XCode画面
図-04

第3章 OnyxBeacon SDKとXCode
3-1 OnyxBeacon SDKライブラリをXCodeプロジェクトに追加
OnyxBeaconLib.frameworkをXcodeプロジェクトにドラッグ&ドロップします。
図-05

3-2 Xcodeの設定
設定を確認し、 [Finish]ボタンをクリックします。
図-06

第4章 CoreBluetoothと CoreLocation
4-1 CoreBluetoothと CoreLocation ライブラリをXCodeプロジェクトに追加
[+]ボタンをクリックし、CoreBluetooth.frameworkとCoreLocation.frameworkを追加します。
図-07

第5章 AFNetworkingとAFOAuth2Client
5-1 AFNetworkingとAFOAuth2ClientソースフォルダーをXcodeプロジェクトに追加
AFNetworkingフォルダをXcodeプロジェクトにドラッグ&ドロップします。
図-08

5-2 XCodeの設定
設定を確認し、 [Finish]ボタンをクリックします。
図-09

5-3 AFOAuth2Clientフォルダ
AFOAuth2ClientフォルダをXcodeプロジェクトにドラッグ&ドロップし、AFNetworking
フォルダと同様に追加します。
図-10

第6章 ソースファイル修正
Onxy Beacon SDKを使用する時にポイントとなる初期処理、受信済みのクーポンの取得、
ビーコンからクーポンを受信した時の処理、クーポンの削除について記載しています。Xcode
プロジェクトのソースにもコメントを記載していますので参考にしてください。
クーポン一覧画面とクーポン詳細(画像)画面はMaster-Detail Applicationテンプレートを使用して
います。
6-1 AppDelegate.h
@interface AppDelegate : UIResponder
↓ 変更
@interface AppDelegate : UIResponder
6-2 AppDelegate.m
#define SA_CLIENTID @"51090e1ce50215f09aeeaa2fce3c73a5ad397788"
#define SA_SECRET @"f8b606225e25da9e12dc6b549b73e0cfd05acc25"
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
・
・
・
[[OnyxBeacon sharedInstance] requestAlwaysAuthorization];
[[OnyxBeacon sharedInstance] startServiceWithClientID:SA_CLIENTID secret:SA_SECRET];
[[OnyxBeacon sharedInstance] setDelegate:self];
[[OnyxBeacon sharedInstance] setContentDelegate:self];
・
・
・
}
// 受信済みクーポン取得
- (void)loadContent {
// 受信済みクーポン取得
self.coupons = [[OnyxBeacon sharedInstance] getContent];
// 受信済みクーポンから詳細情報を表示していない件数をカウント
int i = 0;
for (OBContent *content in self.coupons) {
if (content.contentState == ContentStateUnread) {
i++;
}
}
// 受信済みクーポンから詳細情報を表示していない件数をバッチ表示
if(SYSTEM_VERSION_LESS_THAN(@"8.0")) {
[UIApplication sharedApplication].applicationIconBadgeNumber = i;
} else {
UIUserNotificationSettings *settings =
[[UIApplication sharedApplication] currentUserNotificationSettings];
if (settings.types & UIUserNotificationTypeBadge) {
[UIApplication sharedApplication].applicationIconBadgeNumber = i;
}
}
}
// ビーコンからクーポンを受信した時にコールされるメソッド
- (void)didReceiveContent:(NSArray *)coupons {
// 通知表示
for (OBContent *coupon in coupons) {
UILocalNotification *notification = [[UILocalNotification alloc] init];
notification.alertBody = coupon.message;
notification.userInfo = @{@"uuid": coupon.uuid};
notification.soundName = UILocalNotificationDefaultSoundName;
[[UIApplication sharedApplication] presentLocalNotificationNow:notification];
}
// 受信済みクーポン取得
[self loadContent];
// 効果音を鳴らす
AudioServicesPlaySystemSound(1000);
// アラート表示
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:nil message:@"クーポンを受け取りました。" delegate:self cancelButtonTitle:nil otherButtonTitles:@"OK", nil];
[alert show];
}
6-3 MasterViewController.m
- (void)tableView:(UITableView *)tableView commitEditingStyle:
(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
// 一覧から削除されたクーポンを削除
if (editingStyle == UITableViewCellEditingStyleDelete) {
int i = 0;
for (OBContent *content in self.coupons) {
if (i == indexPath.row) {
[[OnyxBeacon sharedInstance]deleteContent:content];
break;
}
i++;
}
self.coupons = [[OnyxBeacon sharedInstance] getContent];
[self.tableView deleteRowsAtIndexPaths:@[indexPath] withRowAnimation:
UITableViewRowAnimationFade];
if ([self.coupons count] == 0) {
[[NSNotificationCenter defaultCenter] postNotification:
[NSNotification notificationWithName:@"dismissCouponList" object:self]];
}
}
}
以上です。

第1章 サンプルアプリの概要
1-1 ビルド開発環境
・Xcode Version 7.2
※クーポン一覧画面とクーポン詳細(画像)画面はMaster-Detail Application
テンプレートを使用しています。
・Beacondo-sdk-v.2
・OnyxBeacon.iOS.SDK.2.1.8.2
1-2機能の概要
・トップ画面下のクーポンボタンをタップすると、クーポン一覧画面を表示します。
・クーポン一覧画面からクーポン名をタップすると、クーポン詳細(画像)画面を表示します。
・クーポン詳細(画像)画面をタップまたは右から左へスワイプするとWEBブラウザを起動し、クーポンに指定されたURLを表示します。
・クーポン画像画面(画像)を左から右へスワイプするとクーポン一覧画面を表示します。
第2章 Onyx Beacon SDKインテグレーション
2-1 Onyx Beacon SDKインテグレーション画面にバンドルID登録
https://connect.onyxbeacon.com/admin/にログイン後、画面右上のログインIDをクリックし、
ガイドを選択します。
図-01

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

2-3バンドルIDの入力
インテグレーション画面からアプリケーション名とXcodeプロジェクトに設定するバンドルIDを入力します。
図-03

*XCode画面
図-04

第3章 OnyxBeacon SDKとXCode
3-1 OnyxBeacon SDKライブラリをXCodeプロジェクトに追加
OnyxBeaconLib.frameworkをXcodeプロジェクトにドラッグ&ドロップします。
図-05

3-2 Xcodeの設定
設定を確認し、 [Finish]ボタンをクリックします。
図-06

第4章 CoreBluetoothと CoreLocation
4-1 CoreBluetoothと CoreLocation ライブラリをXCodeプロジェクトに追加
[+]ボタンをクリックし、CoreBluetooth.frameworkとCoreLocation.frameworkを追加します。
図-07

第5章 AFNetworkingとAFOAuth2Client
5-1 AFNetworkingとAFOAuth2ClientソースフォルダーをXcodeプロジェクトに追加
AFNetworkingフォルダをXcodeプロジェクトにドラッグ&ドロップします。
図-08

5-2 XCodeの設定
設定を確認し、 [Finish]ボタンをクリックします。
図-09

5-3 AFOAuth2Clientフォルダ
AFOAuth2ClientフォルダをXcodeプロジェクトにドラッグ&ドロップし、AFNetworking
フォルダと同様に追加します。
図-10

第6章 ソースファイル修正
Onxy Beacon SDKを使用する時にポイントとなる初期処理、受信済みのクーポンの取得、
ビーコンからクーポンを受信した時の処理、クーポンの削除について記載しています。Xcode
プロジェクトのソースにもコメントを記載していますので参考にしてください。
クーポン一覧画面とクーポン詳細(画像)画面はMaster-Detail Applicationテンプレートを使用して
います。
6-1 AppDelegate.h
@interface AppDelegate : UIResponder
↓ 変更
@interface AppDelegate : UIResponder
6-2 AppDelegate.m
#define SA_CLIENTID @"51090e1ce50215f09aeeaa2fce3c73a5ad397788"
#define SA_SECRET @"f8b606225e25da9e12dc6b549b73e0cfd05acc25"
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
・
・
・
[[OnyxBeacon sharedInstance] requestAlwaysAuthorization];
[[OnyxBeacon sharedInstance] startServiceWithClientID:SA_CLIENTID secret:SA_SECRET];
[[OnyxBeacon sharedInstance] setDelegate:self];
[[OnyxBeacon sharedInstance] setContentDelegate:self];
・
・
・
}
// 受信済みクーポン取得
- (void)loadContent {
// 受信済みクーポン取得
self.coupons = [[OnyxBeacon sharedInstance] getContent];
// 受信済みクーポンから詳細情報を表示していない件数をカウント
int i = 0;
for (OBContent *content in self.coupons) {
if (content.contentState == ContentStateUnread) {
i++;
}
}
// 受信済みクーポンから詳細情報を表示していない件数をバッチ表示
if(SYSTEM_VERSION_LESS_THAN(@"8.0")) {
[UIApplication sharedApplication].applicationIconBadgeNumber = i;
} else {
UIUserNotificationSettings *settings =
[[UIApplication sharedApplication] currentUserNotificationSettings];
if (settings.types & UIUserNotificationTypeBadge) {
[UIApplication sharedApplication].applicationIconBadgeNumber = i;
}
}
}
// ビーコンからクーポンを受信した時にコールされるメソッド
- (void)didReceiveContent:(NSArray *)coupons {
// 通知表示
for (OBContent *coupon in coupons) {
UILocalNotification *notification = [[UILocalNotification alloc] init];
notification.alertBody = coupon.message;
notification.userInfo = @{@"uuid": coupon.uuid};
notification.soundName = UILocalNotificationDefaultSoundName;
[[UIApplication sharedApplication] presentLocalNotificationNow:notification];
}
// 受信済みクーポン取得
[self loadContent];
// 効果音を鳴らす
AudioServicesPlaySystemSound(1000);
// アラート表示
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:nil message:@"クーポンを受け取りました。" delegate:self cancelButtonTitle:nil otherButtonTitles:@"OK", nil];
[alert show];
}
6-3 MasterViewController.m
- (void)tableView:(UITableView *)tableView commitEditingStyle:
(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
// 一覧から削除されたクーポンを削除
if (editingStyle == UITableViewCellEditingStyleDelete) {
int i = 0;
for (OBContent *content in self.coupons) {
if (i == indexPath.row) {
[[OnyxBeacon sharedInstance]deleteContent:content];
break;
}
i++;
}
self.coupons = [[OnyxBeacon sharedInstance] getContent];
[self.tableView deleteRowsAtIndexPaths:@[indexPath] withRowAnimation:
UITableViewRowAnimationFade];
if ([self.coupons count] == 0) {
[[NSNotificationCenter defaultCenter] postNotification:
[NSNotification notificationWithName:@"dismissCouponList" object:self]];
}
}
}
以上です。

- 関連記事
-
-
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
-
スポンサーサイト