本頁面由 Cloud Translation API 翻譯而成。

原生廣告

選取平台： Android Android (Beta 版) iOS

原生廣告載入時，GMA Next Gen SDK 會叫用相應廣告格式的事件監聽器，然後由應用程式顯示廣告 (不必立即顯示)。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.
        }
    }

處理已載入的原生廣告

載入原生廣告時，請處理回呼事件、加載原生廣告檢視區塊，並加到檢視區塊階層：

Kotlin

// Build an ad request with native ad options to customize the ad.
val adTypes = listOf(NativeAd.NativeAdType.NATIVE)
val adRequest = NativeAdRequest
  .Builder("/21775744923/example/native", 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)

Java

// 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("/21775744923/example/native", 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 版面配置內顯示。如果原生素材資源的顯示位置不在原生廣告檢視區塊的版面配置內，GMA Next Gen SDK 會嘗試記錄警告。

廣告檢視區塊類別提供多種方法，可註冊個別素材資源使用的檢視區塊，還有一個方法可註冊 NativeAd 物件。以這種方式註冊檢視區塊，SDK 就能自動處理下列工作：

記錄點擊次數
記錄曝光 (畫面顯示第一個像素時)
為原生候補廣告素材顯示 AdChoices 疊加層，目前僅限部分發布商使用

顯示原生廣告

以下範例說明如何顯示原生廣告：

Kotlin

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 GMA Next Gen SDK 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
}

Java

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 GMA Next Gen SDK 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 疊加層

系統傳回候補廣告時，SDK 會新增一個 AdChoices 疊加層，做為廣告檢視區塊的一部分。如果應用程式使用原生廣告做為候補，請在原生廣告檢視區塊中選一個角落預留空間，供系統自動插入 AdChoices 標誌。此外，AdChoices 疊加層必須清楚易見，因此請選用適當的背景顏色和圖片。如要進一步瞭解這個疊加層的外觀與功能，請參閱程式輔助原生廣告導入指南。

程式輔助原生廣告的廣告標示

顯示程式輔助原生廣告時，必須加上廣告標示，表明該檢視區塊為廣告內容，詳情請參閱政策規範。

處理點擊

請勿在原生廣告檢視區塊上方或內部，導入任何自訂點擊處理常式。只要正確填入素材資源檢視區塊並完成註冊，SDK 就會處理廣告檢視區塊內的素材資源點擊。

如要監聽點擊事件，請導入 GMA Next Gen SDK 點擊回呼：

Kotlin

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

Java

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 中的縮放方式，請使用 MediaView 的 setImageScaleType() 方法，設定對應的 ImageView.ScaleType：

Kotlin

nativeAdViewBinding.mediaView.imageScaleType = ImageView.ScaleType.CENTER_CROP

Java

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

MediaContent

MediaContent 類別會保留與原生廣告媒體內容相關的資料，並使用 MediaView 類別顯示。使用 MediaContent 執行個體設定 MediaView mediaContent 屬性時，請注意以下事項：

如有可用的影片素材資源，影片會緩衝處理並開始於 MediaView 播放。您可以檢查 hasVideoContent()，判斷是否有影片素材資源。
如果廣告不含影片素材資源，系統會下載 mainImage 素材資源，並加到 MediaView 中。

刪除廣告

顯示原生廣告後，請將廣告刪除。以下範例會刪除原生廣告：

Kotlin

nativeAd.destroy()

Java

nativeAd.destroy();

測試原生廣告程式碼

直接銷售廣告

如要測試直接銷售原生廣告，可以使用以下 Ad Manager 廣告單元 ID：

/21775744923/example/native

這個 ID 已設為可放送範例應用程式安裝廣告和內容廣告，以及包含下列素材資源的自訂原生廣告格式：

廣告標題 (文字)
MainImage (圖片)
說明文字 (文字)

自訂原生廣告格式的範本 ID 為 10063170。

原生候補廣告

Ad Exchange 候補廣告功能僅適用於特定發布商。如要測試原生候補廣告的行為，請使用以下 Ad Manager 廣告單元：

/21775744923/example/native-backfill

這會放送附有 AdChoices 疊加層的範例應用程式安裝廣告和內容廣告。

請務必先更新程式碼，參照實際的廣告單元和範本 ID，再正式發布。

後續步驟

請參閱下列主題：

使用者隱私權

範例

請下載並執行範例應用程式，瞭解如何使用 GMA Next Gen SDK。

原生廣告 透過集合功能整理內容 你可以依據偏好儲存及分類內容。

定義 NativeAdView 類別

XML 版面配置

Jetpack Compose

處理已載入的原生廣告

Kotlin

Java

顯示原生廣告

Kotlin

Java

AdChoices 疊加層

程式輔助原生廣告的廣告標示

處理點擊

Kotlin

Java

ImageScaleType

Kotlin

Java

MediaContent

刪除廣告

Kotlin

Java

測試原生廣告程式碼

直接銷售廣告

原生候補廣告

後續步驟

範例

原生廣告

定義 `NativeAdView` 類別