Yerel gelişmiş

Sistem tanımlı bir yerel reklam biçimi görüntüleme

Yerel bir reklam yüklendiğinde, uygulamanız GADAdLoaderDelegate protokol mesajlarından biri aracılığıyla yerel bir reklam nesnesi alır. Uygulamanız bu durumda reklamı görüntülemekten sorumludur (ancak bunu hemen yapması gerekmez). Sistem tanımlı reklam biçimlerinin görüntülenmesini kolaylaştırmak için SDK, bazı yararlı kaynaklar sunar.

Önemli Nokta: Yerel Reklamlar Başucu Kitabımızda yerel reklamlar hakkında daha fazla bilgi edinin. Ayrıca, Yerel reklam politikalarını ve yönergelerini inceleyininceleyin.

GADNatifReklam Görünümü

GADNativeAd için karşılık gelen bir "reklam görünümü" sınıfı vardır: GADNativeAdView . Bu reklam görüntüleme sınıfı, yayıncıların reklamı görüntülemek için kullanması gereken bir UIView . Örneğin, tek bir GADNativeAdView , tek bir GADNativeAd örneğini görüntüleyebilir. Bu reklamın varlıklarını görüntülemek için kullanılan UIView nesnelerinin her biri, o GADNativeAdView nesnesinin alt görünümleri olmalıdır.

Örneğin, bir UITableView bir reklam gösteriyorsanız, hücrelerden birinin görünüm hiyerarşisi şöyle görünebilir:

GADNativeAdView sınıfı ayrıca her bir bağımsız varlık için kullanılan görünümü kaydetmek için kullanılan IBOutlets ve GADNativeAd nesnesinin kendisini kaydetmek için bir yöntem sağlar. Görünümlerin bu şekilde kaydedilmesi, SDK'nın aşağıdakiler gibi görevleri otomatik olarak işlemesine olanak tanır:

• Tıklamaları kaydetme.
• Gösterimleri kaydetme (ilk piksel ekranda göründüğünde).
• Reklam Seçenekleri yer paylaşımını görüntüleme.

Reklam Seçenekleri yer paylaşımı

Dolaylı yerel reklamlar için ( AdMobdolgu yoluyla veya Ad Exchange veya AdSense aracılığıyla sunulur), SDK tarafından bir AdChoices yer paylaşımı eklenir. Lütfen otomatik olarak eklenen Reklam Seçenekleri logosu için yerel reklam görünümünüzün tercih ettiğiniz köşesinde boşluk bırakın. Ayrıca, Reklam Seçenekleri yer paylaşımının, simgenin kolayca görülebilmesini sağlayan içeriğe yerleştirildiğinden emin olun. Yer paylaşımının görünümü ve işlevi hakkında daha fazla bilgi için programatik yerel reklam uygulama yönergelerine bakın.

reklam ilişkilendirme

Programatik yerel reklamları görüntülerken, görünümün bir reklam olduğunu belirtmek için bir reklam ilişkilendirmesi göstermelisiniz.

Kod örneği

Şimdi, xib dosyalarından dinamik olarak yüklenen görünümleri kullanarak yerel reklamların nasıl görüntüleneceğine bir göz atalım. Bu, birden çok biçim istemek üzere yapılandırılmış GADAdLoaders kullanırken çok yararlı bir yaklaşım olabilir.

UIView'ları Yerleştirme

İlk adım, yerel reklam varlıklarını görüntüleyecek UIViews düzenlemektir. Bunu, başka bir xib dosyası oluştururken yaptığınız gibi Arayüz Oluşturucu'da yapabilirsiniz. Yerel bir reklamın düzeni şu şekilde görünebilir:

Resmin sağ üst köşesindeki Özel Sınıf değerini not edin. olarak ayarlandı

GADNativeAdView . Bu, bir GADNativeAd görüntülemek için kullanılan reklam görüntüleme sınıfıdır.

Ayrıca, reklam için videoyu veya resmi görüntülemek için kullanılan GADMediaView için özel sınıf ayarlamanız gerekir.

Çıkışları görünümlere bağlama

Görünümler yerleştirildikten ve düzene doğru reklam görünümü sınıfını atadıktan sonra, reklam görünümünün varlık çıkışlarını oluşturduğunuz UIViews . Reklam görünümünün varlık çıkışlarını bir reklam için oluşturulan UIViews şu şekilde bağlayabilirsiniz:

Çıkış panelinde, UIViews GADNativeAdView . Bu, SDK'nın hangi UIView hangi varlığı görüntülediğini bilmesini sağlar. Bu satış noktalarının reklamda tıklanabilir görünümleri temsil ettiğini de unutmamak önemlidir.

Reklamın görüntülenmesi

Düzen tamamlandıktan ve çıkışlar bağlandıktan sonra, son adım, yüklendikten sonra bir reklam görüntüleyen uygulamanıza kod eklemektir. Bir reklamı yukarıda tanımlanan görünümde görüntülemek için bir yöntem:

Süratli

// 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
}

Amaç-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;
}

Not: Gördüğünüz gibi, yukarıdaki kod örneği, harekete geçirici mesajı görüntüleyen UIButton için kullanıcı etkileşimini devre dışı bırakır. Yerel reklam öğelerini görüntülemek için UIButtons kullanıyorsanız, Google Mobile Ads SDK'sının kullanıcı arayüzü olaylarını düzgün bir şekilde alabilmesi ve işleyebilmesi için bunların kullanıcı etkileşimini de devre dışı bırakmanız gerekir. Bu ekstra adım nedeniyle, UIButtons'tan tamamen kaçınmak ve bunun yerine UILabel ve UIImageView kullanmak genellikle en iyisidir.

GitHub depomuz, hem Swift hem de Objective-C ile yazılmışYerel Gelişmiş reklamlar için eksiksiz uygulamalara sahiptir.

Yerel Gelişmiş Örneği İndirin

GADMediaView

Önemli Nokta: Yerel reklamınızın düzenine bir ana resim varlığı eklemek istiyorsanız, UIImageView varlığı yerine GADMediaView varlığını kullanmanız gerekir.

Görüntü ve video varlıkları, kullanıcılara GADMediaView aracılığıyla gösterilir. Bu, bir xib dosyasında tanımlanabilen veya dinamik olarak oluşturulabilen bir UIView . Diğer varlık görünümlerinde olduğu gibi, bir GADNativeAdView görünüm hiyerarşisi içine yerleştirilmelidir.

Tüm varlık görünümlerinde olduğu gibi, medya görünümünün içeriğinin doldurulması gerekir. Bu, GADMediaView üzerindeki mediaContent özelliği kullanılarak GADMediaView . mediaContent özelliği, bir GADNativeAd GADMediaView medya içeriği içerir.

İşte,Yerel Gelişmiş örneğinden ( Swift | Objective-C ), GADNativeAd GADMediaContent GADMediaView reklam varlıklarıyla nasıl doldurulacağını gösterir. :

Süratli

nativeAdView.mediaView?.mediaContent = nativeAd.mediaContent

Amaç-C

nativeAdView.mediaView.mediaContent = nativeAd.mediaContent;

Yerel reklam görünümünüz için arayüz oluşturucu dosyanızda, görünümler özel sınıfının GADMediaView olarak ayarlandığından ve bunu mediaView çıkışına bağladığınızdan emin olun.

Görüntü İçeriği Modunu Değiştirme

GADMediaView sınıfı, görüntüleri görüntülerken UIView contentMode özelliğine uyar. GADMediaView bir görüntünün nasıl ölçeklendirileceğini değiştirmek istiyorsanız, bunu başarmak için GADMediaView contentMode karşılık gelen UIViewContentMode ayarlayın.

Örneğin, bir resim görüntülendiğinde (reklamda video yokken) GADMediaView doldurmak için:

Süratli

nativeAdView.mediaView?.contentMode = .aspectFill

Amaç-C

nativeAdView.mediaView.contentMode = UIViewContentModeAspectFill;

GADMedya İçeriği

GADMediaContent sınıfı, GADMediaView sınıfı kullanılarak görüntülenen yerel reklamın medya içeriğiyle ilgili verileri tutar. GADMediaView mediaContent özelliğinde ayarlandığında:

• Bir video varlığı varsa, arabelleğe alınır ve GADMediaView içinde oynatılmaya başlar. hasVideoContent kontrol ederek bir video öğesinin kullanılabilir olup olmadığını anlayabilirsiniz.

• Reklam bir video öğesi içermiyorsa mainImage öğesi indirilir ve bunun yerine GADMediaView içine yerleştirilir.

Önemli Nokta: Varsayılan olarak mainImage , indirilen ilk görüntü varlığıdır. mainImage disableImageLoading nil bu özelliği manuel olarak indirdiğiniz görüntüye ayarlamanız gerekir. Bu görüntünün yalnızca kullanılabilir video varlığı olmadığında kullanılacağını unutmayın .