2015年12月21日

Cocos2d-xでAndroidアプリを開発する環境を作る

今回、Androidアプリの開発に始めてチャレンジしてみたので、開発環境構築のメモ。すでにCocos2d-xでiOSアプリを開発済みの状態を前提としています。

Android Studioのインストール

まずはAndroid Studioのダウンロードとインストール。Android Studio と SDK Tools のダウンロード | Android Developers

インストールは適当にNext、Nextと選択。途中Install Typeを選択するところが出ますが、よくわからないので”Starndard”を選択。

スクリーンショット 2015-11-29 14.56.34.png

インストールが終わるとAndroid Studio Setup Wizardが起動するので、”Configure” -> “SDK Manager”を選択。

スクリーンショット 2015-11-29 15.09.08.png
スクリーンショット 2015-11-29 15.10.15.png

左側のツリーから”Android SDK”を選択して、上の方のタブで”SDK Tools”を選択。”Android NDK”にチェックを入れます。それから”OK”ボタンを選択。

スクリーンショット 2015-11-29 15.12.47.png

ダウンロードとインストールが行われるので終わるまで待ちます。

次にCocos2d-xのsetup.pyを実行して、Android SDKとAndroid NDKのインストールパスを環境変数に設定します。標準でインストールすると以下のパスになるっぽいです。

Android SDKのインストールパス: /Users/ユーザー名/Library/Android/sdk
Android NDKのインストールパス: /Users/ユーザー名/Library/Android/sdk/ndk-bundle

setup.pyを実行して
->Please enter the path of NDK_ROOT (or press Enter to skip):と表示されたらAndroid NDKのインストールパスを入力、
->Please enter the path of ANDROID_SDK_ROOT (or press Enter to skip):と表示されたらAndroid SDKのインストールパスを入力。
あとはそのままEnterで良いはずです。

cppファイルの追加

Android.mkファイルに作成したcppファイルを追加します。Googleで検索するとClasses下のcppファイルを全部検索してコンパイルするような書き方が見つかりますが、Cocos2d-Xが作るフォルダ構成でAndroid Studio用とEclipse用でちょっと違いがあるので、Android Studioのときは../が1個多くなるので注意です。

# cppファイルの自動検索設定
ifeq ($(HOST_OS),windows)
  CPP_FILES := $(shell dir $(LOCAL_PATH)/../../../Classes/*.cpp /b/a-d/s)
else
  CPP_FILES := $(shell find $(LOCAL_PATH)/../../../Classes -name *.cpp)
endif

LOCAL_SRC_FILES := hellocpp/main.cpp
LOCAL_SRC_FILES += $(CPP_FILES:$(LOCAL_PATH)/%=%)

# headerフォルダの自動検索設定
ifeq ($(HOST_OS),windows)
  LOCAL_C_INCLUDES := $(shell dir $(LOCAL_PATH)/../../../Classes /b/ad/s)
else
  LOCAL_C_INCLUDES := $(shell find $(LOCAL_PATH)/../../../Classes -type d)
endif

リソースの取扱い

Cocos2d-XではデフォルトでResource下を全部コピーするようになっているようです。たいてい、Resouce下に画像とかを置いているので問題ないのですが、Xcodeだとフォルダ構成を維持せずに登録していたりできるので、フォルダ構成を意識せずにプログラミングしたりしていたのですが、これだとAndroidだと正常に動きません。

ターゲットのOSで処理を分けても良いのですが、めんどくさいのでXcode側でフォルダ構成含めて登録して(ツリー上で青いフォルダになるやつ)、プログラム中でパスを指定するようにしました。

Android Studioでプロジェクトを開いてみる

Android Studio Setup Wizardの”Open an existing Android Studio project”を選択して、”proj.android-studio”フォルダを指定してやれば開くことができます。

実行環境の準備

Android Studioのメニューから”Tools” -> “Android” -> “AVD Manager”を選択して、Android Virtual Device Managerを起動。適当に仮想デバイスを作成します。Cocos2d-xを動かす場合にはCPUの種類がarm系でないといけないようです。

実機を持っている場合は設定から”タブレット情報”を選択して、”ビルド番号”の所を何回かタップすると開発用端末として設定されます。そうすると設定の項目に”開発者向けオプション”が追加されるので、その中の”USBデバッグ”を有効にします。

ビルドと実行

あとは次のコマンドでビルドと実行ができるはずです。

cocos run -s /Users/kaneda/Dropbox/src/toritoma -p android --android-studio
ラベル:android cocos2d
posted by かねだ at 00:02| Comment(0) | 開発方法メモ | このブログの読者になる | 更新情報をチェックする

2013年03月30日

AdMobメディエーションでiAd、AdMob、AppBankNetworkを切り替えて使う方法(後編)

前回の続きです。

今回はプログラミングの方法について書いていこうと思います。

AdMobメディエーションで複数サービスを切り替える場合も通常のAdMobのバナーを出す場合とほとんどやることは同じです。違うのは使用するパブリッシャーIDをアプリケーションのものではなく、メディエーションのものを使用するということ、カスタムイベントを受け取るためのクラスを用意することだけです。

というわけで、まずはAdMobのバナーを表示する処理を作っていきます。参考したのは公式のサイトです。

Google AdMob Ads iOS(初級)

UIViewControllerについて

GADBannerViewが広告バナーのクラスなので、これを作成してやれば広告表示ができることになります。上の公式サイトによるとUIViewControllerに追加するとあります。

ところで、私はcocos2dを使ったアプリしか作ったことがないので、実はUIViewControllerとか言われても何のことかわからなかったりします。この辺、基本的な知識なしで適当に試行錯誤して作っているのでもしかすると変なやり方しているかもしれません。

で、cocos2dでプロジェクトを新規作成するとUIViewControllerなんてものはないことに気付きます。代わりにAppDelegate.hを見てみるとUINavigationController *navController_というものがあります。これを拡張して機能を実装しようと思います。

まずはUINavigationControllerを継承したクラスを作成します。傾撃ではAKNavigationControllerというクラスを作成してみました。

AKNavigationController.h
AKNavigationController.m

ここでは定義に必要最低限のものを抜き出してみます。

// AKNavigationController.h

// GADBannerViewを使うためにインポートします
#import "GADBannerView.h"

// UINavigationControllerのカスタマイズ
@interface AKNavigationController : UINavigationController {
    
    /// 広告バナー
    GADBannerView *bannerView_;
}

/// 広告バナー
@property (nonatomic, retain)GADBannerView *bannerView;

バナーの生成と削除

バナーの生成はViewDidLoadで、バナーの削除はViewDidUnLoadで行います。ViewDidLoadはビューが表示されるとき、ViewDidUnLoadはメモリ不足時に呼ばれるそうです。ViewDidUnLoadはビューを閉じるときには呼ばれないそうなのでdeallocで呼んだ方が良さそうです。

// AKNavigationController.m

@synthesize bannerView = bannerView_;

- (void)viewDidLoad
{
    // スーパークラスの処理を実行する
    [super viewDidLoad];

    // 画面下部に標準サイズのビューを作成する
    self.bannerView = [[[GADBannerView alloc] initWithFrame:CGRectMake(0.0,
                                                                       self.view.bounds.size.height - GAD_SIZE_320x50.height,
                                                                       GAD_SIZE_320x50.width,
                                                                       GAD_SIZE_320x50.height)]
                       autorelease];
    
    // 広告の「ユニット ID」を指定する。これは AdMob パブリッシャー ID です。
    self.bannerView.adUnitID = kAKAdMobID;
    
    // デリゲートを設定する
    //self.bannerView.delegate = self;

    // ユーザーに広告を表示した場所に後で復元する UIViewController をランタイムに知らせて
    // ビュー階層に追加する。
    self.bannerView.rootViewController = self;
    [self.view addSubview:self.bannerView];
    
    // 広告リクエストを作成する
    GADRequest *request = [GADRequest request];
    
    // リクエストを行って広告を読み込む
    [self.bannerView loadRequest:request];
}

- (void)viewDidUnload
{
    // バナーを取り除く
    [self.bannerView removeFromSuperview];
    
    // デリゲートを削除する
    self.bannerView.delegate = nil;

    // バナーを削除する
    self.bannerView = nil;
    
    // スーパークラスの処理を実行する
    [super viewDidUnload];
}

NavigationController派生クラスの生成

上で作成したNavigationController派生クラスをAppDelegateで生成します。まずはAppControllerのメンバをUINavigationControllerからNavigationController派生クラスへ変更します。

// AppDelegate.h

// 自作NavigationContllerのインポート
#import "AKNavigationController.h"

// Application controller
@interface AppController : NSObject 
{
    /// Main window
    UIWindow *window_;
    /// Navigation controller
    AKNavigationController *navController_;  // ←UINavigationControllerから変更
    /// Director
    CCDirectorIOS *director_;    // weak ref
}

次にUINavigationControllerをallocしているところを変更します。

// AppDelegate.m

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    /* 略 */

    // Create a Navigation Controller with the Director
    // UINavigationControllerから変更
    navController_ = [[AKNavigationController alloc] initWithRootViewController:director_];
    navController_.navigationBarHidden = YES;

    /* 略 */
}

とりあえず、これで実行してみたらバナーが表示されるようになっていると思います。

デリゲートの設定

AdMobバナー関連のイベントを受け取るためにデリゲートを作成します。デリゲートはどのクラスでもいいのですが、バナーを操作することになるのでNavigationController派生クラスに実装するのが楽だと思います。

というわけでNavigationController派生クラスにデリゲートのプロトコルGADBannerViewDelegateを実装していきます。

// AKNavigationController.h

// デリゲートプロトコルのためにインポート
#import "GADBannerViewDelegate.h"

// UINavigationControllerのカスタマイズ
@interface AKNavigationController : UINavigationController {

// AKNavigationController.m

// リクエスト成功時処理
- (void)adViewDidReceiveAd:(GADBannerView *)bannerView
{
    // 画面内に広告を表示する
    bannerView.frame = CGRectMake(0.0,
                                  self.view.bounds.size.height - GAD_SIZE_320x50.height,
                                  bannerView.frame.size.width,
                                  bannerView.frame.size.height);
}

// リクエスト失敗時処理
- (void)adView:(GADBannerView *)bannerView didFailToReceiveAdWithError:(GADRequestError *)error
{
    // ビューの位置を画面外に設定する
    bannerView.frame = CGRectMake(0.0,
                                  -bannerView.frame.size.height,
                                  bannerView.frame.size.width,
                                  bannerView.frame.size.height);
}

// 広告フルスクリーン表示時処理
- (void)adViewWillPresentScreen:(GADBannerView *)bannerView
{
    // 広告フルスクリーン使わなければ処理は不要
}

// 広告フルスクリーン終了時処理
- (void)adViewDidDismissScreen:(GADBannerView *)bannerView
{
    // 広告フルスクリーン使わなければ処理は不要
}

// 広告表示によるバックグラウンド移行時処理
- (void)adViewWillLeaveApplication:(GADBannerView *)bannerView
{
    // [AppController applicationDidEnterBackground:]で処理すればいい
}

あとはviewDidLoadでGADBannerView.delegateに設定してやれば動くようになります。

AppBankNetworkのバナークラス作成

最後にAdMobのカスタムイベントの追加で指定したクラス名のクラスを作成すれば完了です。処理の内容はざっくりとまとめると次のような感じです。

  • AdMobからの広告バナー表示メッセージを受信する
  • AppBankNetworkのバナーを作成する
  • 広告生成をAdMobに通知する

めんどくさくなってきたので、一気にまとめて書きます。

// AKAppBankNetworkBanner.h

#import 
#import "GADCustomEventBanner.h"
#import "NADView.h"

// AppBankNetworkの広告バナー
@interface AKAppBankNetworkBanner : NSObject  {
    /// デリゲート
    id delegate_;
    /// 広告バナー
    NADView *nadView_;
}

/// デリゲート
@property (nonatomic, assign)id delegate;
/// 広告バナー
@property (nonatomic, retain)NADView *nadView;

@end

AppBankNetworkの広告バナーのクラスはNADViewなので、これをメンバに持つようにしてやります。GADBannerViewのときと同じように広告バナーからのイベントを受信できるようにNADViewDelegateプロトコルに対応させます。

AdMobからのメッセージを受信できるようにGADCustomEventBannerプロトコルに対応します。広告生成完了の通知はGADCustomEventBannerDelegateを通してAdMobに通知します。このデリゲートはAdMobの方で設定するようになっているみたいです。

// AKAppBankNetworkBanner.m

// インスタンス解放処理
- (void)dealloc
{
    // メンバを解放する
    self.nadView.delegate = nil;
    self.delegate = nil;
    self.nadView = nil;
    
    // スーパークラスの処理を実行する
    [super dealloc];
}

// 広告バナー表示要求
- (void)requestBannerAd:(GADAdSize)adSize
              parameter:(NSString *)serverParameter
                  label:(NSString *)serverLabel
                request:(GADCustomEventRequest *)request
{
    // 広告バナーを生成する
    self.nadView = [[[NADView alloc] initWithFrame:CGRectMake(0, 0, adSize.size.width, adSize.size.height)] autorelease];
    
    // apiKeyとspotIDを設定する(nendのサイトで確認したもの)
    [self.nadView setNendID:kAPIKey spotID:kSpotID];
    
    // デリゲートを設定する
    self.nadView.delegate = self;
    
    // RootViewControllerを設定する
    self.nadView.rootViewController = [[[UIViewController alloc] init] autorelease];
    
    // 広告を読み込む
    [self.nadView load];
}

// ロード完了処理
- (void)nadViewDidFinishLoad:(NADView *)adView
{
    // AdMobのデリゲートに広告読み込み完了を通知する
    [self.delegate customEventBanner:self didReceiveAd:adView];
}

AdMobがrequestBannerAdを呼び出すので、この中でAppBankNetworkのバナーを作成する。バナーの作成が完了するとAppBankNetworkがnadViewDidFinishLoadを呼び出すのでself.delegateのメソッドを呼んで読み込み完了を通知する。このデリゲートはAdMobで設定しているものなのでこれでAdMobにイベントが伝わるということになります。
posted by かねだ at 23:21| Comment(0) | 開発方法メモ | このブログの読者になる | 更新情報をチェックする

2013年03月24日

AdMobメディエーションでiAd、AdMob、AppBankNetworkを切り替えて使う方法(前編)

cocos2dで広告を表示する方法についてメモ書きです。忘れ防止のメモ書きなのであんまり説明はないです。

ちなみに私は以下のサイトの内容を参考に設定してみました。こっち見たほうが早いかもしれません。スクリーンショットもあるし。

iPhoneアプリにAdMobMediationを使ってadmobとiadを切り替える方法
iPhoneアプリにAdMobMediationを使ってAppBankNetworkを実装する方法

長くなりそうなので前後編の2回に分けて書こうと思います。前半は各サービスの設定とライブラリの設定、後半はプログラムの書き方にしようと思います。

以下、前提条件です。
  • 使用するサービスはiAd、AdMob、AppBankNetwork
  • AdMobメディエーションを使用して広告の切り替えを行う
  • iTunes Connectへのアプリの登録と各サービスのアカウント作成までは終わっているとする
iAdの設定
  1. iTunes Connectのサイトを開く
  2. [Manage Your Applications]のリンクを開く
  3. [Set Up iAd Network]ボタンを選択する
  4. [Enable iAd Network]ボタンを選択する
  5. [Save]ボタンを選択する
AppBankNetworkの設定
  1. nendのサイトを開く
  2. メニューの[広告枠の管理]-[サイト/アプリ(AppBankNetwork)]を選択する
  3. [新規サイト/アプリの作成]ボタンを選択する
  4. 新規サイト/アプリの作成のページで以下の設定を行う
    • [サイト/アプリのタイプ]で[iPhoneアプリ]を選択する
    • [アプリ名]を入力する
    • [App Store URL]を入力する
    • [カテゴリ]を選択する
    • [アプリの紹介]を入力する
    • [広告枠の作成へ]ボタンを選択する
  5. 広告枠の作成のページで以下の設定を行う
    • [サイト/アプリ]で作成したアプリを選択する
    • [広告枠名]欄に「ヘッダー」と入力する
    • [広告枠の形式]に[インライン]、[ヘッダー]を選択する
    • [広告枠の紹介]欄には[アプリの紹介]が入力されているのでそのまま
    • [18禁広告]は[ブロック]を選択する
    • [広告枠のサイズ]は[320 x 50]を選択する
    • [SDKの取得へ]ボタンを選択する
    • [apiKey]と[spotID]の値をメモしておく
    • [SDKをダウンロード]ボタンを選択してSDKをダウンロードする
AdMobの設定
  1. AdMobのサイトを開く
  2. メニューの[サイト及びアプリケーション]-[サイト/アプリケーションの追加]を選択する
  3. [iPhoneアプリケーション]ボタンを選択する
  4. 詳細の欄を記入する(この辺はアプリによって変わってくると思うので適宜書き換えてください)
    • [App名]の欄を記入する
    • [App Store URL]の欄を記入する
    • [ジャンル]の欄を記入する
    • [Appの説明]の欄を記入する
    • [Google広告]では「Google広告とGoogle認定の広告ネットワークの広告を利用して広告掲載率を高めます。Google AdSense 利用規約を読み、同意します。」を選択する
    • [テーマ]はデフォルトのまま「黒」とする
    • [このAppはユーザーの位置情報を活用します。]は選択しない
    • [2つの単語を入力します]の欄に単語を入れる
  5. [AdMob iOS SDKをダウンロード]ボタンを選択してSDKをダウンロードする
  6. [サイト/アプリケーションに移動]ボタンを選択する
  7. 下の方のサイトの一覧のところの[メディエーション]の列の[設定]ボタンを選択する
  8. プレースメントの詳細を記入する
    • [名前]欄はそのまま
    • [プラットフォーム]欄は「iOS」が選択されているのでそのまま
    • [広告サイズ]欄は「バナー - 320x50 (通常)」を選択する
    • [自動更新]欄は「更新間隔:60秒」が選択されているのでそのまま
    • [保存して次へ]ボタンを選択する
  9. [広告ネットワーク]で[iAd]を選択する
  10. [AdMob Network]の[Publisher ID]で割り当てられたパブリッシャーIDを選択する
  11. [保存]ボタンを選択する
  12. [続行]ボタンを選択する
  13. [カスタムイベントを追加]ボタンを選択する
  14. カスタムイベントの設定を行う
    • [Label]欄は管理画面に表示するための名前なので任意
    • [Class Name]欄はプログラム中で使用するクラスに付ける名前を入力する
    • [保存]ボタンを選択する
  15. [サードパーティの SDK とアダプタをダウンロード]リンクを選択する
  16. [Mediation Networks]リンクを選択する
  17. [iAd]の行の[Adapter]の列の[Download]リンクを選択し、アダプタをダウンロードする
  18. [メディエーションID]をメモしておく
  19. [割り当て]欄を[$]から[%]に変更する
  20. [割合]に日本以外の国での割合を設定する(AppBankNetworkは日本語Onlyなので0%としておく)
  21. [保存]ボタンを選択する
  22. [国レベルの設定を追加]ボタンを選択する
  23. [Japan]を選択する
  24. [続行]ボタンを選択する
  25. [割合]に日本での割合を設定する
  26. [保存]ボタンを選択する
Xcodeの設定
  1. libディレクトリの下に「AdMob」ディレクトリを作成し、GoogleAdMobAdsSdkiOS-x.x.xの中のAdd-ons以外とAdd-ons/Mediationをコピーする。
  2. LibAdapterIAd-xxxxxの中のlibAdapterIAd.aをAdMobディレクトリにコピーする。
  3. NendSDK_iOSx.x.xの中のNendAdディレクトリをlibディレクトリにコピーする。
  4. XCodeのProject Navigatorでlibグループの下にAdMobグループ、Mediationグループ、NendAdグループを作成し、右側のUtilitiesのビューでPathの設定を行う。
  5. libディレクトリにコピーしたファイルをXCodeにドラッグアンドドロップする。Add to targetsの欄はチェックありにしておく。
  6. XCodeのProject Navigatorでプロジェクト(ルート)を選択して、[TARGETS]-[Build Phases]-[Link Binary With Libraries]で以下のフレームワークを追加する。(※ここではcocos2dを使用していることを前提としているのでこれだけですが、そうでない場合は他にも必要なものがあると思います。)
    • Security.framework
    • MessageUI.framework
    • SystemConfiguration.framework
    • StoreKit.framework
    • AdSupport.framework
    • iAd.framework

ただの箇条書きですが結構な長さになったので今日はこの辺で。 後編に続きます。
ラベル:AdMob
posted by かねだ at 23:11| Comment(0) | 開発方法メモ | このブログの読者になる | 更新情報をチェックする

広告


この広告は60日以上更新がないブログに表示がされております。

以下のいずれかの方法で非表示にすることが可能です。

・記事の投稿、編集をおこなう
・マイブログの【設定】 > 【広告設定】 より、「60日間更新が無い場合」 の 「広告を表示しない」にチェックを入れて保存する。


×

この広告は1年以上新しい記事の投稿がないブログに表示されております。