Banneranzeigen einrichten

Banneranzeigen sind rechteckige Anzeigen, die einen Teil der App-Oberfläche einnehmen. Adaptive Ankerbanner bleiben immer auf dem Bildschirm und sind dort oben oder unten verankert. Ihre maximale Höhe beträgt 20% der Bildschirmgröße und ist auf 150 Pixel begrenzt. Mit adaptiven Bannern wird die Anzeigengröße für jedes Gerät optimiert.

In diesem Leitfaden wird beschrieben, wie Sie eine adaptive Ankerbanneranzeige in eine iOS-App laden.

Vorbereitung

Richten Sie Google Mobile Ads SDK ein, bevor Sie fortfahren.

Immer mit Testanzeigen testen

Verwenden Sie beim Erstellen und Testen Ihrer Apps Testanzeigen anstelle von Live-Anzeigen. Andernfalls kann Ihr Konto gesperrt werden.

Testanzeigen lassen sich unter iOS am einfachsten mit unserer speziellen Test-Anzeigenblock-ID für Banner laden:

ca-app-pub-3940256099942544/2435281174

Sie ist speziell so konfiguriert, dass für jede Anfrage Testanzeigen zurückgegeben werden. Sie können sie beim Programmieren, Testen und Debuggen in Ihren eigenen Apps verwenden. Ersetzen Sie sie vor der Veröffentlichung Ihrer App durch Ihre eigene Anzeigenblock-ID.

Weitere Informationen zu Google Mobile Ads SDK Testanzeigen finden Sie unter Test Ads.

GADBannerView erstellen

Banneranzeigen werden in GADBannerView Objekten angezeigt. Der erste Schritt zur Einbindung von Banneranzeigen besteht also darin, ein GADBannerView in Ihre Ansichtshierarchie aufzunehmen. Dies erfolgt in der Regel programmatisch oder über Interface Builder.

Programmatisch

Ein GADBannerView kann auch direkt instanziiert werden. Im folgenden Beispiel wird ein GADBannerView erstellt:

Swift

// Initialize the banner view.
bannerView = BannerView()
bannerView.delegate = self

bannerView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(bannerView)

// This example doesn't give width or height constraints, as the ad size gives the banner an
// intrinsic content size to size the view.
NSLayoutConstraint.activate([
  // Align the banner's bottom edge with the safe area's bottom edge
  bannerView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor),
  // Center the banner horizontally in the view
  bannerView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
])BannerSnippets.swift

SwiftUI

Wenn Sie ein BannerView verwenden möchten, erstellen Sie ein UIViewRepresentable:

private struct BannerViewContainer: UIViewRepresentable {
  typealias UIViewType = BannerView
  let adSize: AdSize

  init(_ adSize: AdSize) {
    self.adSize = adSize
  }

  func makeUIView(context: Context) -> BannerView {
    let banner = BannerView(adSize: adSize)
    banner.adUnitID = "ca-app-pub-3940256099942544/2435281174"
    banner.load(Request())
    banner.delegate = context.coordinator
    return banner
  }

  func updateUIView(_ uiView: BannerView, context: Context) {}

  func makeCoordinator() -> BannerCoordinator {
    return BannerCoordinator(self)
  }BannerContentView.swift

Fügen Sie Ihr UIViewRepresentable der Ansichtshierarchie hinzu und geben Sie die Werte für height und width an:

var body: some View {
  Spacer()
  // Request an anchored adaptive banner with a width of 375.
  let adSize = largeAnchoredAdaptiveBanner(width: 375)
  BannerViewContainer(adSize)
    .frame(width: adSize.size.width, height: adSize.size.height)
}BannerContentView.swift

Objective-C

// Initialize the banner view.
GADBannerView *bannerView = [[GADBannerView alloc] init];
bannerView.delegate = self;
UIView *view = self.view;

bannerView.translatesAutoresizingMaskIntoConstraints = NO;
[view addSubview:bannerView];

// This example doesn't give width or height constraints, as the ad size gives the banner an
// intrinsic content size to size the view.
[NSLayoutConstraint activateConstraints:@[
  // Align the banner's bottom edge with the safe area's bottom edge
  [bannerView.bottomAnchor
      constraintEqualToAnchor:view.safeAreaLayoutGuide.bottomAnchor],
  // Center the banner horizontally in the view
  [bannerView.centerXAnchor constraintEqualToAnchor:view.centerXAnchor],
]];

self.bannerView = bannerView;BannerSnippets.m

Interface Builder

Sie können ein GADBannerView einer Storyboard- oder XIB-Datei hinzufügen. Wenn Sie diese Methode verwenden, fügen Sie dem Banner nur Positionsbeschränkungen hinzu. Wenn Sie beispielsweise ein adaptives Banner unten auf dem Bildschirm anzeigen, legen Sie fest, dass der untere Rand der Banneransicht dem oberen Rand des Bottom Layout Guide entspricht, und setzen Sie die centerX Beschränkung auf den centerX der übergeordneten Ansicht.

Anzeigengröße festlegen

Im folgenden Beispiel wird die Größe eines großen adaptiven Ankerbanners abgerufen:

Swift

// Request a large anchored adaptive banner with a width of 375.
bannerView.adSize = largeAnchoredAdaptiveBanner(width: 375)BannerSnippets.swift

Objective-C

// Request a large anchored adaptive banner with a width of 375.
self.bannerView.adSize = GADLargeAnchoredAdaptiveBannerAdSizeWithWidth(375);BannerSnippets.m

Anzeige laden

Sobald das GADBannerView platziert und seine Eigenschaften wie adUnitID konfiguriert sind, können Sie eine Anzeige laden. Dazu rufen Sie loadRequest: für ein GADRequest Objekt auf:

Swift

func loadBannerAd(bannerView: BannerView) {
  // Request a large anchored adaptive banner with a width of 375.
  bannerView.adSize = largeAnchoredAdaptiveBanner(width: 375)
  bannerView.load(Request())
}BannerSnippets.swift

SwiftUI

banner.adUnitID = "ca-app-pub-3940256099942544/2435281174"
banner.load(Request())BannerContentView.swift

Objective-C

// Request a large anchored adaptive banner with a width of 375.
self.bannerView.adSize = GADLargeAnchoredAdaptiveBannerAdSizeWithWidth(375);

[self.bannerView loadRequest:[GADRequest request]];BannerSnippets.m

GADRequest -Objekte stellen eine einzelne Anzeigenanfrage dar und enthalten Eigenschaften für Dinge wie Targeting-Informationen.

Anzeige aktualisieren

Wenn Sie Ihren Anzeigenblock so konfiguriert haben, dass er aktualisiert wird, müssen Sie keine weitere Anzeige anfordern, wenn das Laden der Anzeige fehlschlägt. Google Mobile Ads SDK berücksichtigt jede Aktualisierungsrate die Sie in der AdMob-Benutzeroberfläche angegeben haben. Wenn Sie die Aktualisierung nicht aktiviert haben, senden Sie eine neue Anfrage. Weitere Informationen zur Aktualisierung von Anzeigenblöcken, z. B. zum Festlegen einer Aktualisierungsrate, finden Sie unter Automatische Aktualisierung für Banneranzeigen verwenden.

Umgang mit Ausrichtungsänderungen

Wenn sich die Bildschirmausrichtung Ihrer App ändert, z. B. vom portrait Modus ins Querformat, ändert sich oft auch die verfügbare Breite für das Banner. Damit eine Anzeige mit der richtigen Größe für das neue Layout angezeigt wird, fordern Sie ein neues Banner an. Wenn die Bannerbreite statisch ist oder die Layoutbeschränkungen die Größenänderung verarbeiten können, überspringen Sie diesen Schritt.

Swift

override func viewWillTransition(
  to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator
) {
  coordinator.animate(alongsideTransition: { _ in
    // Load a new ad for the new orientation.
  })
}BannerSnippets.swift

Objective-C

- (void)viewWillTransitionToSize:(CGSize)size
       withTransitionCoordinator:(id<UIViewControllerTransitionCoordinator>)coordinator {
  [coordinator animateAlongsideTransition:^(id<UIViewControllerTransitionCoordinatorContext> context) {
    // Load a new ad for the new orientation.
  } completion:nil];
}BannerSnippets.m

Anzeigenereignisse

Mit GADBannerViewDelegate können Sie auf Lebenszyklusereignisse reagieren, z. B. wenn eine Anzeige geschlossen wird oder der Nutzer die App verlässt.

Für Bannerereignisse registrieren

Wenn Sie sich für Banneranzeigenereignisse registrieren möchten, legen Sie die delegate Eigenschaft für GADBannerView auf ein Objekt fest, das das GADBannerViewDelegate Protokoll implementiert. In der Regel fungiert die Klasse, die Banneranzeigen implementiert, auch als Delegatenklasse. In diesem Fall kann die delegate-Eigenschaft auf self gesetzt werden.

Swift

bannerView.delegate = selfBannerSnippets.swift

SwiftUI

banner.delegate = context.coordinatorBannerContentView.swift

Objective-C

bannerView.delegate = self;BannerSnippets.m

Bannerereignisse implementieren

Jede der Methoden in GADBannerViewDelegate ist als optional gekennzeichnet. Sie müssen also nur die gewünschten Methoden implementieren. In diesem Beispiel wird jede Methode implementiert und eine Nachricht in der Konsole protokolliert:

Swift

func bannerViewDidReceiveAd(_ bannerView: BannerView) {
  print("Banner ad loaded.")
}

func bannerView(_ bannerView: BannerView, didFailToReceiveAdWithError error: Error) {
  print("Banner ad failed to load: \(error.localizedDescription)")
}

func bannerViewDidRecordImpression(_ bannerView: BannerView) {
  print("Banner ad recorded an impression.")
}

func bannerViewDidRecordClick(_ bannerView: BannerView) {
  print("Banner ad recorded a click.")
}

func bannerViewWillPresentScreen(_ bannerView: BannerView) {
  print("Banner ad will present screen.")
}

func bannerViewWillDismissScreen(_ bannerView: BannerView) {
  print("Banner ad will dismiss screen.")
}

func bannerViewDidDismissScreen(_ bannerView: BannerView) {
  print("Banner ad did dismiss screen.")
}BannerSnippets.swift

Objective-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");
}
BannerSnippets.m

Ein Beispiel für die Implementierung von Banner-Delegatenmethoden in der iOS API Demo App finden Sie unter Ad Delegate.

Swift Objective-C

Anwendungsfälle

Hier einige Anwendungsbeispiele für diese Methoden für Anzeigenereignisse.

Banner der Ansichtshierarchie hinzufügen, sobald eine Anzeige empfangen wurde

Möglicherweise möchten Sie das Hinzufügen eines GADBannerView zur Ansichtshierarchie verzögern, bis eine Anzeige empfangen wurde. Dazu können Sie auf das Ereignis bannerViewDidReceiveAd: reagieren:

Swift

func bannerViewDidReceiveAd(_ bannerView: BannerView) {
  // Add banner to view and add constraints.
  addBannerViewToView(bannerView)
}

Objective-C

- (void)bannerViewDidReceiveAd:(GADBannerView *)bannerView {
  // Add bannerView to view and add constraints as above.
  [self addBannerViewToView:self.bannerView];
}

Banneranzeige animieren

Sie können das Ereignis bannerViewDidReceiveAd: auch verwenden, um eine Banneranzeige zu animieren, sobald sie zurückgegeben wurde. Das folgende Beispiel zeigt, wie das geht:

Swift

func bannerViewDidReceiveAd(_ bannerView: BannerView) {
  bannerView.alpha = 0
  UIView.animate(withDuration: 1, animations: {
    bannerView.alpha = 1
  })
}

Objective-C

- (void)bannerViewDidReceiveAd:(GADBannerView *)bannerView {
  bannerView.alpha = 0;
  [UIView animateWithDuration:1.0 animations:^{
    bannerView.alpha = 1;
  }];
}

App pausieren und fortsetzen

Das GADBannerViewDelegate-Protokoll enthält Methoden, mit denen Sie über Ereignisse benachrichtigt werden, z. B. wenn durch einen Klick ein Overlay präsentiert 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.

Wenn Sie alle Arten von Overlay-Präsentationen oder Aufrufen externer Browser erfassen möchten, nicht nur solche, die durch Anzeigenklicks ausgelöst werden, sollten Sie in Ihrer App auf die entsprechenden Methoden in UIViewController oder UIApplication reagieren. In der folgenden Tabelle sind die entsprechenden iOS-Methoden aufgeführt, die gleichzeitig mit den GADBannerViewDelegate-Methoden aufgerufen werden:

GADBannerViewDelegate-Methode	iOS-Methode
`bannerViewWillPresentScreen:`	`viewWillDisappear:` von UIViewController
`bannerViewWillDismissScreen:`	`viewWillAppear:` von UIViewController
`bannerViewDidDismissScreen:`	`viewDidAppear:` von UIViewController

Zusätzliche Ressourcen

Beispiele auf GitHub

Beispiel für adaptive Ankerbanneranzeigen: Swift | SwiftUI | Objective-C

Demo für erweiterte Funktionen: Swift | Objective-C

Nächste Schritte

Minimierbare Banner

Minimierbare Banneranzeigen werden zuerst als größeres Overlay mit einer Schaltfläche angezeigt, mit der die Anzeige auf eine kleinere Größe minimiert werden kann. Sie können damit die Leistung weiter optimieren. Weitere Informationen zu reduzierbaren Banneranzeigen

Adaptive Inline-Banner

Adaptive Inline-Banner sind größer und höher als adaptive Ankerbanner. Sie haben eine variable Höhe und können so hoch wie der Gerätebildschirm sein. Adaptive Inline-Banner werden für Apps empfohlen, bei denen Banneranzeigen in scrollbaren Inhalten platziert werden. Weitere Informationen

Weitere Themen

Datenschutz für Nutzer

Banneranzeigen einrichten Mit Sammlungen den Überblick behalten Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.

Vorbereitung

Immer mit Testanzeigen testen

GADBannerView erstellen

Programmatisch

Swift

SwiftUI

Objective-C

Interface Builder

Anzeigengröße festlegen

Swift

Objective-C

Anzeige laden

Swift

SwiftUI

Objective-C

Anzeige aktualisieren

Umgang mit Ausrichtungsänderungen

Swift

Objective-C

Anzeigenereignisse

Für Bannerereignisse registrieren

Swift

SwiftUI

Objective-C

Bannerereignisse implementieren

Swift

Objective-C

Anwendungsfälle

Banner der Ansichtshierarchie hinzufügen, sobald eine Anzeige empfangen wurde

Swift

Objective-C

Banneranzeige animieren

Swift

Objective-C

App pausieren und fortsetzen

Zusätzliche Ressourcen

Beispiele auf GitHub

Nächste Schritte

Minimierbare Banner

Adaptive Inline-Banner

Weitere Themen

Banneranzeigen einrichten