Bannerwerbung nimmt einen Platz innerhalb des App-Layouts ein, entweder oben oder unten auf dem Gerätebildschirm. Sie bleiben auf dem Bildschirm, während Benutzer mit der App interagieren, und können nach einer bestimmten Zeit automatisch aktualisiert werden. Wenn Sie neu in der mobilen Werbung sind, sind sie ein großartiger Ausgangspunkt.Fallstudie .
Diese Anleitung zeigt Ihnen, wie Sie Werbebanner vonAdMob in eine iOS-App integrieren. Neben Code-Snippets und Anleitungen enthält es Informationen zur richtigen Größe von Bannern und Links zu weiteren Ressourcen.
Voraussetzungen
- Importieren Sie das Google Mobile Ads SDK entweder allein oder als Teil von Firebase .
Testen Sie immer mit Testanzeigen
Stellen Sie beim Erstellen und Testen Ihrer Apps sicher, dass Sie Testanzeigen anstelle von Live-Produktionsanzeigen verwenden. Andernfalls kann Ihr Konto gesperrt werden.
Am einfachsten laden Sie Testanzeigen, indem Sie unsere dedizierte Testanzeigenblock-ID für iOS-Banner verwenden:ca-app-pub-3940256099942544/2934735716
Es wurde speziell so konfiguriert, dass es für jede Anfrage Testanzeigen zurückgibt, und Sie können es beim Codieren, Testen und Debuggen in Ihren eigenen Apps verwenden. Stellen Sie nur sicher, dass Sie es durch Ihre eigene Anzeigenblock-ID ersetzen, bevor Sie Ihre App veröffentlichen.
Weitere Informationen zur Funktionsweise der Testanzeigen des Mobile Ads SDK finden Sie unter Testanzeigen .
Erstellen Sie einen GADBannerView
Bannerwerbung wird in GADBannerView
Objekten angezeigt, sodass der erste Schritt zur Integration von Bannerwerbung darin besteht, einen GADBannerView
in Ihre Ansichtshierarchie aufzunehmen. Dies erfolgt normalerweise entweder mit dem Interface Builder oder programmgesteuert.
Interface-Builder
Ein GADBannerView
kann wie jede typische Ansicht zu einem Storyboard oder einer xib-Datei hinzugefügt werden. Stellen Sie bei Verwendung dieser Methode sicher, dass Breiten- und Höhenbeschränkungen hinzugefügt werden, damit sie der Anzeigengröße entsprechen, die Sie anzeigen möchten. Wenn Sie beispielsweise ein Banner (320 x 50) anzeigen, verwenden Sie eine Breitenbeschränkung von 320 Punkten und eine Höhenbeschränkung von 50 Punkten.
Programmatisch
Ein GADBannerView
kann auch direkt instanziiert werden. Hier ist ein Beispiel für die Erstellung eines GADBannerView
, ausgerichtet an der unteren Mitte des sicheren Bereichs des Bildschirms, mit einer Bannergröße von 320 x 50:
Schnell
import GoogleMobileAds import UIKit class ViewController: UIViewController { var bannerView: GADBannerView! override func viewDidLoad() { super.viewDidLoad() // In this case, we instantiate the banner with desired ad size. bannerView = GADBannerView(adSize: GADAdSizeBanner) addBannerViewToView(bannerView) } func addBannerViewToView(_ bannerView: GADBannerView) { bannerView.translatesAutoresizingMaskIntoConstraints = false view.addSubview(bannerView) view.addConstraints( [NSLayoutConstraint(item: bannerView, attribute: .bottom, relatedBy: .equal, toItem: bottomLayoutGuide, attribute: .top, multiplier: 1, constant: 0), NSLayoutConstraint(item: bannerView, attribute: .centerX, relatedBy: .equal, toItem: view, attribute: .centerX, multiplier: 1, constant: 0) ]) } }
Ziel c
@import GoogleMobileAds; @interface ViewController () @property(nonatomic, strong) GADBannerView *bannerView; @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; // In this case, we instantiate the banner with desired ad size. self.bannerView = [[GADBannerView alloc] initWithAdSize:GADAdSizeBanner]; [self addBannerViewToView:self.bannerView]; } - (void)addBannerViewToView:(UIView *)bannerView { bannerView.translatesAutoresizingMaskIntoConstraints = NO; [self.view addSubview:bannerView]; [self.view addConstraints:@[ [NSLayoutConstraint constraintWithItem:bannerView attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self.bottomLayoutGuide attribute:NSLayoutAttributeTop multiplier:1 constant:0], [NSLayoutConstraint constraintWithItem:bannerView attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:1 constant:0] ]]; } @end
Beachten Sie, dass wir in diesem Fall keine Breiten- oder Höhenbeschränkungen angeben, da die bereitgestellte Anzeigengröße dem Banner eine intrinsische Inhaltsgröße gibt, um die Ansicht zu vergrößern.
Wenn Sie keine durch eine Konstante definierte Standardgröße verwenden möchten, können Sie mithilfe von GADAdSizeFromCGSize
eine benutzerdefinierte Größe festlegen. Weitere Informationen finden Sie im Abschnitt Bannergröße.
Konfigurieren GADBannerView Eigenschaften
Um Anzeigen zu laden und anzuzeigen, müssen für GADBannerView
einige Eigenschaften festgelegt werden.
-
rootViewController
– Dieser Ansichtscontroller wird verwendet, um ein Overlay anzuzeigen, wenn auf die Anzeige geklickt wird. Er sollte normalerweise auf den View-Controller gesetzt werden, der denGADBannerView
enthält. -
adUnitID
– Dies ist die Anzeigenblock-ID, aus der derGADBannerView
Anzeigen laden soll.
Hier ist ein Codebeispiel, das zeigt, wie die beiden erforderlichen Eigenschaften in der viewDidLoad
Methode eines UIViewController festgelegt werden:
Schnell
override func viewDidLoad() { super.viewDidLoad() ... bannerView.adUnitID = "ca-app-pub-3940256099942544/2934735716" bannerView.rootViewController = self }
Ziel c
- (void)viewDidLoad { [super viewDidLoad]; ... self.bannerView.adUnitID = @"ca-app-pub-3940256099942544/2934735716"; self.bannerView.rootViewController = self; }
Laden Sie eine Anzeige
Sobald der GADBannerView
und seine Eigenschaften konfiguriert sind, ist es an der Zeit, eine Anzeige zu laden. Dies geschieht durch Aufrufen von loadRequest:
für ein GADRequest
Objekt:
Schnell
override func viewDidLoad() { super.viewDidLoad() ... bannerView.adUnitID = "ca-app-pub-3940256099942544/2934735716" bannerView.rootViewController = self bannerView.load(GADRequest()) }
Ziel c
- (void)viewDidLoad { [super viewDidLoad]; ... self.bannerView.adUnitID = @"ca-app-pub-3940256099942544/2934735716"; self.bannerView.rootViewController = self; [self.bannerView loadRequest:[GADRequest request]]; }
GADRequest Objekte stellen eine einzelne Anzeigenanfrage dar und enthalten Eigenschaften für Dinge wie Targeting-Informationen.
Anzeigenereignisse
Durch die Verwendung von GADBannerViewDelegate
können Sie auf Lebenszyklusereignisse lauschen, z. B. wenn eine Anzeige geschlossen wird oder der Benutzer die App verlässt.
Registrierung für Banner-Events
Um sich für Banneranzeigenereignisse zu registrieren, legen Sie die Eigenschaft „ delegate
“ auf GADBannerView
auf ein Objekt fest, das das GAD- GADBannerViewDelegate
Protokoll implementiert. Im Allgemeinen fungiert die Klasse, die Bannerwerbung implementiert, auch als Delegate-Klasse. In diesem Fall kann die delegate
-Eigenschaft auf self
gesetzt werden.
Schnell
import GoogleMobileAds import UIKit class ViewController: UIViewController, GADBannerViewDelegate { var bannerView: GADBannerView! override func viewDidLoad() { super.viewDidLoad() ... bannerView.delegate = self } }
Ziel c
@import GoogleMobileAds; @interface ViewController () <GADBannerViewDelegate> @property(nonatomic, strong) GADBannerView *bannerView; @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; ... self.bannerView.delegate = self; }
Banner-Events implementieren
Jede der Methoden in GADBannerViewDelegate
ist als optional gekennzeichnet, sodass Sie nur die gewünschten Methoden implementieren müssen. Dieses Beispiel implementiert jede Methode und protokolliert eine Nachricht an die Konsole:
Schnell
func bannerViewDidReceiveAd(_ bannerView: GADBannerView) { print("bannerViewDidReceiveAd") } func bannerView(_ bannerView: GADBannerView, didFailToReceiveAdWithError error: Error) { print("bannerView:didFailToReceiveAdWithError: \(error.localizedDescription)") } func bannerViewDidRecordImpression(_ bannerView: GADBannerView) { print("bannerViewDidRecordImpression") } func bannerViewWillPresentScreen(_ bannerView: GADBannerView) { print("bannerViewWillPresentScreen") } func bannerViewWillDismissScreen(_ bannerView: GADBannerView) { print("bannerViewWillDIsmissScreen") } func bannerViewDidDismissScreen(_ bannerView: GADBannerView) { print("bannerViewDidDismissScreen") }
Ziel c
- (void)bannerViewDidReceiveAd:(GADBannerView *)bannerView { NSLog(@"bannerViewDidReceiveAd"); } - (void)bannerView:(GADBannerView *)bannerView didFailToReceiveAdWithError:(NSError *)error { NSLog(@"bannerView:didFailToReceiveAdWithError: %@", [error localizedDescription]); } - (void)bannerViewDidRecordImpression:(GADBannerView *)bannerView { NSLog(@"bannerViewDidRecordImpression"); } - (void)bannerViewWillPresentScreen:(GADBannerView *)bannerView { NSLog(@"bannerViewWillPresentScreen"); } - (void)bannerViewWillDismissScreen:(GADBannerView *)bannerView { NSLog(@"bannerViewWillDismissScreen"); } - (void)bannerViewDidDismissScreen:(GADBannerView *)bannerView { NSLog(@"bannerViewDidDismissScreen"); }
Sehen Sie sich das Ad Delegate-Beispiel für eine Implementierung von Banner-Delegat-Methoden in der iOS-API-Demo-App an.
Anwendungsfälle
Hier sind einige Anwendungsbeispiele für diese Anzeigenereignismethoden.
Hinzufügen eines Banners zur Ansichtshierarchie, sobald eine Anzeige empfangen wird
Möglicherweise möchten Sie das Hinzufügen eines GADBannerView
zur Ansichtshierarchie verschieben, bis eine Anzeige eingegangen ist. Sie können dies tun, indem Sie auf das Ereignis bannerViewDidReceiveAd:
:
Schnell
func bannerViewDidReceiveAd(_ bannerView: GADBannerView) { // Add banner to view and add constraints as above. addBannerViewToView(bannerView) }
Ziel c
- (void)bannerViewDidReceiveAd:(GADBannerView *)bannerView { // Add bannerView to view and add constraints as above. [self addBannerViewToView:self.bannerView]; }
Animieren einer Werbebanner
Sie können auch das Ereignis bannerViewDidReceiveAd:
verwenden, um eine Banneranzeige zu animieren, sobald sie zurückgegeben wird, wie im folgenden Beispiel gezeigt:
Schnell
func bannerViewDidReceiveAd(_ bannerView: GADBannerView) { bannerView.alpha = 0 UIView.animate(withDuration: 1, animations: { bannerView.alpha = 1 }) }
Ziel c
- (void)bannerViewDidReceiveAd:(GADBannerView *)bannerView { bannerView.alpha = 0; [UIView animateWithDuration:1.0 animations:^{ bannerView.alpha = 1; }]; }
Anhalten und Fortsetzen der App
Das GADBannerViewDelegate
Protokoll verfügt über Methoden, um Sie über Ereignisse zu benachrichtigen, z. B. wenn ein Klick dazu führt, dass ein Overlay angezeigt oder geschlossen wird. Wenn Sie nachverfolgen möchten, ob diese Ereignisse auf Anzeigen zurückzuführen sind, registrieren Sie sich für diese GADBannerViewDelegate
Methoden.
Um alle Arten von Overlay-Präsentationen oder externen Browseraufrufen zu erfassen, nicht nur solche, die von Anzeigenklicks stammen, sollte Ihre App besser auf die entsprechenden Methoden auf UIViewController
oder UIApplication
. Hier ist eine Tabelle mit den entsprechenden iOS-Methoden, die gleichzeitig mit den GADBannerViewDelegate
Methoden aufgerufen werden:
GADBannerViewDelegate-Methode | iOS-Methode |
---|---|
bannerViewWillPresentScreen: | ViewWillDisappear von viewWillDisappear: |
bannerViewWillDismissScreen: | ViewWillAppear des viewWillAppear: |
bannerViewDidDismissScreen: | Ansicht des viewDidAppear: |
Bannergrößen
In der folgenden Tabelle sind die Standard-Bannergrößen aufgeführt.
Größe in Punkten (BxH) | Beschreibung | Verfügbarkeit | AdSize-Konstante |
---|---|---|---|
320 x 50 | Banner | Telefone und Tablets | GADAdSizeBanner |
320 x 100 | Großes Banner | Telefone und Tablets | GADAdSizeLargeBanner |
300 x 250 | Mittleres IAB-Rechteck | Telefone und Tablets | GADAdSizeMediumRectangle |
468x60 | IAB-Banner in voller Größe | Tablets | GADAdSizeFullBanner |
728 x 90 | IAB-Bestenliste | Tablets | GADAdSizeLeaderboard |
Bereitgestellte Breite x Adaptive Höhe | Adaptives Banner | Telefone und Tablets | N / A |
Benutzerdefinierte Anzeigengrößen
Um eine benutzerdefinierte Bannergröße zu definieren, legen Sie Ihre gewünschte Größe mit GADAdSizeFromCGSize
, wie hier gezeigt:
Schnell
let adSize = GADAdSizeFromCGSize(CGSize(width: 300, height: 50))
Ziel c
GADAdSize size = GADAdSizeFromCGSize(CGSizeMake(300, 50));