Bild-im-Bild-Anzeigen implementieren (Beta)

Plattform auswählen: Android iOS Unity

Bild im Bild

Bild-im-Bild-Anzeigen werden in einem schwebenden Fenster angezeigt, das über dem Inhalt auf dem Bildschirm liegt, z. B. über Artikeln, Feeds oder Spielen. Mit diesem Format können Nutzer mit Ihrer App interagieren, während die Anzeige sichtbar bleibt. Wenn Sie Anzeigen präsentieren möchten, die nicht den gesamten Bildschirm einnehmen, wählen Sie dieses Format aus. Weitere Informationen zu Bild-im-Bild Anzeigen.

In diesem Leitfaden wird beschrieben, wie Sie mit dem Google Mobile Ads SDK Bild-im-Bild-Anzeigen in Ihrer App anfordern und präsentieren mithilfe von Google Mobile Ads SDK.

Hinweis

Bevor Sie fortfahren, führen Sie die folgenden Schritte aus:

Anzeige laden

Wenn Sie ein GADPictureInPictureAd Objekt laden möchten, erstellen Sie eine Anzeigenanfrage und rufen Sie die Methode „load“ auf:

Swift

private func loadPictureInPictureAd() async {
  do {
    // Capture the PictureInPictureAd reference for later use.
    pipAd = try await PictureInPictureAd.load(
      with: adUnitID, request: Request())
    // Set the delegate to be notified of ad events.
    pipAd?.delegate = self
  } catch {
    print(
      "Picture-in-Picture ad failed to load: \(error.localizedDescription)")
  }
}

Ersetzen Sie adUnitID durch Ihre Anzeigenblock-ID.

Objective-C

- (void)loadPictureInPictureAd {
  GADRequest *request = [GADRequest request];

  [GADPictureInPictureAd
       loadWithAdUnitID:kAdUnitID
                request:request
      completionHandler:^(GADPictureInPictureAd *_Nullable ad, NSError *_Nullable error) {
        if (error) {
          NSLog(@"Picture-in-Picture ad failed to load: %@", error);
          return;
        }
        // Capture the PictureInPictureAd reference for later use.
        self.pipAd = ad;
        // Set the delegate to be notified of ad events.
        self.pipAd.delegate = self;
      }];
}

Ersetzen Sie kAdUnitID durch Ihre Anzeigenblock-ID.

Anzeige präsentieren

Wenn Sie die Bild-im-Bild-Anzeige auf dem Bildschirm präsentieren möchten, rufen Sie die Methode „show“ auf. Im folgenden Beispiel wird die Anzeige an der Standardposition präsentiert und der Präsentationsbereich auf den Bildschirm festgelegt:

Swift

private func showPictureInPictureAd() {
  // Use the loaded PictureInPictureAd instance.
  guard let pipAd else {
    print("No ad to show.")
    return
  }
  let options = PictureInPictureAdOptions()
  // Uses the Google Mobile Ads SDK's default screen position.
  options.position = .default
  // Binds the ad lifecycle to the host screen.
  options.presentationScope = .screen

  pipAd.show(with: options)
}

Objective-C

- (void)showPictureInPictureAd {
  // Use the loaded PictureInPictureAd instance.
  if (!self.pipAd) {
    NSLog(@"No ad to show.");
    return;
  }
  GADPictureInPictureAdOptions *options =
      [[GADPictureInPictureAdOptions alloc] init];
  // Uses the Google Mobile Ads SDK's default screen position.
  options.position = GADPictureInPictureAdPositionDefault;
  // Binds the ad lifecycle to the host screen.
  options.presentationScope = GADPictureInPictureAdPresentationScopeScreen;

  [self.pipAd showWithOptions:options];
}

Position festlegen

Standardmäßig präsentiert Google Mobile Ads SDK eine Bild-im-Bild-Anzeige beim ersten Mal in der unteren rechten Ecke des Bildschirms oder an der letzten bekannten Position, wenn sie bereits präsentiert wurde. Wenn Sie anpassen möchten, wo die Anzeige präsentiert wird, geben Sie beim Präsentieren der Anzeige eine Position an. Im folgenden Beispiel wird die Position oben links auf dem Bildschirm festgelegt:

Swift

private func createTopLeftPositionOptions() -> PictureInPictureAdOptions {
  let options = PictureInPictureAdOptions()
  // Sets the ad position to the top-left corner of the screen.
  options.position = .topLeft
  return options
}

Objective-C

- (GADPictureInPictureAdOptions *)createTopLeftPositionOptions {
  GADPictureInPictureAdOptions *options =
      [[GADPictureInPictureAdOptions alloc] init];
  // Sets the ad position to the top-left corner of the screen.
  options.position = GADPictureInPictureAdPositionTopLeft;
  return options;
}

Alle verfügbaren Positionen finden Sie unter GADPictureInPictureAdPosition.

Präsentationsbereich festlegen

Standardmäßig bindet Google Mobile Ads SDK eine Bild-im-Bild-Anzeige an den aktuellen Host bildschirm. Google Mobile Ads SDK schließt die Anzeige, wenn die Ansichtshierarchie des Hostbildschirms nicht mehr im Arbeitsspeicher vorhanden ist. Wenn die Anzeige auch dann sichtbar bleiben soll, nachdem der Hostbildschirm aus dem Arbeitsspeicher entfernt wurde, legen Sie den Präsentationsbereich auf die Anwendung fest:

Swift

private func createApplicationScopedOptions() -> PictureInPictureAdOptions {
  let options = PictureInPictureAdOptions()
  // Keeps the ad visible beyond the host screen's lifecycle.
  options.presentationScope = .application
  return options
}

Objective-C

- (GADPictureInPictureAdOptions *)createApplicationScopedOptions {
  GADPictureInPictureAdOptions *options =
      [[GADPictureInPictureAdOptions alloc] init];
  // Keeps the ad visible beyond the host screen's lifecycle.
  options.presentationScope = GADPictureInPictureAdPresentationScopeApplication;
  return options;
}

Weitere Informationen finden Sie unter Anzeige auf mehreren Bildschirmen sichtbar halten.

Anzeigenereignisse beobachten

Wenn Sie Ereignisse im Lebenszyklus von Bild-im-Bild-Anzeigen verarbeiten möchten, registrieren Sie sich für Anzeigenereignisse, bevor Sie Ihre Anzeige präsentieren. Diese Ereignisse melden Anzeigeninteraktionen wie Klicks und Impressionen. Außerdem werden Bild-im-Bild-spezifische Ereignisse gemeldet, z. B. wenn die Anzeige präsentiert oder geschlossen wird:

Swift

func pictureInPictureAdDidShow(_ pictureInPictureAd: PictureInPictureAd) {
  print("Picture-in-Picture ad shown.")
}

func pictureInPictureAdDidHide(_ pictureInPictureAd: PictureInPictureAd) {
  print("Picture-in-Picture ad hidden.")
}

func pictureInPictureAdDidFailToShow(
  _ pictureInPictureAd: PictureInPictureAd, error: Error
) {
  print("Picture-in-Picture ad failed to show: \(error.localizedDescription)")
}

func pictureInPictureAdDidRecordImpression(
  _ pictureInPictureAd: PictureInPictureAd
) {
  print("Picture-in-Picture ad recorded an impression.")
}

func pictureInPictureAdDidRecordClick(
  _ pictureInPictureAd: PictureInPictureAd
) {
  print("Picture-in-Picture ad recorded a click.")
}

func pictureInPictureAdWillPresentScreen(
  _ pictureInPictureAd: PictureInPictureAd
) {
  print("Picture-in-Picture ad will present screen.")
}

func pictureInPictureAdWillDismissScreen(
  _ pictureInPictureAd: PictureInPictureAd
) {
  print("Picture-in-Picture ad will dismiss screen.")
}

func pictureInPictureAdDidDismissScreen(
  _ pictureInPictureAd: PictureInPictureAd
) {
  print("Picture-in-Picture ad dismissed screen.")
}

Objective-C

- (void)pictureInPictureAdDidShow:(GADPictureInPictureAd *)pictureInPictureAd {
  NSLog(@"Picture-in-Picture ad shown.");
}

- (void)pictureInPictureAdDidHide:(GADPictureInPictureAd *)pictureInPictureAd {
  NSLog(@"Picture-in-Picture ad hidden.");
}

- (void)pictureInPictureAdDidFailToShow:(GADPictureInPictureAd *)pictureInPictureAd
                              withError:(NSError *)error {
  NSLog(@"Picture-in-Picture ad failed to show: %@", error);
}

- (void)pictureInPictureAdDidRecordImpression:(GADPictureInPictureAd *)pictureInPictureAd {
  NSLog(@"Picture-in-Picture ad recorded an impression.");
}

- (void)pictureInPictureAdDidRecordClick:(GADPictureInPictureAd *)pictureInPictureAd {
  NSLog(@"Picture-in-Picture ad recorded a click.");
}

- (void)pictureInPictureAdWillPresentScreen:(GADPictureInPictureAd *)pictureInPictureAd {
  NSLog(@"Picture-in-Picture ad will present screen.");
}

- (void)pictureInPictureAdWillDismissScreen:(GADPictureInPictureAd *)pictureInPictureAd {
  NSLog(@"Picture-in-Picture ad will dismiss screen.");
}

- (void)pictureInPictureAdDidDismissScreen:(GADPictureInPictureAd *)pictureInPictureAd {
  NSLog(@"Picture-in-Picture ad dismissed screen.");
}

Anzeige schließen

Wenn Sie die Floating-Anzeige vom Bildschirm entfernen möchten, rufen Sie die Methode „hide“ auf. Diese Methode ruft das Ereignis „Anzeige geschlossen“ auf:

Swift

private func hidePictureInPictureAd() {
  // Use the loaded PictureInPictureAd instance.
  guard let pipAd else {
    print("No ad to hide.")
    return
  }
  pipAd.hide()
}

Objective-C

- (void)hidePictureInPictureAd {
  // Use the loaded PictureInPictureAd instance.
  if (!self.pipAd) {
    NSLog(@"No ad to hide.");
    return;
  }
  [self.pipAd hide];
}

Anzeigenressourcen bereinigen

Um Speicherlecks zu vermeiden, entfernen Sie den Verweis auf das Anzeigenobjekt, wenn Ihre App die Anzeige nicht mehr verwendet. Das ist beispielsweise der Fall, wenn Ihre App die Anzeige nicht mehr präsentiert oder mit ihr interagiert. Bei Anzeigen, die auf den Bildschirm beschränkt sind, entfernen Sie den Verweis, wenn Ihre App den Hostbildschirm aus dem Arbeitsspeicher entfernt. Bei Anzeigen, die auf die App beschränkt sind, behalten Sie den Anzeigenverweis bei, während der Nutzer zwischen den Bildschirmen wechselt, und entfernen Sie den Verweis, wenn der Nutzer die Anzeige schließt:

Swift

private func cleanUpPictureInPictureAd() {
  pipAd?.hide()
  pipAd = nil
}

Objective-C

- (void)cleanUpPictureInPictureAd {
  [self.pipAd hide];
  self.pipAd = nil;
}

Anzeige auf mehreren Bildschirmen sichtbar halten

Wenn Sie den Präsentationsbereich auf die Anwendung festlegen, bleibt die Bild-im-Bild-Anzeige auch dann sichtbar, wenn Ihre App den Hostbildschirm aus dem Arbeitsspeicher entfernt. Wenn der Nutzer mit der Anzeige interagieren oder sie schließen möchte, nachdem er den Hostbildschirm verlassen hat, muss Ihre App weiterhin Zugriff auf die Bild-im-Bild-Anzeige haben. Wir empfehlen, die Anzeige in einem Singleton auf App-Ebene oder einem gemeinsamen Statusmanager zu speichern und nicht in der Instanzvariablen eines einzelnen Bildschirms.

Beispiele dafür, wie Sie eine Anzeige auf mehreren Bildschirmen sichtbar halten können, finden Sie in den folgenden Beispiel-Apps: