Yerel gelişmiş

Yerel Reklam Görüntüleyin

Yerel bir reklam yüklendiğinde Google Mobile Ads SDK'sı, ilgili reklam biçimi için işleyiciyi çağırır. Bu durumda reklamı görüntülemekten uygulamanız sorumludur, ancak bu işlemi hemen yapmanız gerekmez. SDK, sistem tanımlı reklam biçimlerinin görüntülenmesini kolaylaştırmak için aşağıda açıklandığı gibi bazı yararlı kaynaklar sunar.

NativeAdView sınıf

NativeAd biçimine karşılık gelen NativeAdView sınıfı vardır. Bu sınıf, yayıncıların NativeAd öğesinin kökü olarak kullanması gereken bir ViewGroup sınıfıdır. Tek bir NativeAdView, tek bir yerel reklama karşılık gelir. Bu reklamın öğelerini görüntülemek için kullanılan her görünüm (ör. ekran görüntüsü öğesini görüntüleyen ImageView), NativeAdView nesnesinin alt öğesi olmalıdır.

Öğe görünümlerini görüntülemek için LinearLayout kullanan bir yerel reklamın görünüm hiyerarşisi şu şekilde görünebilir:

<com.google.android.gms.ads.nativead.NativeAdView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <LinearLayout
    android:orientation="vertical"
    ... >
        <LinearLayout
        android:orientation="horizontal"
        ... >
          <ImageView
           android:id="@+id/ad_app_icon"
           ... />
          <TextView
            android:id="@+id/ad_headline"
            ... />
         </LinearLayout>


         // Other assets such as image or media view, call to action, etc follow.
         ...
    </LinearLayout>
</com.google.android.gms.ads.nativead.NativeAdView>

NativeAdView oluşturan ve NativeAd ile doldurulan bir örneği burada bulabilirsiniz:

Java

AdLoader.Builder builder = new AdLoader.Builder(this, "AD_UNIT_ID")
    .forNativeAd(new NativeAd.OnNativeAdLoadedListener() {
        @Override
        public void onNativeAdLoaded(NativeAd nativeAd) {
            // Assumes you have a placeholder FrameLayout in your View layout
            // (with id fl_adplaceholder) where the ad is to be placed.
            FrameLayout frameLayout =
                findViewById(R.id.fl_adplaceholder);
            // Assumes that your ad layout is in a file call native_ad_layout.xml
            // in the res/layout folder
            NativeAdView adView = (NativeAdView) getLayoutInflater()
                .inflate(R.layout.native_ad_layout, null);
            // This method sets the text, images and the native ad, etc into the ad
            // view.
            populateNativeAdView(nativeAd, adView);
            frameLayout.removeAllViews();
            frameLayout.addView(adView);
        }
});

Kotlin

val builder = AdLoader.Builder(this, "AD_UNIT_ID")
    .forNativeAd { nativeAd ->
        // Assumes that your ad layout is in a file call native_ad_layout.xml
        // in the res/layout folder
        val adView = layoutInflater
                .inflate(R.layout.native_ad_layout, null) as NativeAdView
        // This method sets the text, images and the native ad, etc into the ad
        // view.
        populateNativeAdView(nativeAd, adView)
        // Assumes you have a placeholder FrameLayout in your View layout
        // (with id ad_frame) where the ad is to be placed.
        ad_frame.removeAllViews()
        ad_frame.addView(adView)
    }

Belirli bir yerel reklama ilişkin tüm öğelerin NativeAdView düzeni içinde oluşturulması gerektiğini unutmayın. Google Mobile Ads SDK'sı, yerel öğeler yerel reklam görüntüleme düzeninin dışında oluşturulduğunda uyarı kaydetmeye çalışır.

Reklam görüntüleme sınıfları, her bir öğe için kullanılan görünümü ve NativeAd nesnesinin kendisini kaydetmek için kullanılan yöntemleri de sağlar. Görünümlerin bu şekilde kaydedilmesi, SDK'nın aşağıdakilere benzer görevleri otomatik olarak gerçekleştirmesini sağlar:

  • Tıklamalar kaydediliyor
  • İlk piksel ekranda göründüğünde gösterimleri kaydetme
  • Yerel dolgu reklam öğeleri için Reklam Seçenekleri yer paylaşımı gösteriliyor (şu anda belirli bir yayıncı grubuyla sınırlı)

Reklam Seçenekleri yer paylaşımı

Bir Reklam Seçenekleri yer paylaşımı, dolgu reklam döndürüldüğünde SDK tarafından reklam görüntüleme olarak eklenir. Uygulamanızda yerel reklam dolgusu kullanılıyorsa 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 kolayca görülebilmesi de önemlidir. Bu nedenle, arka plan renklerini ve resimlerini uygun şekilde seçin. Yer paylaşımının görünümü ve işlevi hakkında daha fazla bilgi için programatik yerel reklam uygulama yönergelerini inceleyin.

Programatik yerel reklamlar için reklam ilişkilendirmesi

Programatik yerel reklamları gösterirken, görünümün bir reklam olduğunu belirtmek için bir reklam ilişkilendirmesi göstermeniz gerekir. Daha fazla bilgi için politika yönergelerimizi inceleyin.

Kod örneği

Yerel reklam görüntüleme adımları şunlardır:

  1. NativeAdView sınıfının bir örneğini oluşturun.
  2. Gösterilecek her reklam öğesi için:
    1. Öğe görünümünü, reklam nesnesindeki öğeyle doldurun.
    2. Öğe görünümünü ViewGroup sınıfıyla kaydedin.
  3. Yerel reklam düzeniniz büyük bir medya öğesi içeriyorsa MediaView etiketini kaydedin.
  4. Reklam nesnesini ViewGroup sınıfıyla kaydedin.

Burada, NativeAd görüntüleyen bir örnek işlev görebilirsiniz:

Java

private void displayNativeAd(ViewGroup parent, NativeAd ad) {

    // Inflate a layout and add it to the parent ViewGroup.
    LayoutInflater inflater = (LayoutInflater) parent.getContext()
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    NativeAdView adView = (NativeAdView) inflater
            .inflate(R.layout.ad_layout_file, parent);

    // Locate the view that will hold the headline, set its text, and call the
    // NativeAdView's setHeadlineView method to register it.
    TextView headlineView = adView.findViewById<TextView>(R.id.ad_headline);
    headlineView.setText(ad.getHeadline());
    adView.setHeadlineView(headlineView);

    ...
    // Repeat the above process for the other assets in the NativeAd
    // using additional view objects (Buttons, ImageViews, etc).
    ...

    // If the app is using a MediaView, it should be
    // instantiated and passed to setMediaView. This view is a little different
    // in that the asset is populated automatically, so there's one less step.
    MediaView mediaView = (MediaView) adView.findViewById(R.id.ad_media);
    adView.setMediaView(mediaView);

    // Call the NativeAdView's setNativeAd method to register the
    // NativeAdObject.
    adView.setNativeAd(ad);

    // Ensure that the parent view doesn't already contain an ad view.
    parent.removeAllViews();

    // Place the AdView into the parent.
    parent.addView(adView);
}

Kotlin

fun displayNativeAd(parent: ViewGroup, ad: NativeAd) {

    // Inflate a layout and add it to the parent ViewGroup.
    val inflater = parent.getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE)
            as LayoutInflater
    val adView = inflater.inflate(R.layout.ad_layout_file, parent) as NativeAdView

    // Locate the view that will hold the headline, set its text, and use the
    // NativeAdView's headlineView property to register it.
    val headlineView = adView.findViewById<TextView>(R.id.ad_headline)
    headlineView.text = ad.headline
    adView.headlineView = headlineView

    ...
    // Repeat the above process for the other assets in the NativeAd using
    // additional view objects (Buttons, ImageViews, etc).
    ...

    val mediaView = adView.findViewById<MediaView>(R.id.ad_media)
    adView.mediaView = mediaView

    // Call the NativeAdView's setNativeAd method to register the
    // NativeAdObject.
    adView.setNativeAd(ad)

    // Ensure that the parent view doesn't already contain an ad view.
    parent.removeAllViews()

    // Place the AdView into the parent.
    parent.addView(adView)
}

Bağımsız görevler şunlardır:

  1. Düzeni şişirme

    Java

    LayoutInflater inflater = (LayoutInflater) parent.getContext()
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    NativeAdView adView = (NativeAdView) inflater
            .inflate(R.layout.ad_layout_file, parent);
    

    Kotlin

    val inflater = parent.getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE)
            as LayoutInflater
    val adView = inflater.inflate(R.layout.ad_layout_file, parent) as NativeAdView
    

    Bu kod, yerel reklam görüntülemek için görünümler içeren bir XML düzenini şişirir ve ardından NativeAdView referansını bulur. Parçanızda veya etkinliğinizde varsa mevcut bir NativeAdView öğesini yeniden kullanabileceğinizi ve hatta düzen dosyası kullanmadan dinamik olarak örnek oluşturabileceğinizi unutmayın.

  2. Öğe görünümlerini doldurma ve kaydetme

    Bu örnek kod, başlığı görüntülemek için kullanılan görünümü bulur, reklam nesnesi tarafından sağlanan dize öğesini kullanarak başlık metnini ayarlar ve NativeAdView nesnesiyle kaydeder:

    Java

    TextView headlineView = adView.findViewById<TextView>(R.id.ad_headline);
    headlineView.setText(ad.getHeadline());
    adView.setHeadlineView(headlineView);
    

    Kotlin

    val headlineView = adView.findViewById<TextView>(R.id.ad_headline)
    headlineView.text = ad.headline
    adView.headlineView = headlineView
    

    Görünümü bulma, değerini ayarlama ve reklam görüntüleme sınıfına kaydetme süreci, uygulamanın göstereceği yerel reklam nesnesi tarafından sağlanan öğelerin her biri için tekrarlanmalıdır.

  3. Kullanıcıları işleme tıklama sayısı

    Yerel reklam görünümü üzerindeki veya içindeki tüm görünümlerde, özel tıklama işleyiciler uygulamayın. Tıklama etkinliklerini kendiniz gözlemlemek için reklam işleyiciyi kullanın.

    Reklam görüntüleme öğelerine yapılan tıklamalar, bir önceki bölümde açıklandığı gibi öğe görünümlerini doğru şekilde doldurup kaydettiğiniz sürece SDK tarafından yönetilir.

    Tıklama etkinliklerini gözlemlemek için reklam işleyicinin kullanıldığı bir örneği burada görebilirsiniz:

    Java

    AdLoader adLoader = new AdLoader.Builder(context, "/6499/example/native")
        ...
        .withAdListener(new AdListener() {
            @Override
            public void onAdFailedToLoad(LoadAdError adError) {
                // Handle the failure by logging, altering the UI, and so on.
            }
            @Override
            public void onAdClicked() {
                // Log the click event or other custom behavior.
            }
        })
        .build();
    

    Kotlin

    val adLoader = AdLoader.Builder(this, "/6499/example/native")
        ...
        .withAdListener(object : AdListener() {
            override fun onAdFailedToLoad(adError: LoadAdError) {
                // Handle the failure by logging, altering the UI, and so on.
            }
        })
        .build()
    
  4. MediaView'u kaydetme

    Yerel reklamınızın düzenine ana resim öğesi eklemek istiyorsanız ImageView öğesi yerine MediaView öğesini kullanmanız gerekir.

    MediaView, ana medya öğesini (video veya resim) göstermek için tasarlanmış özel bir View'dir.

    MediaView, XML düzeninde tanımlanabilir veya dinamik olarak oluşturulabilir. Diğer öğe görünümlerinde olduğu gibi, NativeAdView görünüm hiyerarşisine yerleştirilmelidir. MediaView kullanan uygulamalar bunu NativeAdView ile kaydetmelidir:

    Java

    MediaView mediaView = adView.findViewById(R.id.ad_media);
    adView.setMediaView(mediaView);
    

    Kotlin

    adView.mediaView = adView.findViewById<MediaView>(R.id.ad_media)
    

    Tüm öğe görünümlerinde olduğu gibi, medya görünümünde de içeriğin doldurulması gerekir. Bu işlem, bir MediaView ürününe iletilebilecek medya içeriğini almak için getMediaContent() yöntemi kullanılarak gerçekleştirilir. Burada, medya görünümü için medya içeriğini ayarlayan kod snippet'ini görebilirsiniz:

    Java

    mediaView.setMediaContent(nativeAd.getMediaContent());
    

    Kotlin

    mediaView.mediaContent = nativeAd.mediaContent
    

    ImageScaleType

    MediaView sınıfı, resimleri görüntülerken bir ImageScaleType özelliğine sahiptir. Bir görüntünün MediaView öğesinde ölçeklenme şeklini değiştirmek isterseniz MediaView öğesinin setImageScaleType() yöntemini kullanarak ilgili ImageView.ScaleType değerini ayarlayın:

    Java

    mediaView.setImageScaleType(ImageView.ScaleType.CENTER_CROP);
    

    Kotlin

    mediaView.imageScaleType = ImageView.ScaleType.CENTER_CROP
    

    MediaContent

    MediaContent sınıfı, MediaView sınıfı kullanılarak görüntülenen yerel reklamın medya içeriğiyle ilgili verileri barındırır. MediaView mediaContent özelliği MediaContent örneğiyle ayarlandığında:

    • Video öğesi varsa arabelleğe alınır ve MediaView içinde oynatılmaya başlar. Bir video öğesinin kullanılıp kullanılamadığını hasVideoContent() konumuna bakarak öğrenebilirsiniz.

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

    Varsayılan olarak mainImage, indirilen ilk resim öğesidir. setReturnUrlsForImageAssets(true) kullanılıyorsa mainImage değeri null olur ve mainImage özelliğini manuel olarak indirilen resminize ayarlamanız gerekir. Bu resmin, yalnızca kullanılabilir video öğesi olmadığında kullanılacağını unutmayın.

  5. Yerel reklam nesnesini kaydetme

    Bu son adım, yerel reklam nesnesini, görüntülenmesinden sorumlu görünümle kaydeder:

    Java

    adView.setNativeAd(ad);
    

    Kotlin

    adView.setNativeAd(ad)
    

Reklamı yok et

Yerel reklamınızı gösterdikten sonra, çöplerin düzgün şekilde toplanabilmesi için reklamı kaldırmanız gerekir.

Java

nativeAd.destroy();
        .inflate(R.layout.ad_layout_file, parent);

Kotlin

nativeAd.destroy()

Yerel reklam kodunu test edin

Doğrudan satılan reklamlar

Doğrudan satılan yerel reklamların nasıl olduğunu test etmek istiyorsanız şu Ad Manager reklam birimi kimliğinden yararlanabilirsiniz:

/6499/example/native

Örnek uygulama yükleme ve içerik reklamlarının yanı sıra aşağıdaki öğeleri içeren özel bir yerel reklam biçimi yayınlayacak şekilde yapılandırılır:

  • Başlık (metin)
  • Ana Resim (resim)
  • Başlık (metin)

Özel yerel reklam biçiminin şablon kimliği 10063170 şeklindedir.

Yerel dolgu reklamlar

Ad Exchange dolgusu, şu anda belirli bir yayıncı grubuyla sınırlıdır. Yerel dolgu reklamların davranışını test etmek için şu Ad Manager reklam birimini kullanın:

/6499/example/native-backfill

Reklam Seçenekleri yer paylaşımını içeren örnek uygulama yükleme ve içerik reklamları yayınlar.

Yayınlamadan önce, gerçek reklam birimi ve şablon kimliklerinize referans vermek için kodunuzu güncellemeyi unutmayın.

GitHub'daki örnekler

Doğal reklamların eksiksiz uygulaması örneği:

Java Kotlin

Sonraki adımlar

Aşağıdaki konuları inceleyin: