Titanium(Alloy)でAdMobとnendを使って広告を表示するまでの日記

  • Pocket
  • このエントリーをはてなブックマークに追加
  • 164 follow us in feedly

 

まえがき

 

こんな感じのアプリ内の広告を出すためにやったことのメモをしたいと思います。

 

Screeny Shot 2013 07 30 21 06 39

 

開発環境

・Titanium SDK 3.1.0

・Alloy 1.1.2

・AdMobモジュール 1.5.0

・nendモジュール 1.0.1

・ビルド対象はとりあえずiOS

今回はAlloyフレームワークでやっていますが普通のTitaniumでも問題ないと思います。

 

お世話になるサービス

・AdMob

admob

admob

 

・nend

nend

nend

 

AdMobに関して

・Googleアカウントでサクッと登録。

・アプリをリリースしていなくても利用できる。

・appcelerator製のモジュールをすぐに利用可能。

・報酬受取のためにPayPalアカウントを作っておくことを推奨。

 

nend

・最初の利用登録の際に審査がある(私の場合は翌日結果到着)

・広告の審査がある。(現在審査中なので後に追記予定)

・Titanium用モジュールを問い合わせて送ってもらう必要がある。(10分で到着)

・Titaniumモジュールに日本語マニュアルが付いてきてきてちょっと幸せ。

・テスト用の広告コードがマニュアルに乗っているので動作確認がすぐに可能。

・モジュール自体はAdMobのものと似たような感じ。

 

モジュールの取得

※ ここから先は上記のサービスに登録し、広告の登録を済ませたらとゆうことで・・

・Admob

Admob

Admob

 

ti.admob-iphone-1.5.0.zip

これをダウンロードする。

 

※nendに関しては直接お問い合わせしましょう。

 

モジュールの配置

上記にてダウンロードしたzipフォルダを展開してこんな感じにプロジェクトにほりこみます。

AdMob

Screeny Shot 2013 07 30 21 24 39

 

nend

Screeny Shot 2013 07 30 21 24 55

 

tiapp.xmlの変更

モジュールのところをこんな感じで。

	<modules>
		<module device="iphone" version="1.5.0">ti.admob</module>
		<module device="iphone" version="1.0.1">net.nend</module>
	</modules>

 

とりあえずビルドを走らせよう

1度エラーははかれてもめげずにビルドしましょう。

buildフォルダの削除や。

プロジェクトのクリーンなどやってみましょう。

CLIだとこんな感じ

 > titanium clean

 

広告を表示するためのjsファイルを作成

・createAdView.js

/**
	広告描画用のメソッド

	モジュールをプロジェクトに追加している必要がある。
	各種識別コードに関しては(config/ads.js)に記載している
*/

Titanium.Admob = require('ti.admob');
Titanium.Nend  = require('net.nend');

function createAdView(){

	var rand = Math.floor(Math.random()*2);
	switch(rand){

		case 0:
			var adview = Titanium.Admob.createView({
				width:  320,
				height: 50,
				bottom: 0,
				adBackgroundColor:'black',
				publisherId: ADMOB_PUBID
			});
			break;

		case 1:
			var adview = Titanium.Nend.createView({
				spotId: NEND_SPOTID,
				apiKey: NEND_APIKEY,
				width:  '320dp',
				height: 50,
				bottom: 0,
				left:   0
			});
			break;

		default:
			var adview = null;
			break;

	}

	return adview;

}

自分の場合はこんな感じに

 

admobとnendをランダムで表示するだけです。

各種コードは別途ファイルで定義しています。

・ADMOB_PUBID

・NEND_SPOTID

・NEND_APIKEY

がそれ。

 

広告を表示する

$.win1.add(createAdView());

createAdView.jsを読み込んでいる状態ならこんな感じで広告を表示することができます。

 

 

関連記事

Screeny Shot 2013-07-28 21.51.06.png

Titanium(Alloy)でナビゲーションバーの色を変えてみるとちょっと幸せ

まえがき 今回はAlloyでのやってみました。   デフォルトではこん...

記事を読む

no image

Titanium CLI × Alloy × CoffeeScript × Jade で作るiPhoneアプリのお話

まえがき slideshareにて初のスライドを投下してみたのでご報告...

記事を読む

images-2

Titanium CLI × Alloyで開発するときのコマンドのメモ

まえがき 最近はTitaniumアプリの開発もTitanium St...

記事を読む

Screeny Shot 2013-07-29 3.08.50.png

TitaniumMobileでSafariで開くを実装する

  まえがき TitaniumMobileでiOSやAndroidのデ...

記事を読む

Screeny-Shot-2013-08-11-21.40.56.pngScreeny-Shot-2013-08-11-21.40.56.png

AlloyでFacebookアプリっぽいスライドメニューを実装してみる

まえがき AlloyでFacebookとかでよく使われている左からビュ...

記事を読む

新着記事

no image

PHPでRubyのirbっぽいインタラクティブなスクリプトが実行できる「boris」

まえがき PHPでもRubyのirbみたいなことがしたくて探してみたと...

記事を読む

2015年の抱負と去年の振り返り〜よちよちWEB業界1年経験して〜

まえがき あけましておめでとうございます。今年もどうぞよろしくお願いし...

記事を読む

Java SE 7 Bronze試験(1Z0-802)を受けてきました

まえがき 以前から少し受けてみたかった試験『Java SE 7 Bro...

記事を読む

HubotでJenkinsのジョブを実行する

まえがき HubotをつかってJenkinsのジョブをじっこうしてみた...

記事を読む

no image

Hubotをforeverでデーモン化する

まえがき 今回はHubotをforeverを使ってデーモン化してみた時...

記事を読む

  • shinriyo

    ti.admob

    はあってますか?

    ti.admob

    では?

    • keitarou

      ご指摘ありがとうございます。
      ti.admob

      で自分は動いていますよ。
      ios用のモジュールになっているのでデバイスを指定している方が
      よさそうです、

      • shinriyo

        すみません。moduleをmodelと書き間違えていたためでした(^_^;)。ありがとうございます。

        • shinriyo

          Attribue ‘device’ is not allowed to appear in element ‘module’
          のエラーが出ました。
          deviseをplatformにしたら直りました。Tiraniumのバージョンかもしれません。

スポンサーリンク

PAGE TOP ↑