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 Bild-im-Bild-Anzeigen in Ihrer App anfordern und präsentieren mit GMA Next-Gen SDK.

Hinweis

Führen Sie die folgenden Schritte aus, bevor Sie fortfahren:

Anzeige laden

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

Kotlin

private fun loadPictureInPictureAd() {
  val request = PictureInPictureAdRequest.Builder(AD_UNIT_ID).build()

  PictureInPictureAd.load(
    request,
    object : AdLoadCallback<PictureInPictureAd> {
      override fun onAdFailedToLoad(adError: LoadAdError) {
        Log.w(TAG, "Picture-in-Picture ad failed to load: $adError")
      }

      override fun onAdLoaded(ad: PictureInPictureAd) {
        Log.d(TAG, "Picture-in-Picture ad loaded.")

        // Capture the PictureInPictureAd reference for later use.
        pipAd = ad
        setAdEventCallback(ad)
      }
    },
  )
}

Java

private void loadPictureInPictureAd() {
  PictureInPictureAdRequest request = new PictureInPictureAdRequest.Builder(AD_UNIT_ID).build();

  PictureInPictureAd.load(
      request,
      new AdLoadCallback<PictureInPictureAd>() {
        @Override
        public void onAdFailedToLoad(@NonNull LoadAdError adError) {
          Log.w(TAG, "Picture-in-Picture ad failed to load: " + adError);
        }

        @Override
        public void onAdLoaded(@NonNull PictureInPictureAd ad) {
          Log.d(TAG, "Picture-in-Picture ad loaded.");

          // Capture the PictureInPictureAd reference for later use.
          pipAd = ad;
          setAdEventCallback(ad);
        }
      });
}

Ersetzen Sie AD_UNIT_ID 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:

Kotlin

private fun showPictureInPictureAd(activity: Activity) {
  // Capture the ad reference saved from the onAdLoaded callback.
  val ad = pipAd
  if (ad != null) {
    val options =
      PictureInPictureAdOptions.Builder()
        // Uses the Google Mobile Ads SDK's default screen position.
        .setPosition(PictureInPictureAdPosition.DEFAULT)
        // Binds the ad lifecycle to the host screen.
        .setPresentationScope(PictureInPictureAdPresentationScope.SCREEN)
        .build()
    ad.show(activity, options)
  } else {
    Log.d(TAG, "No ad to show.")
  }
}

Java

private void showPictureInPictureAd(@NonNull Activity activity) {
  // Use the ad reference saved from the onAdLoaded callback.
  if (pipAd != null) {
    PictureInPictureAdOptions options =
        new PictureInPictureAdOptions.Builder()
            // Uses the Google Mobile Ads SDK's default screen position.
            .setPosition(PictureInPictureAdPosition.DEFAULT)
            // Binds the ad lifecycle to the host screen.
            .setPresentationScope(PictureInPictureAdPresentationScope.SCREEN)
            .build();
    pipAd.show(activity, options);
  } else {
    Log.d(TAG, "No ad to show.");
  }
}

Position festlegen

Standardmäßig präsentiert GMA Next-Gen SDK eine Bild-im-Bild-Anzeige beim ersten Mal in der unteren rechten Ecke des Bildschirms oder an der zuletzt 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:

Kotlin

private fun createTopLeftPositionOptions(): PictureInPictureAdOptions {
  return PictureInPictureAdOptions.Builder()
    // Sets the ad position to the top-left corner of the screen.
    .setPosition(PictureInPictureAdPosition.TOP_LEFT)
    .build()
}

Java

private PictureInPictureAdOptions createTopLeftPositionOptions() {
  return new PictureInPictureAdOptions.Builder()
      // Sets the ad position to the top-left corner of the screen.
      .setPosition(PictureInPictureAdPosition.TOP_LEFT)
      .build();
}

Alle verfügbaren Positionen finden Sie unter PictureInPictureAdPosition.

Präsentationsbereich festlegen

Standardmäßig bindet GMA Next-Gen SDK eine Bild-im-Bild-Anzeige an den aktuellen Host bildschirm. GMA Next-Gen 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:

Kotlin

private fun createApplicationScopedOptions(): PictureInPictureAdOptions {
  return PictureInPictureAdOptions.Builder()
    // Keeps the ad visible beyond the host screen's lifecycle.
    .setPresentationScope(PictureInPictureAdPresentationScope.APPLICATION)
    .build()
}

Java

private PictureInPictureAdOptions createApplicationScopedOptions() {
  return new PictureInPictureAdOptions.Builder()
      // Keeps the ad visible beyond the host screen's lifecycle.
      .setPresentationScope(PictureInPictureAdPresentationScope.APPLICATION)
      .build();
}

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 spezifische Ereignisse für Bild-im-Bild-Anzeigen gemeldet, z. B. wenn die Anzeige präsentiert oder geschlossen wird:

Kotlin

private fun setAdEventCallback(pipAd: PictureInPictureAd) {
  pipAd.adEventCallback =
    object : PictureInPictureAdEventCallback {
      override fun onAdShown() {
        Log.d(TAG, "Picture-in-Picture ad shown.")
      }

      override fun onAdHidden() {
        Log.d(TAG, "Picture-in-Picture ad hidden.")
      }

      override fun onAdImpression() {
        Log.d(TAG, "Picture-in-Picture ad recorded an impression.")
      }

      override fun onAdClicked() {
        Log.d(TAG, "Picture-in-Picture ad recorded a click.")
      }

      override fun onAdShowedFullScreenContent() {
        Log.d(TAG, "Picture-in-Picture ad showed full screen content.")
      }

      override fun onAdDismissedFullScreenContent() {
        Log.d(TAG, "Picture-in-Picture ad dismissed full screen content.")
      }

      override fun onAdFailedToShowFullScreenContent(
        fullScreenContentError: FullScreenContentError
      ) {
        Log.w(
          TAG,
          "Picture-in-Picture ad failed to show full screen content: $fullScreenContentError",
        )
      }

      override fun onAdPaid(value: AdValue) {
        Log.d(TAG, "Picture-in-Picture ad paid: ${value.valueMicros} ${value.currencyCode}")
      }
    }
}

Java

private void setAdEventCallback(@NonNull PictureInPictureAd pipAd) {
  pipAd.setAdEventCallback(
      new PictureInPictureAdEventCallback() {
        @Override
        public void onAdShown() {
          Log.d(TAG, "Picture-in-Picture ad shown.");
        }

        @Override
        public void onAdHidden() {
          Log.d(TAG, "Picture-in-Picture ad hidden.");
        }

        @Override
        public void onAdImpression() {
          Log.d(TAG, "Picture-in-Picture ad recorded an impression.");
        }

        @Override
        public void onAdClicked() {
          Log.d(TAG, "Picture-in-Picture ad recorded a click.");
        }

        @Override
        public void onAdShowedFullScreenContent() {
          Log.d(TAG, "Picture-in-Picture ad showed full screen content.");
        }

        @Override
        public void onAdDismissedFullScreenContent() {
          Log.d(TAG, "Picture-in-Picture ad dismissed full screen content.");
        }

        @Override
        public void onAdFailedToShowFullScreenContent(
            @NonNull FullScreenContentError fullScreenContentError) {
          Log.w(
              TAG,
              "Picture-in-Picture ad failed to show full screen content: "
                  + fullScreenContentError);
        }

        @Override
        public void onAdPaid(@NonNull AdValue value) {
          Log.d(
              TAG,
              "Picture-in-Picture ad paid: "
                  + value.getValueMicros()
                  + " "
                  + value.getCurrencyCode());
        }
      });
}

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:

Kotlin

private fun hidePictureInPictureAd() {
  // Capture the ad reference saved from the onAdLoaded callback.
  val ad = pipAd
  if (ad != null) {
    ad.hide()
  } else {
    Log.d(TAG, "No ad to hide.")
  }
}

Java

private void hidePictureInPictureAd() {
  // Use the ad reference saved from the onAdLoaded callback.
  if (pipAd != null) {
    pipAd.hide();
  } else {
    Log.d(TAG, "No ad to 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 Bildschirmen wechselt. Entfernen Sie den Verweis, wenn der Nutzer die Anzeige schließt:

Kotlin

private fun cleanUpPictureInPictureAd() {
  pipAd?.destroy()
  pipAd = null
}

Java

private void cleanUpPictureInPictureAd() {
  // Use the ad reference saved from the onAdLoaded callback.
  if (pipAd != null) {
    pipAd.destroy();
    pipAd = null;
  }
}

Anzeige auf mehreren Bildschirmen sichtbar halten

Wenn Sie den Präsentationsbereich auf die Anwendung festlegen, bleibt die Bild-im-Bild-Anzeige sichtbar, auch wenn Ihre App den Hostbildschirm aus dem Arbeitsspeicher entfernt. Wenn der Nutzer den Hostbildschirm verlässt, muss Ihre App weiterhin auf die Bild-im-Bild-Anzeige zugreifen können, damit er mit ihr interagieren oder sie schließen kann. Wir empfehlen, die Anzeige in einem Singleton auf App-Ebene oder einem gemeinsamen Statusmanager zu speichern und nicht in einer 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: