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:
NativeAdView
sınıfının bir örneğini oluşturun.- Gösterilecek her reklam öğesi için:
- Öğe görünümünü, reklam nesnesindeki öğeyle doldurun.
- Öğe görünümünü
ViewGroup
sınıfıyla kaydedin.
- Yerel reklam düzeniniz büyük bir medya öğesi içeriyorsa
MediaView
etiketini kaydedin. - 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:
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 birNativeAdView
öğesini yeniden kullanabileceğinizi ve hatta düzen dosyası kullanmadan dinamik olarak örnek oluşturabileceğinizi unutmayın.Öğ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.
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()
MediaView'u kaydetme
Yerel reklamınızın düzenine ana resim öğesi eklemek istiyorsanız
ImageView
öğesi yerineMediaView
öğesini kullanmanız gerekir.MediaView
, ana medya öğesini (video veya resim) göstermek için tasarlanmış özel birView
'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 bunuNativeAdView
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çingetMediaContent()
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 birImageScaleType
özelliğine sahiptir. Bir görüntününMediaView
öğesinde ölçeklenme şeklini değiştirmek istersenizMediaView
öğesininsetImageScaleType()
yöntemini kullanarak ilgiliImageView.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ğiMediaContent
ö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 yerineMediaView
içine yerleştirilir.
Varsayılan olarak
mainImage
, indirilen ilk resim öğesidir.setReturnUrlsForImageAssets(true)
kullanılıyorsamainImage
değerinull
olur vemainImage
özelliğini manuel olarak indirilen resminize ayarlamanız gerekir. Bu resmin, yalnızca kullanılabilir video öğesi olmadığında kullanılacağını unutmayın.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:
Sonraki adımlar
Aşağıdaki konuları inceleyin: