Symbolanzeigen implementieren

Symbolanzeigen sind kleine App-Symbol-Placements, die das Betriebssystem ergänzen und flexibel an die meisten Aktivitäten auf Betriebssystemebene angepasst werden können, z. B. Sperrbildschirm und Bildschirm zum Teilen. Sie können Symbolanzeigen einzeln oder in mehreren Gruppen präsentieren. Jede Anzeige enthält eine Reihe von Text- und String-Elementen, die von Ihrer App gerendert werden müssen. Die folgenden Bilder zeigen Symbolanzeigen in einem App-Ordner:

In diesem Leitfaden erfahren Sie, wie Sie Symbolanzeigen anfordern und präsentieren.

Vorbereitung

Bevor Sie beginnen, müssen Sie GMA Next-Gen SDK 0.8.0-alpha01 oder höher haben.

Immer Testanzeigen verwenden

Verwenden Sie beim Entwickeln und Testen Ihrer Apps Testanzeigen anstelle von Live-Anzeigen. Wenn Sie keine Testanzeigen verwenden, kann Ihr Konto gesperrt werden.

Verwenden Sie entweder Ihre Anzeigenblöcke und aktivieren Sie Testgeräte, um Testanzeigen zu erhalten, oder die folgende spezielle Test-Anzeigenblock-ID für Android-Symbolanzeigen:

ca-app-pub-3940256099942544/1476272466
Weitere Informationen zu GMA Next-Gen SDK-Testanzeigen finden Sie unter Testanzeigen aktivieren.

Symbolanzeige laden

Laden Sie eine Symbolanzeige mit Ihrer Symbolanzeigenanfrage und verarbeiten Sie Ereignisse zum Laden von Anzeigen:

Kotlin

private fun loadIconAd() {
  val request =
    IconAdRequest.Builder(AD_UNIT_ID)
      // The "AdChoices" badge is rendered at the top right corner of the icon ad
      // if left unspecified.
      .setAdChoicesPlacement(AdChoicesPlacement.BOTTOM_RIGHT)
      // It is recommended to specify the placement of your icon ad
      // to help Google optimize your icon ad performance.
      .setIconAdPlacement(IconAdPlacement.BROWSER)
      .build()

  IconAd.load(
    request,
    object : AdLoadCallback<IconAd> {
      override fun onAdFailedToLoad(adError: LoadAdError) {
        Log.w(Constant.TAG, "Icon ad failed to load: $adError")
        showToast("Icon ad failed to load.")
      }

      override fun onAdLoaded(ad: IconAd) {
        Log.d(Constant.TAG, "Icon ad loaded")
        // Always call destroy() on ads on removal.
        iconAd?.destroy()
        iconAd = ad
        setAdEventCallback(ad)
        displayIconAd(ad)
      }
    },
  )
}

Java

private void loadIconAd() {
  IconAdRequest request =
      new IconAdRequest.Builder(AD_UNIT_ID)
          // The "AdChoices" badge is rendered at the top right corner of the icon ad
          // if left unspecified.
          .setAdChoicesPlacement(AdChoicesPlacement.BOTTOM_RIGHT)
          // It is recommended to specify the placement of your icon ad
          // to help Google optimize your icon ad performance.
          .setIconAdPlacement(IconAdPlacement.BROWSER)
          .build();

  IconAd.load(
      request,
      new AdLoadCallback<IconAd>() {
        @Override
        public void onAdFailedToLoad(@NonNull LoadAdError adError) {
          Log.w(Constant.TAG, "Icon ad failed to load :" + adError);
          showToast("Icon ad failed to load with error code: " + adError.getCode());
        }

        @Override
        public void onAdLoaded(@NonNull IconAd ad) {
          Log.d(Constant.TAG, "Icon ad loaded.");

          // Always call destroy() on ads on removal.
          if (iconAd != null) {
              iconAd.destroy();
          }
          iconAd = ad;
          setAdEventCallback(ad);
          displayIconAd(ad);
        }
      });
}

Symbolanzeigenansicht erstellen

Bei Symbolanzeigen muss IconAdView als Stammelement für die Assets verwendet werden. Platzieren Sie alle visuellen Elemente für Ihre Anzeige im Darstellungsbereich der Symbolanzeige.

Das folgende Beispiel zeigt ein Layout zum Erstellen einer Ansicht für eine Symbolanzeige:

<?xml version="1.0" encoding="utf-8"?>
<com.google.android.libraries.ads.mobile.sdk.iconad.IconAdView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

  <LinearLayout
      android:id="@+id/icon_ad_container"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_gravity="center"
      android:background="#00FFC107"
      android:orientation="vertical">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
      <TextView
          android:id="@+id/ad_badge"
          android:width="15dp"
          android:height="15dp"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:background="#FFC107"
          android:text="Ad"
          android:textColor="#FFFFFF"
          android:textSize="12sp" />
      <TextView
          android:id="@+id/ad_headline"
          android:textStyle="normal"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_gravity="center"
          android:autoText="true"
          android:inputType="text|textMultiLine"
          android:textColor="#808080"
          android:textSize="12sp" />
    </LinearLayout>

    <com.google.android.material.imageview.ShapeableImageView xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/ad_icon"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_gravity="center"
        android:adjustViewBounds="true"
        android:background="@android:color/holo_green_light"
        android:contentDescription="@string/content_description_icon_ad"
        android:theme="@style/Theme.AppCompat.Light"
        app:shapeAppearanceOverlay="@style/roundedCorners"
        app:strokeColor="@null" />

    <RatingBar
        android:id="@+id/ad_stars"
        style="?android:attr/ratingBarStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:isIndicator="true"
        android:numStars="5"
        android:stepSize="0.5" />
    <Button
        android:id="@+id/ad_call_to_action"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:gravity="center"
        android:textSize="12sp" />
  </LinearLayout>

</com.google.android.libraries.ads.mobile.sdk.iconad.IconAdView>

Symbolanzeige auf dem Bildschirm anzeigen

So zeigen Sie die Symbolanzeige auf einem Bildschirm an:

  1. Blähen Sie die Symbolanzeige auf und fügen Sie sie der Ansichtshierarchie hinzu.

  2. Fügen Sie in jede untergeordnete Ansicht das entsprechende Symbol-Anzeigen-Asset ein.

Im folgenden Beispiel werden die vorherigen Schritte zum Anzeigen der Symbolanzeige auf dem Bildschirm behandelt:

Kotlin

val iconAdViewBinding = IconAdBinding.inflate(layoutInflater)
// Add the ad view to the active view hierarchy.
binding.iconAdContainer.addView(iconAdViewBinding.root)
val iconAdView = iconAdViewBinding.root

// Populate the view elements with their respective icon ad asset.
iconAdView.callToActionView = iconAdViewBinding.adCallToAction
iconAdView.headlineView = iconAdViewBinding.adHeadline
iconAdView.iconView = iconAdViewBinding.adIcon
iconAdView.starRatingView = iconAdViewBinding.adStars

Java

IconAdBinding iconAdViewBinding = IconAdBinding.inflate(getLayoutInflater());
// Add the ad view to the active view hierarchy.
binding.iconAdContainer.addView(iconAdViewBinding.getRoot());
IconAdView iconAdView = iconAdViewBinding.getRoot();

// Populate the view elements with their respective icon ad asset.
iconAdView.setCallToActionView(iconAdViewBinding.adCallToAction);
iconAdView.setHeadlineView(iconAdViewBinding.adHeadline);
iconAdView.setIconView(iconAdViewBinding.adIcon);
iconAdView.setStarRatingView(iconAdViewBinding.adStars);

Symbolanzeige anklickbar machen

Mit GMA Next-Gen SDK werden Klick-Listener für jede Asset-Ansicht registriert, die zugeordnet wird, wenn registerIconAd() aufgerufen wird. Ordnen Sie die Eigenschaften der Symbolanzeige der entsprechenden Ansicht in Ihrer Ansichtshierarchie zu, bevor Sie die Symbolanzeige registrieren:

Kotlin

// Map each asset view property to the corresponding view in your view hierarchy.
iconAdViewBinding.adCallToAction.text = iconAd.callToAction
iconAdViewBinding.adHeadline.text = iconAd.headline
iconAdViewBinding.adIcon.setImageDrawable(iconAd.icon.drawable)
iconAd.starRating?.toFloat().also { value ->
  if (value != null) {
    iconAdViewBinding.adStars.rating = value
  }
}

// Register the icon ad with the view presenting it.
iconAdView.registerIconAd(iconAd)

Java

// Map each asset view property to the corresponding view in your view hierarchy.
iconAdViewBinding.adCallToAction.setText(iconAd.getCallToAction());
iconAdViewBinding.adHeadline.setText(iconAd.getHeadline());
iconAdViewBinding.adIcon.setImageDrawable(iconAd.getIcon().getDrawable());

if (iconAd.getStarRating() != null) {
  iconAdViewBinding.adStars.setRating(iconAd.getStarRating().floatValue());
}

// Register the icon ad with the view presenting it.
iconAdView.registerIconAd(iconAd);

Optional: Callback für das Ereignis „Symbolanzeige“ festlegen

So legen Sie den Event-Callback für die Verarbeitung von Lebenszyklusereignissen für Symbolanzeigen fest:

Kotlin

iconAd.adEventCallback =
  object : IconAdEventCallback {
    override fun onAdShowedFullScreenContent() {
      // Icon ad showed full screen content.
    }

    override fun onAdDismissedFullScreenContent() {
      // Icon ad dismissed full screen content.
    }

    override fun onAdFailedToShowFullScreenContent(
      fullScreenContentError: FullScreenContentError
    ) {
      // Icon ad failed to show full screen content.
    }

    override fun onAdImpression() {
      // Icon ad recorded an impression.
    }

    override fun onAdClicked() {
      // Icon ad recorded a click.
    }

    override fun onAdPaid(value: AdValue) {
      // Icon ad estimated to have earned money.
    }
  }

Java

iconAd.setAdEventCallback(
    new IconAdEventCallback() {
      @Override
      public void onAdShowedFullScreenContent() {
        // Icon ad showed full screen content.
      }

      @Override
      public void onAdDismissedFullScreenContent() {
        // Icon ad dismissed full screen content.
      }

      @Override
      public void onAdFailedToShowFullScreenContent(
          @NonNull FullScreenContentError fullScreenContentError) {
        // Icon ad failed to show full screen content.
      }

      @Override
      public void onAdImpression() {
        // Icon ad recorded an impression.
      }

      @Override
      public void onAdClicked() {
        // Icon ad recorded a click.
      }

      @Override
      public void onAdPaid(@NonNull AdValue value) {
        // Icon ad estimated to have earned money.
      }
    });

Leistung optimieren

In den folgenden Abschnitten werden optionale Implementierungsschritte zur Optimierung der Leistung von Symbolanzeigen beschrieben.

Correlator zum Laden mehrerer Anzeigen verwenden

Wenn Sie mehrere Symbolanzeigen laden, die zusammen präsentiert werden sollen, müssen Sie sequenzielle Anfragen mit demselben Korrelatorwert senden, damit die geladenen Anzeigen eindeutig sind. Die Lebensdauer des Korrelators beträgt 10 Sekunden. Anfragen, die in einem Abstand von mehr als 10 Sekunden gestellt werden, werden vom Server nicht als korreliert betrachtet.

Im folgenden Beispiel wird gezeigt, wie Sie einen Korrelatorwert für die Anzeigenanfrage festlegen:

Kotlin

val correlator = Correlator.generateCorrelator()
val request =
      IconAdRequest.Builder("ca-app-pub-3940256099942544/1476272466")
        .setCorrelator(correlator)
        .build()

Java

Correlator correlator = Correlator.generateCorrelator();
IconAdRequest request =
    new IconAdRequest.Builder("ca-app-pub-3940256099942544/1476272466")
        .setCorrelator(correlator)
        .build();

Symbol-Placement festlegen

Damit Google die Platzierung Ihrer Symbolanzeigen besser nachvollziehen und die Leistung optimieren kann, sollten Sie bei der Anfrage angeben, wo Sie die Symbolanzeigen präsentieren möchten.

Verwenden Sie den IconAdPlacement-Enum-Wert, der Ihrem Anwendungsfall am ehesten entspricht:

Kotlin

val request =
  IconAdRequest.Builder("ca-app-pub-3940256099942544/1476272466")
    .setIconAdPlacement(IconAdPlacement.BROWSER)
    .build()

Java

IconAdRequest request =
    new IconAdRequest.Builder("ca-app-pub-3940256099942544/1476272466")
        .setIconAdPlacement(IconAdPlacement.BROWSER)
        .build();