تبلیغات بومی

وقتی یک تبلیغ بومی بارگیری می‌شود، SDK تبلیغات موبایل Google (بتا) شنونده را برای قالب آگهی مربوطه فراخوانی می‌کند. سپس برنامه شما مسئول نمایش آگهی است، اگرچه لزوماً نباید فوراً این کار را انجام دهد. برای آسان‌تر کردن نمایش قالب‌های تبلیغاتی تعریف‌شده توسط سیستم، SDK منابع مفیدی را ارائه می‌دهد که در زیر توضیح داده شده است.

کلاس NativeAdView را تعریف کنید

یک کلاس NativeAdView تعریف کنید. این کلاس یک کلاس ViewGroup است و ظرف سطح بالای کلاس NativeAdView است. هر نمای تبلیغات بومی حاوی دارایی های تبلیغاتی بومی است، مانند عنصر نمای MediaView یا عنصر نمای Title ، که باید فرزند شی NativeAdView باشد.

طرح بندی XML

یک XML NativeAdView به پروژه خود اضافه کنید:

<com.google.android.libraries.ads.mobile.sdk.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>
        <!--Add remaining assets such as the image and media view.-->
    </LinearLayout>
</com.google.android.libraries.ads.mobile.sdk.nativead.NativeAdView>

Jetpack Compose

شامل ماژول JetpackComposeDemo/compose-util که شامل کمک کننده هایی برای نوشتن NativeAdView و دارایی های آن است.

با استفاده از ماژول compose-util ، یک NativeAdView بنویسید:

  import com.google.android.gms.compose_util.NativeAdAttribution
  import com.google.android.gms.compose_util.NativeAdView

  @Composable
  /** Display a native ad with a user defined template. */
  fun DisplayNativeAdView(nativeAd: NativeAd) {
      NativeAdView {
          // Display the ad attribution.
          NativeAdAttribution(text = context.getString("Ad"))
          // Add remaining assets such as the image and media view.
        }
    }

آگهی بومی بارگذاری شده را مدیریت کنید

هنگامی که یک تبلیغ بومی بارگیری می‌شود، رویداد برگشت به تماس را مدیریت کنید، نمای تبلیغات بومی را افزایش دهید و آن را به سلسله مراتب مشاهده اضافه کنید:

کاتلین

// Build an ad request with native ad options to customize the ad.
val adTypes = listOf(NativeAd.NativeAdType.NATIVE)
val adRequest = NativeAdRequest
  .Builder("ca-app-pub-3940256099942544/2247696110", adTypes)
  .build()

val adCallback =
  object : NativeAdLoaderCallback {
    override fun onNativeAdLoaded(nativeAd: NativeAd) {
      activity?.runOnUiThread {

        val nativeAdBinding = NativeAdBinding.inflate(layoutInflater)
        val adView = nativeAdBinding.root
        val frameLayout = myActivityLayout.nativeAdPlaceholder

        // Populate and register the native ad asset views.
        displayNativeAd(nativeAd, nativeAdBinding)

        // Remove all old ad views and add the new native ad
        // view to the view hierarchy.
        frameLayout.removeAllViews()
        frameLayout.addView(adView)
      }
    }
  }

// Load the native ad with our request and callback.
NativeAdLoader.load(adRequest, adCallback)

جاوا

// Build an ad request with native ad options to customize the ad.
List<NativeAd.NativeAdType> adTypes = Arrays.asList(NativeAd.NativeAdType.NATIVE);
NativeAdRequest adRequest = new NativeAdRequest
                                .Builder("ca-app-pub-3940256099942544/2247696110", adTypes)
                                .build();

NativeAdLoaderCallback adCallback = new NativeAdLoaderCallback() {
    @Override
    public void onNativeAdLoaded(NativeAd nativeAd) {
      if (getActivity() != null) {
        getActivity()
          .runOnUiThread(() -> {
            // Inflate the native ad view and add it to the view hierarchy.
            NativeAdBinding nativeAdBinding = NativeAdBinding.inflate(getLayoutInflater());
            NativeAdView adView = (NativeAdView) nativeAdBinding.getRoot();
            FrameLayout frameLayout = myActivityLayout.nativeAdPlaceholder;

            // Populate and register the native ad asset views.
            displayNativeAd(nativeAd, nativeAdBinding);

            // Remove all old ad views and add the new native ad
            // view to the view hierarchy.
            frameLayout.removeAllViews();
            frameLayout.addView(adView);
        });
      }
    }
};

// Load the native ad with our request and callback.
NativeAdLoader.load(adRequest, adCallback);

توجه داشته باشید که همه دارایی‌های یک آگهی بومی معین باید در طرح NativeAdView ارائه شوند. Google Mobile Ads SDK (بتا) زمانی که دارایی‌های بومی خارج از طرح‌بندی نمای تبلیغاتی بومی ارائه می‌شوند، اخطاری را ثبت می‌کند.

کلاس‌های ad view همچنین روش‌هایی را ارائه می‌دهند که برای ثبت نمای مورد استفاده برای هر دارایی جداگانه و یکی برای ثبت خود شی NativeAd استفاده می‌شوند. ثبت نماها به این روش به SDK اجازه می دهد تا به طور خودکار وظایفی مانند:

  • ضبط کلیک ها
  • ضبط برداشت زمانی که اولین پیکسل روی صفحه قابل مشاهده است
  • نمایش همپوشانی AdChoices

نمایش آگهی بومی

مثال زیر نحوه نمایش یک تبلیغ بومی را نشان می دهد:

کاتلین

private fun displayNativeAd(nativeAd: NativeAd, nativeAdBinding : NativeAdBinding) {
  // Set the native ad view elements.
  val nativeAdView = nativeAdBinding.root
  nativeAdView.advertiserView = nativeAdBinding.adAdvertiser
  nativeAdView.bodyView = nativeAdBinding.adBody
  nativeAdView.callToActionView = nativeAdBinding.adCallToAction
  nativeAdView.headlineView = nativeAdBinding.adHeadline
  nativeAdView.iconView = nativeAdBinding.adAppIcon
  nativeAdView.priceView = nativeAdBinding.adPrice
  nativeAdView.starRatingView = nativeAdBinding.adStars
  nativeAdView.storeView = nativeAdBinding.adStore

  // Set the view element with the native ad assets.
  nativeAdBinding.adAdvertiser.text = nativeAd.advertiser
  nativeAdBinding.adBody.text = nativeAd.body
  nativeAdBinding.adCallToAction.text = nativeAd.callToAction
  nativeAdBinding.adHeadline.text = nativeAd.headline
  nativeAdBinding.adAppIcon.setImageDrawable(nativeAd.icon?.drawable)
  nativeAdBinding.adPrice.text = nativeAd.price
  nativeAd.starRating?.toFloat().let { value ->
    nativeAdBinding.adStars.rating = value
  }
  nativeAdBinding.adStore.text = nativeAd.store

  // Hide views for assets that don't have data.
  nativeAdBinding.adAdvertiser.visibility = getAssetViewVisibility(nativeAd.advertiser)
  nativeAdBinding.adBody.visibility = getAssetViewVisibility(nativeAd.body)
  nativeAdBinding.adCallToAction.visibility = getAssetViewVisibility(nativeAd.callToAction)
  nativeAdBinding.adHeadline.visibility = getAssetViewVisibility(nativeAd.headline)
  nativeAdBinding.adAppIcon.visibility = getAssetViewVisibility(nativeAd.icon)
  nativeAdBinding.adPrice.visibility = getAssetViewVisibility(nativeAd.price)
  nativeAdBinding.adStars.visibility = getAssetViewVisibility(nativeAd.starRating)
  nativeAdBinding.adStore.visibility = getAssetViewVisibility(nativeAd.store)

  // Inform Google Mobile Ads SDK (beta) that you have finished populating
  // the native ad views with this native ad.
  nativeAdView.registerNativeAd(nativeAd, nativeAdBinding.adMedia)
}

/**
* Determines the visibility of an asset view based on the presence of its asset.
*
* @param asset The native ad asset to check for nullability.
* @return [View.VISIBLE] if the asset is not null, [View.INVISIBLE] otherwise.
*/
private fun getAssetViewVisibility(asset: Any?): Int {
  return if (asset == null) View.INVISIBLE else View.VISIBLE
}

جاوا

private void displayNativeAd(ad: NativeAd, nativeAdBinding : NativeAdBinding) {
  // Set the native ad view elements.
  NativeAdView nativeAdView = nativeAdBinding.getRoot();
  nativeAdView.setAdvertiserView(nativeAdBinding.adAdvertiser);
  nativeAdView.setBodyView(nativeAdBinding.adBody);
  nativeAdView.setCallToActionView(nativeAdBinding.adCallToAction);
  nativeAdView.setHeadlineView(nativeAdBinding.adHeadline);
  nativeAdView.setIconView(nativeAdBinding.adAppIcon);
  nativeAdView.setPriceView(nativeAdBinding.adPrice);
  nativeAdView.setStarRatingView(nativeAdBinding.adStars);
  nativeAdView.setStoreView(nativeAdBinding.adStore);

  // Set the view element with the native ad assets.
  nativeAdBinding.adAdvertiser.setText(nativeAd.getAdvertiser());
  nativeAdBinding.adBody.setText(nativeAd.getBody());
  nativeAdBinding.adCallToAction.setText(nativeAd.getCallToAction());
  nativeAdBinding.adHeadline.setText(nativeAd.getHeadline());
  if (nativeAd.getIcon() != null) {
      nativeAdBinding.adAppIcon.setImageDrawable(nativeAd.getIcon().getDrawable());
  }
  nativeAdBinding.adPrice.setText(nativeAd.getPrice());
  if (nativeAd.getStarRating() != null) {
      nativeAdBinding.adStars.setRating(nativeAd.getStarRating().floatValue());
  }
  nativeAdBinding.adStore.setText(nativeAd.getStore());

  // Hide views for assets that don't have data.
  nativeAdBinding.adAdvertiser.setVisibility(getAssetViewVisibility(nativeAd.getAdvertiser()));
  nativeAdBinding.adBody.setVisibility(getAssetViewVisibility(nativeAd.getBody()));
  nativeAdBinding.adCallToAction.setVisibility(getAssetViewVisibility(nativeAd.getCallToAction()));
  nativeAdBinding.adHeadline.setVisibility(getAssetViewVisibility(nativeAd.getHeadline()));
  nativeAdBinding.adAppIcon.setVisibility(getAssetViewVisibility(nativeAd.getIcon()));
  nativeAdBinding.adPrice.setVisibility(getAssetViewVisibility(nativeAd.getPrice()));
  nativeAdBinding.adStars.setVisibility(getAssetViewVisibility(nativeAd.getStarRating()));
  nativeAdBinding.adStore.setVisibility(getAssetViewVisibility(nativeAd.getStore()));

  // Inform Google Mobile Ads SDK (beta) that you have finished populating
  // the native ad views with this native ad.
  nativeAdView.registerNativeAd(nativeAd, nativeAdBinding.adMedia);
}

/**
* Determines the visibility of an asset view based on the presence of its asset.
*
* @param asset The native ad asset to check for nullability.
* @return {@link View#VISIBLE} if the asset is not null, {@link View#INVISIBLE} otherwise.
*/
private int getAssetViewVisibility(Object asset) {
    return (asset == null) ? View.INVISIBLE : View.VISIBLE;
}

همپوشانی AdChoices

یک پوشش AdChoices به هر نمای تبلیغاتی توسط SDK اضافه می شود. برای نشان‌واره AdChoices که به‌طور خودکار درج می‌شود، در گوشه دلخواهتان در نمای تبلیغاتی بومی‌تان فضای خالی بگذارید. همچنین، مهم است که پوشش AdChoices به راحتی دیده شود، بنابراین رنگ های پس زمینه و تصاویر را به طور مناسب انتخاب کنید. برای اطلاعات بیشتر در مورد ظاهر و عملکرد روکش، به توضیحات فیلد تبلیغات بومی مراجعه کنید.

انتساب آگهی

شما باید یک انتساب آگهی را نمایش دهید تا نشان دهد که این نما یک تبلیغ است. در دستورالعمل های خط مشی ما بیشتر بیاموزید.

رسیدگی به کلیک ها

هیچ کنترل کننده کلیک سفارشی را روی هیچ نمایی در داخل یا در نمای تبلیغاتی بومی اجرا نکنید. کلیک‌ها روی دارایی‌های نمایش آگهی تا زمانی که بازدیدهای دارایی را به درستی پر کرده و ثبت کنید، توسط SDK مدیریت می‌شود.

برای گوش دادن به کلیک‌ها، پاسخ تماس کلیکی SDK تبلیغات موبایل Google (بتا) را اجرا کنید:

کاتلین

private fun setEventCallback(nativeAd: NativeAd) {
  nativeAd.adEventCallback =
    object : NativeAdEventCallback {
      override fun onAdClicked() {
        Log.d(Constant.TAG, "Native ad recorded a click.")
      }
    }
}

جاوا

private void setEventCallback(NativeAd nativeAd) {
  nativeAd.setAdEventCallback(new NativeAdEventCallback() {
      @Override
      public void onAdClicked() {
        Log.d(Constant.TAG, "Native ad recorded a click.");
      }
  });
}

ImageScaleType

کلاس MediaView دارای ویژگی ImageScaleType هنگام نمایش تصاویر است. اگر می خواهید نحوه مقیاس بندی یک تصویر را در MediaView تغییر دهید، ImageView.ScaleType مربوطه را با استفاده از متد setImageScaleType() MediaView تنظیم کنید:

کاتلین

nativeAdViewBinding.mediaView.imageScaleType = ImageView.ScaleType.CENTER_CROP

جاوا

nativeAdViewBinding.mediaView.setImageScaleType(ImageView.ScaleType.CENTER_CROP);

MediaContent

کلاس MediaContent داده های مربوط به محتوای رسانه ای تبلیغ بومی را نگه می دارد که با استفاده از کلاس MediaView نمایش داده می شود. هنگامی که ویژگی MediaView mediaContent با یک نمونه MediaContent تنظیم می شود:

  • اگر دارایی ویدیویی در دسترس باشد، بافر شده و در MediaView شروع به پخش می‌کند. با بررسی hasVideoContent() می‌توانید متوجه شوید که یک دارایی ویدیو در دسترس است.

  • اگر تبلیغ حاوی دارایی ویدیو نباشد، دارایی mainImage دانلود شده و در داخل MediaView قرار می گیرد.

یک تبلیغ را نابود کنید

پس از نمایش یک تبلیغ بومی، تبلیغ را از بین ببرید. مثال زیر یک تبلیغ بومی را از بین می برد:

کاتلین

nativeAd.destroy()

جاوا

nativeAd.destroy();

مراحل بعدی

موضوعات زیر را بررسی کنید:

مثال

برنامه مثالی را که استفاده از Google Mobile Ads SDK (بتا) را نشان می دهد، دانلود و اجرا کنید.