iOS クイック スタート

はじめに

このクイック スタートでは、新しい iOS プロジェクトを作成する方法、Google Mobile Ads SDK を含める方法、最初のバナー リクエストを実行する方法を説明します。

前提条件

BannerExample をダウンロード

新しいプロジェクトを作成する

このステップでは、Xcode で新しいプロジェクトを作成します。Xcode をまだ起動していない場合は、ここで起動します。

新しい Xcode プロジェクトを作成する

[File]、[New]、[Project] の順に選択します。[iOS] の [Application] で [Single View Application] を選択して、[Next] をクリックします。

プロジェクトに名前を付ける

プロジェクトに「BannerExample」という名前を付けます。また、言語は必ず [Objective-C] を使用してください。次に [Next] をクリックします。

プロジェクトの場所を選択する

プロジェクトの場所を選択し、[Create] をクリックして、新しいプロジェクトの作成を完了します。

新しいプロジェクトをビルドして実行する

シミュレータを使用するには、[Product]、[Destination] の順に選択し、いずれかの iPhone シミュレータを選択します。次に [Product]、[Run] の順に選択して、アプリが立ち上がり、実行できることを確認します。この時点では、アプリに何もない白い画面が表示されます。以降のステップでコンテンツを追加していきます。

トップへ戻る

SDK を Xcode プロジェクトに追加する

Google Mobile Ads SDK を Xcode プロジェクトに追加するには、次の 2 つの方法があります。

CocoaPods を使用した効率的な方法

Podfile を作成する

BannerExample.xcodeproj ファイルと同じディレクトリに、次の内容を含んだ Podfile という名前のファイルを作成します。

source 'https://github.com/CocoaPods/Specs.git'

platform :ios, '7.0'
pod 'Google-Mobile-Ads-SDK', '~> 7.0'

pod install を実行する

ターミナルから Podfile と同じディレクトリで pod install を実行します。インストールが完了したら、BannerExample.xcodeproj を閉じて、BannerExample.xcworkspace を開きます。

プロジェクト ファイルには、Pods プロジェクトが含まれており、その中に Pods/Google-Mobile-Ads-SDK ディレクトリがあることを確認します。

プロジェクトを再ビルドする

プロジェクトを再ビルドして実行します。アプリは、白い画面が表示されるままですが、Google Mobile Ads SDK を参照するようになっています。続いて、最初のバナー リクエストを実行します。

トップへ戻る

SDK ダウンロードを使用した手動による方法

まだ Google Mobile Ads SDK を取得されていない場合は、ダウンロード ページからダウンロードしてファイルを展開します。

フレームワークを追加する

[BannerExample] プロジェクトを右クリックして、[Add Files To "BannerExample"] を選択します。

GoogleMobileAds.framework を追加します。

SDK で必要なその他のフレームワークを追加する

SDK は次の iOS 開発フレームワークに依存していますが、これらのフレームワークがプロジェクトにまだ含まれていない場合があります。

  • AdSupport
  • AudioToolbox
  • AVFoundation
  • CoreGraphics
  • CoreTelephony
  • EventKit
  • EventKitUI
  • MediaPlayer
  • MessageUI
  • StoreKit
  • SystemConfiguration

アプリのいずれかの場所で SDK を参照すると、これらのフレームワークに自動的にリンクされます。

@import GoogleMobileAds;

#import "ViewController.h"

@implementation ViewController

- (void)viewDidLoad {
  [super viewDidLoad];

  NSLog(@"Google Mobile Ads SDK version: %@", [GADRequest sdkVersion]);
}

- (void)didReceiveMemoryWarning {
  [super didReceiveMemoryWarning];
}

@end

参照を追加する最も簡単な方法は、ViewController.m を開いて、ライブラリをインポートし、SDK バージョンをログに記録することです。

プロジェクトを再ビルドする

プロジェクトを再ビルドして実行します。今回もアプリには白い画面が表示されますが、Xcode のコンソールには、使用している Google Mobile Ads SDK のバージョンを示すログが表示されます。

トップへ戻る

最初のバナー リクエスト

これで、プロジェクトが SDK を参照するようになりました。次に、プロジェクトにバナー広告を設置します。

GADBannerView は、ストーリーボードまたはコードから作成できます。レイアウトは通常、ストーリーボードで定義されるため、このクイック スタートではストーリーボードを使用する方法を説明します。

ストーリーボードに GADBannerView を追加する

Main.storyboard を開きます。右下隅の Object LibraryUIView を検索し、UIView 要素をビュー コントローラにドラッグします。次に、右上隅の Identity Inspector で、このビューのカスタムクラスを GADBannerView に指定します。

GADBannerView に制約を追加する

GADBannerView に制約を設定して、画面下部の中央に 320x50 のサイズで表示されるようにします。

ビューが選択されていることを確認し、画面下部の [Pin] アイコンをクリックします。バナー下部に値 0 で [Spacing to nearest neighbor] 制約を追加します。これでビューが画面下部に固定されます。

また、ビューのサイズを設定するために、幅と高さの制約のチェックボックスをオンにし、それぞれ 32050 に設定します。

次に、[Pin] アイコンの左にある [Align] アイコンをクリックして、[Horizontal Center in Container] チェックボックスをオンにし、値 0 を設定します。

制約を変更したら、[Pin] アイコンの右にある [Resolve Auto Layout Issues] アイコンを選択して、Update Frames を選択することで、ビューが表示される位置を確認できます。

これでバナーが適切な位置に表示されようになりました。

コードに GADBannerView への参照を追加する

GADBannerView が広告を読み込むには、コード内に参照が必要です。[View]、[Assistant Editor]、[Show Assistant Editor] の順に選択して、Assistant Editor を起動します。Assistant Editor に ViewController.h ファイルが表示されていることを確認します。次に、control キーを押したまま GADBannerView をクリックし、ViewController.h までカーソルをドラッグします。

Xcode によって、プロパティが生成され、接続が行われます。「bannerView」という名前を付けて、[Connect] を選択します。

#import <UIKit/UIKit.h>

@import GoogleMobileAds;

@interface ViewController : UIViewController

@property (weak, nonatomic) IBOutlet GADBannerView  *bannerView;

@end

コンパイル エラーを解決するため、ViewController.h には @import GoogleMobileAds も含めて、コンパイラが GADBannerView を有効なクラスとして解釈できるようにします。

GADBannerView に広告を読み込む

最後に必要となる変更は、ViewController.m に、広告をバナービューに読み込むコードを追加することです。

- (void)viewDidLoad {
  [super viewDidLoad];

  NSLog(@"Google Mobile Ads SDK version: %@", [GADRequest sdkVersion]);
  self.bannerView.adUnitID = @"ca-app-pub-3940256099942544/2934735716";
  self.bannerView.rootViewController = self;
  [self.bannerView loadRequest:[GADRequest request]];
}

次の 3 つの変更を加えます。

  1. viewDidLoad メソッドで、バナーに広告ユニット ID を設定します。アプリで使用するには、後ほど AdMob インターフェースから広告ユニット ID を作成する必要があります。ただし、ここでは、上に示したサンプル広告ユニット ID を使用しても構いません。

  2. ルート ビュー コントローラを GADBannerView を含むビュー コントローラに設定します。このビュー コントローラは、広告がクリックされた際に、オーバーレイを表示するために使用されます。

  3. GADBannerViewloadRequest: を、GADRequest オブジェクトを指定して呼び出します。

広告を表示する

アプリをビルドして実行します。今回は、画面下部にテストバナー広告が表示されます。

以上の手順で、最初の広告リクエストが正常に実行できました。

GitHub で設定済みサンプルを確認する

次のステップ

フルスクリーンのインタースティシャル広告の詳細については、インタースティシャル広告ガイドをご覧ください。

バナー設定をより詳細に調整するには、次のガイドをご覧ください。

よくある質問

CocoaPods を使用しています。SDK を更新するにはどうすればよいですか?
ターミナルから Podfile があるディレクトリで pod install を実行してください。
テスト広告を使用する必要はありますか?
開発時に実際の広告をクリックすると、ポリシーに違反することになります。開発中は、広告クリックの動作をテストする際に、テスト広告を使用することを強くおすすめします。
テスト広告を実際の端末で表示するにどうすればよいですか?
テスト端末 ID を取得する方法については、ターゲット設定ガイドをご覧ください。
AdMob 広告ユニット ID を取得するにはどうすればよいですか?
AdMob 広告ユニット ID を作成する方法については、こちらをご覧ください。AdMob 広告ユニット ID は ca-app-pub-XXXXXXXXXXXXXXXX/NNNNNNNNNN のような形式になります。
「Invalid unknown request error: Cannot determine request type. Is your ad unit id correct?」(無効かつ不明なリクエスト エラー: リクエストの種類を特定できません。広告ユニット ID に間違いはありませんか?)というエラー メッセージが表示されます。
広告ユニット ID に間違いがないことをご確認ください。広告ユニット ID は ca-app-pub-XXXXXXXXXXXXXXXX/NNNNNNNNNN の形式になります。pub-XXXXXXXXXXXXXXXX の形式を使用していると、このエラーが表示されます。

フィードバックを送信...