Erweiterte native Anzeigen

Systemdefiniertes natives Anzeigenformat ausliefern

Beim Laden einer nativen Anzeige empfängt Ihre App ein natives Anzeigenobjekt über eine der GADAdLoaderDelegate-Protokollmeldungen. Ihre App ist dann für die Auslieferung der Anzeige verantwortlich. Dies muss jedoch nicht sofort geschehen. Das SDK enthält einige nützliche Ressourcen, um die Auslieferung systemdefinierter Anzeigenformate zu erleichtern.

Wichtig: Informationen zum Rendern nativer Anzeigen finden Sie in den Richtlinien für native Anzeigen .

GADNativeAdView

Für GADNativeAd gibt es eine entsprechende Anzeigenansichtsklasse: GADNativeAdView. Diese Anzeigenansichtsklasse ist eine UIView, die Publisher zum Ausliefern der Anzeige verwenden sollten. Ein einzelnes GADNativeAdView kann beispielsweise eine einzelne Instanz einer GADNativeAd anzeigen. Jedes UIView-Objekt, das zur Auslieferung der Assets dieser Anzeige verwendet wird, sollte Unteransichten dieses GADNativeAdView-Objekts sein.

Wenn Sie beispielsweise eine Anzeige in einer UITableView ausliefern, könnte die Ansichtshierarchie für eine der Zellen so aussehen:

Die Klasse GADNativeAdView bietet außerdem IBOutlets, mit dem die für jedes einzelne Asset verwendete Ansicht registriert wird, sowie eine Methode zum Registrieren des GADNativeAd-Objekts selbst. Wenn die Ansichten auf diese Weise registriert werden, kann das SDK unter anderem die folgenden Aufgaben automatisch ausführen:

• Klicks werden erfasst.
• Impressionen werden erfasst, wenn das erste Pixel auf dem Bildschirm sichtbar ist.
• Anzeigenauswahl-Overlay

Datenschutzinfo-Overlay

Bei indirekten nativen Anzeigen, die über Ad Manager Backfill, Ad Exchange oder AdSense ausgeliefert werden, wird vom SDK ein Datenschutzinfo-Overlay hinzugefügt. Lassen Sie in der bevorzugten Ecke Ihrer nativen Anzeigenansicht Platz für das automatisch eingefügte Datenschutzinfo-Logo. Außerdem muss das Datenschutzinfo-Overlay auf Inhalten platziert werden, in denen das Symbol gut zu sehen ist. Weitere Informationen zu Darstellung und Funktion des Overlays finden Sie in den Implementierungsrichtlinien für programmatische native Anzeigen.

Hinweis :Datenschutzinfos werden für direkt verkaufte Anzeigen nur im EWR angezeigt.

Anzeigenattribution für programmatische native Anzeigen

Bei der Auslieferung programmatischer nativer Anzeigen muss eine Anzeigenkennzeichnung eingeblendet werden, um darauf hinzuweisen, dass es sich um eine Anzeige handelt. Die Richtlinien finden Sie auf dieser Seite.

Codebeispiel

Sehen wir uns an, wie native Anzeigen mit Ansichten ausgeliefert werden, die dynamisch aus xib-Dateien geladen werden. Dies kann ein sehr nützlicher Ansatz sein, wenn Sie GADAdLoaders verwenden, das für die Anforderung mehrerer Formate konfiguriert ist.

Layout der UIViews

Zuerst muss das Layout der UIViews definiert werden, auf der die Assets nativer Anzeigen erscheinen sollen. Sie können dies im Interface Builder genauso tun wie beim Erstellen jeder anderen xib-Datei. So könnte das Layout einer nativen Anzeige aussehen:

Oben rechts im Bild sehen Sie den Wert für die benutzerdefinierte Klasse. Er ist auf

GADNativeAdView: Dies ist die Anzeigenansichtsklasse, mit der ein GADNativeAd-Element ausgeliefert wird.

Außerdem müssen Sie die benutzerdefinierte Klasse für GADMediaView festlegen, mit der das Video oder Bild für die Anzeige eingeblendet wird.

Outlets mit Datenansichten verknüpfen

Sobald die Ansichten vorhanden sind und Sie dem Layout die richtige Anzeigenansichtsklasse zugewiesen haben, verknüpfen Sie die Asset-Outlets der Anzeigenansicht mit der von Ihnen erstellten UIViews. So können Sie die Asset-Outlets der Anzeigenansicht mit dem UIViews verknüpfen, der für eine Anzeige erstellt wurde:

Im Steckdosenfeld wurden die Steckdosen in GADNativeAdView mit dem UIViews im Interface Builder verknüpft. Dadurch weiß das SDK, welches UIView welches Asset ausliefert. Diese Outlets repräsentieren die Ansichten, auf die in der Anzeige geklickt werden kann.

Anzeige einblenden

Tipp :Native Anzeigen mit SwiftUI präsentieren

Sobald das Layout fertig ist und die Outlets verknüpft sind, besteht der letzte Schritt darin, Ihrer App Code hinzuzufügen, mit dem eine Anzeige nach dem Laden ausgeliefert wird. Hier ist eine Methode zum Einblenden einer Anzeige in der oben definierten Ansicht:

Swift

// Mark: - GADNativeAdLoaderDelegate
func adLoader(_ adLoader: GADAdLoader, didReceive nativeAd: GADNativeAd) {
  print("Received native ad: \(nativeAd)")
  refreshAdButton.isEnabled = true
  // Create and place ad in view hierarchy.
  let nibView = Bundle.main.loadNibNamed("NativeAdView", owner: nil, options: nil)?.first
  guard let nativeAdView = nibView as? GADNativeAdView else {
    return
  }
  setAdView(nativeAdView)

  // Set ourselves as the native ad delegate to be notified of native ad events.
  nativeAd.delegate = self

  // Populate the native ad view with the native ad assets.
  // The headline and mediaContent are guaranteed to be present in every native ad.
  (nativeAdView.headlineView as? UILabel)?.text = nativeAd.headline
  nativeAdView.mediaView?.mediaContent = nativeAd.mediaContent

  // This app uses a fixed width for the GADMediaView and changes its height to match the aspect
  // ratio of the media it displays.
  if let mediaView = nativeAdView.mediaView, nativeAd.mediaContent.aspectRatio > 0 {
    let heightConstraint = NSLayoutConstraint(
      item: mediaView,
      attribute: .height,
      relatedBy: .equal,
      toItem: mediaView,
      attribute: .width,
      multiplier: CGFloat(1 / nativeAd.mediaContent.aspectRatio),
      constant: 0)
    heightConstraint.isActive = true
  }

  // These assets are not guaranteed to be present. Check that they are before
  // showing or hiding them.
  (nativeAdView.bodyView as? UILabel)?.text = nativeAd.body
  nativeAdView.bodyView?.isHidden = nativeAd.body == nil

  (nativeAdView.callToActionView as? UIButton)?.setTitle(nativeAd.callToAction, for: .normal)
  nativeAdView.callToActionView?.isHidden = nativeAd.callToAction == nil

  (nativeAdView.iconView as? UIImageView)?.image = nativeAd.icon?.image
  nativeAdView.iconView?.isHidden = nativeAd.icon == nil

  (nativeAdView.starRatingView as? UIImageView)?.image = imageOfStars(
    fromStarRating: nativeAd.starRating)
  nativeAdView.starRatingView?.isHidden = nativeAd.starRating == nil

  (nativeAdView.storeView as? UILabel)?.text = nativeAd.store
  nativeAdView.storeView?.isHidden = nativeAd.store == nil

  (nativeAdView.priceView as? UILabel)?.text = nativeAd.price
  nativeAdView.priceView?.isHidden = nativeAd.price == nil

  (nativeAdView.advertiserView as? UILabel)?.text = nativeAd.advertiser
  nativeAdView.advertiserView?.isHidden = nativeAd.advertiser == nil

  // In order for the SDK to process touch events properly, user interaction should be disabled.
  nativeAdView.callToActionView?.isUserInteractionEnabled = false

  // Associate the native ad view with the native ad object. This is
  // required to make the ad clickable.
  // Note: this should always be done after populating the ad views.
  nativeAdView.nativeAd = nativeAd
}

Objective-C

#pragma mark GADNativeAdLoaderDelegate implementation

- (void)adLoader:(GADAdLoader *)adLoader didReceiveNativeAd:(GADNativeAd *)nativeAd {
  NSLog(@"Received native ad: %@", nativeAd);
  self.refreshButton.enabled = YES;

  // Create and place ad in view hierarchy.
  GADNativeAdView *nativeAdView =
      [[NSBundle mainBundle] loadNibNamed:@"NativeAdView" owner:nil options:nil].firstObject;
  [self setAdView:nativeAdView];

  // Set the mediaContent on the GADMediaView to populate it with available
  // video/image asset.
  nativeAdView.mediaView.mediaContent = nativeAd.mediaContent;

  // Populate the native ad view with the native ad assets.
  // The headline is guaranteed to be present in every native ad.
  ((UILabel *)nativeAdView.headlineView).text = nativeAd.headline;

  // These assets are not guaranteed to be present. Check that they are before
  // showing or hiding them.
  ((UILabel *)nativeAdView.bodyView).text = nativeAd.body;
  nativeAdView.bodyView.hidden = nativeAd.body ? NO : YES;

  [((UIButton *)nativeAdView.callToActionView)setTitle:nativeAd.callToAction
                                              forState:UIControlStateNormal];
  nativeAdView.callToActionView.hidden = nativeAd.callToAction ? NO : YES;

    ((UIImageView *)nativeAdView.iconView).image = nativeAd.icon.image;
  nativeAdView.iconView.hidden = nativeAd.icon ? NO : YES;

  ((UIImageView *)nativeAdView.starRatingView).image = [self imageForStars:nativeAd.starRating];
  nativeAdView.starRatingView.hidden = nativeAd.starRating ? NO : YES;

  ((UILabel *)nativeAdView.storeView).text = nativeAd.store;
  nativeAdView.storeView.hidden = nativeAd.store ? NO : YES;

  ((UILabel *)nativeAdView.priceView).text = nativeAd.price;
  nativeAdView.priceView.hidden = nativeAd.price ? NO : YES;

  ((UILabel *)nativeAdView.advertiserView).text = nativeAd.advertiser;
  nativeAdView.advertiserView.hidden = nativeAd.advertiser ? NO : YES;

  // In order for the SDK to process touch events properly, user interaction
  // should be disabled.
  nativeAdView.callToActionView.userInteractionEnabled = NO;

  // Associate the native ad view with the native ad object. This is
  // required to make the ad clickable.
  nativeAdView.nativeAd = nativeAd;
}

Hinweis :Wie Sie sehen, wird im obigen Codebeispiel die Nutzerinteraktion für die UIButton deaktiviert, die den Call-to-Action anzeigt. Wenn Sie native Anzeigen-Assets mit UIButtons darstellen, müssen Sie auch deren Nutzerinteraktion deaktivieren, damit das Google Mobile Ads SDK UI-Ereignisse richtig empfangen und verarbeiten kann. Aufgrund dieses zusätzlichen Schritts empfiehlt es sich häufig, UIButtons komplett zu vermeiden und stattdessen UILabel und UIImageView zu verwenden.

Unser GitHub-Repository enthält die vollständigen Implementierungen für natives benutzerdefiniertes Rendering , die in Swift und Objective-C geschrieben sind.

Beispiel für benutzerdefiniertes Google Ad Manager-Rendering herunterladen

GADMediaView

Wichtiger Hinweis :Wenn Sie in das Layout Ihrer nativen Anzeige ein Hauptbild-Asset einbinden möchten, müssen Sie das GADMediaView-Asset anstelle des UIImageView-Assets verwenden.

Bild- und Video-Assets werden Nutzern über GADMediaView angezeigt. Dies ist ein UIView, der in einer xib-Datei definiert oder dynamisch erstellt werden kann. Sie sollte wie jede andere Asset-Ansicht innerhalb der Ansichtshierarchie eines GADNativeAdView platziert werden.

Wie bei allen Asset-Ansichten muss der Inhalt der Medienansicht dargestellt werden. Dazu wird das Attribut mediaContent für GADMediaView verwendet. Das Attribut mediaContent von GADNativeAd enthält Medieninhalte, die an eine GADMediaView übergeben werden können.

Hier ist ein Snippet aus dem Beispiel für benutzerdefiniertes Rendering (Swift | Objective-C) aus dem GADMediaView mit den Assets für native Anzeigen aus GADMediaContent von GADNativeAd:

Swift

nativeAdView.mediaView?.mediaContent = nativeAd.mediaContent

Objective-C

nativeAdView.mediaView.mediaContent = nativeAd.mediaContent;

In der UI-Builder-Datei für die native Anzeigenansicht muss die benutzerdefinierte Klasse für die Ansichten auf GADMediaView gesetzt und mit der Steckdose mediaView verbunden sein.

Modus für Bildinhalte ändern

Die Klasse GADMediaView berücksichtigt beim Anzeigen von Bildern das Attribut UIView contentMode. Wenn Sie die Skalierung eines Bildes in GADMediaView ändern möchten, legen Sie dafür im Attribut contentMode von GADMediaView den entsprechenden UIViewContentMode fest.

So füllen Sie beispielsweise GADMediaView aus, wenn ein Bild zu sehen ist (Anzeige enthält kein Video):

Swift

nativeAdView.mediaView?.contentMode = .aspectFill

Objective-C

nativeAdView.mediaView.contentMode = UIViewContentModeAspectFill;

GADMediaContent

Die Klasse GADMediaContent enthält die Daten, die sich auf den Medieninhalt der nativen Anzeige beziehen, der mithilfe der Klasse GADMediaView dargestellt wird. Wird für die Property GADMediaView mediaContent festgelegt:

• Wenn ein Video-Asset verfügbar ist, wird es gepuffert und beginnt mit der Wiedergabe im GADMediaView. Anhand von hasVideoContent können Sie feststellen, ob ein Video-Asset verfügbar ist.

• Wenn die Anzeige kein Video-Asset enthält, wird das mainImage-Asset heruntergeladen und stattdessen innerhalb von GADMediaView platziert.

Wichtiger Hinweis :Standardmäßig ist mainImage das erste heruntergeladene Bild-Asset. Wenn disableImageLoading verwendet wird, ist mainImage der Wert nil und Sie sollten dieses Attribut auf Ihr manuell heruntergeladenes Bild festlegen. Dieses Bild wird nur verwendet, wenn kein Video-Asset verfügbar ist.

Nächste Schritte

Weitere Informationen zum Datenschutz für Nutzer