Banneranzeigen einrichten

Banneranzeigen sind rechteckige Anzeigen, die einen Teil des Layouts einer App einnehmen. Adaptive Ankerbanner sind immer auf dem Bildschirm zu sehen und oben oder unten auf dem Bildschirm verankert. Sie haben eine maximale Höhe von 20 % der Bildschirmgröße und eine maximale Höhe von 150 Pixeln. Wenn Sie die Anzeigengröße für jedes Gerät optimieren möchten, verwenden Sie adaptive Banner.

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

Vorbereitung

Bevor Sie fortfahren, richten Sie Google Mobile Ads SDK ein.

Immer mit Testanzeigen testen

Verwenden Sie beim Erstellen und Testen Ihrer Apps Testanzeigen anstelle von Live-Anzeigen. Andernfalls kann es zu einer Sperrung Ihres Kontos kommen.

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

ca-app-pub-3940256099942544/2435281174

Sie ist so konfiguriert, dass für jede Anfrage Testanzeigen zurückgegeben werden. Sie können sie in Ihren eigenen Apps beim Programmieren, Testen und Debuggen verwenden. Ersetzen Sie sie einfach durch Ihre eigene Anzeigenblock-ID, bevor Sie Ihre App veröffentlichen.

Weitere Informationen zur Funktionsweise von Google Mobile Ads SDK-Testanzeigen finden Sie unter Testanzeigen.

GADBannerView erstellen

Banneranzeigen werden in GADBannerView-Objekten präsentiert. Der erste Schritt zur Einbindung von Banneranzeigen besteht also darin, ein GADBannerView-Objekt in die Ansichtshierarchie aufzunehmen. Dies geschieht normalerweise entweder programmatisch oder über den 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),
])

SwiftUI

Wenn Sie einen BannerView verwenden möchten, erstellen Sie einen 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)
  }

Fügen Sie der Ansichtshierarchie die UIViewRepresentable hinzu und geben Sie die Werte 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)
}

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;

Interface Builder

Sie können ein GADBannerView zu einem Storyboard oder einer XIB-Datei hinzufügen. Wenn Sie diese Methode verwenden, sollten Sie nur Positionsbeschränkungen für das Banner hinzufügen. Wenn Sie beispielsweise ein adaptives Banner am unteren Bildschirmrand anzeigen, legen Sie die Unterseite der Banneransicht auf die Oberseite des unteren Layout-Guides fest und setzen Sie die Einschränkung centerX auf die centerX der Superview.

Anzeigengröße festlegen

Große adaptive Banner bieten ein größeres Format, das für Layouts ohne Scrollen konzipiert ist. Im Vergleich zu standardmäßigen adaptiven Ankerbannern ist bei diesen Bannern eine größere maximale Höhe möglich (bis zu 20 % der Bildschirmhöhe, zwischen 50 und 150 Punkten). Dieser größere Bereich ist für Videoinhalte optimiert.

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)

Objective-C

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

Legen Sie eine Anzeigengröße fest, die kleiner oder gleich der Bildschirmgröße des Geräts ist. Verwende die Property UIWindowScene.effectiveGeometry.coordinateSpace, um die maximale Bildschirmgröße unter iOS 26 und höher zu ermitteln. Verwenden Sie unter iOS 18 und niedriger die Property UIWindowScene.coordinateSpace. Weitere Informationen zu Größenbeschränkungen finden Sie unter Größenanforderungen für Anzeigenanfragen.

Anzeige laden

Sobald die GADBannerView-Komponente vorhanden ist und ihre Attribute wie adUnitID konfiguriert sind, kann eine Anzeige geladen werden. 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())
}

SwiftUI

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

Objective-C

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

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

GADRequest-Objekte stellen eine einzelne Anzeigenanfrage dar und enthalten Attribute wie Targeting-Informationen.

Anzeige aktualisieren

Wenn Sie Ihren Anzeigenblock so konfiguriert haben, dass er aktualisiert wird, müssen Sie keine weitere Anzeige anfordern, wenn die Anzeige nicht geladen werden kann. Google Mobile Ads SDK berücksichtigt alle Aktualisierungsraten, 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.

Änderungen der Ausrichtung verarbeiten

Wenn sich die Bildschirmausrichtung Ihrer App ändert, z. B. vom Modus portrait zum Querformat, ändert sich häufig auch die verfügbare Breite für das Banner. Damit für das neue Layout eine Anzeige in der richtigen Größe ausgeliefert wird, müssen Sie ein neues Banner anfordern. Wenn die Bannerbreite statisch ist oder die Layoutbeschränkungen die Größenänderung zulassen, können Sie diesen Schritt überspringen.

Swift

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

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];
}

Anzeigenereignisse

Mit GADBannerViewDelegate können Sie Lifecycle-Events erfassen, 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 das Attribut delegate für GADBannerView auf ein Objekt fest, das das Protokoll GADBannerViewDelegate implementiert. In der Regel fungiert die Klasse, die Banneranzeigen implementiert, auch als Delegatklasse. In diesem Fall kann das Attribut delegate auf self gesetzt werden.

Swift

bannerView.delegate = self

SwiftUI

banner.delegate = context.coordinator

Objective-C

bannerView.delegate = self;

Bannerereignisse implementieren

Alle Methoden in GADBannerViewDelegate sind als optional gekennzeichnet. Sie müssen also nur die Methoden implementieren, die Sie verwenden möchten. 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.")
}

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");
}

Ein Beispiel für die Implementierung von Banner-Delegate-Methoden in der iOS API-Demo-App finden Sie im Beispiel „Ad Delegate“.

Swift Objective-C

Anwendungsfälle

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

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

Sie können die GADBannerView auch erst dann der Ansichtshierarchie hinzufügen, wenn eine Anzeige empfangen wurde. Dazu können Sie das Ereignis bannerViewDidReceiveAd: beobachten:

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 wird, wie im folgenden Beispiel gezeigt:

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 Protokoll GADBannerViewDelegate bietet Methoden, um Sie über Ereignisse zu benachrichtigen, z. B. wenn ein Klick dazu führt, dass ein Overlay angezeigt oder geschlossen wird. Wenn Sie nachvollziehen 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 externen Browseraufrufen erfassen möchten, nicht nur solche, die von Anzeigenklicks stammen, sollte Ihre App auf die entsprechenden Methoden in UIViewController oder UIApplication warten. 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

Nächste Schritte

Minimierbare Banner

Minimierbare Banneranzeigen sind Banneranzeigen, die zuerst als größeres Overlay mit einer Schaltfläche zum Minimieren der Anzeige auf eine kleinere Größe dargestellt werden. Sie können es verwenden, um die Leistung weiter zu optimieren. Weitere Informationen finden Sie unter Minimierbare 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, in denen Banneranzeigen in scrollbaren Inhalten platziert werden, gegenüber adaptiven Ankerbannern empfohlen. Weitere Informationen finden Sie unter Adaptive Inline-Banner.

Weitere Themen entdecken