หน้านี้ได้รับการแปลโดย Cloud Translation API

เนทีฟขั้นสูง

แสดงโฆษณาเนทีฟ

เมื่อโฆษณาเนทีฟโหลด SDK โฆษณาในอุปกรณ์เคลื่อนที่ของ Google จะเรียกใช้ Listener รูปแบบโฆษณาที่สอดคล้องกัน จากนั้นแอปของคุณจะต้องรับผิดชอบในการแสดงโฆษณา แม้ว่าจะไม่จำเป็นต้องแสดงทันที SDK มีแหล่งข้อมูลที่มีประโยชน์ดังที่อธิบายไว้ด้านล่างเพื่อช่วยให้คุณแสดงโฆษณารูปแบบที่ระบบกําหนดได้ง่ายขึ้น

`NativeAdView` ชั้นเรียน

สำหรับรูปแบบ NativeAd จะมีข้อมูล NativeAdView ชั้นเรียนนี้เป็น ViewGroup ที่ผู้เผยแพร่โฆษณาควรใช้เป็นรูทสำหรับ NativeAd ต NativeAdView เดี่ยวสอดคล้องกับโฆษณาเนทีฟ 1 รายการ แต่ละมุมมองที่ใช้แสดงชิ้นงานของโฆษณานั้น (ImageView ที่แสดงชิ้นงานภาพหน้าจอ เป็นต้น) ควรเป็นรายการย่อยของออบเจ็กต์ NativeAdView

ลำดับชั้นการดูสำหรับโฆษณาเนทีฟที่ใช้องค์ประกอบ LinearLayout เพื่อแสดงการดูชิ้นงานของชิ้นงาน อาจมีลักษณะดังนี้

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

นี่คือตัวอย่างที่สร้าง NativeAdView และ จะเติมด้วย NativeAd:

Java

AdLoader.Builder builder = new AdLoader.Builder(this, "ca-app-pub-3940256099942544/2247696110")
    .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 assets into the ad view.
            populateNativeAdView(nativeAd, adView);
            frameLayout.removeAllViews();
            frameLayout.addView(adView);
        }
});

Kotlin

val builder = AdLoader.Builder(this, "ca-app-pub-3940256099942544/2247696110")
    .forNativeAd { nativeAd ->
        // Assumes you have a placeholder FrameLayout in your View layout
        // (with ID fl_adplaceholder) where the ad is to be placed.
        val 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
        val adView = layoutInflater
                .inflate(R.layout.native_ad_layout, null) as NativeAdView
        // This method sets the assets into the ad view.
        populateNativeAdView(nativeAd, adView)
        frameLayout.removeAllViews()
        frameLayout.addView(adView)
    }

โปรดทราบว่าเนื้อหาทั้งหมดของโฆษณาเนทีฟหนึ่งๆ ควรแสดงผลภายในแท็ก เลย์เอาต์ NativeAdView SDK โฆษณาในอุปกรณ์เคลื่อนที่ของ Google จะพยายามบันทึกคำเตือนเมื่อ เนื้อหาเนทีฟแสดงผลนอกเลย์เอาต์มุมมองโฆษณาเนทีฟ

คลาสการดูโฆษณายังมอบวิธีที่ใช้ในการลงทะเบียนมุมมองที่ใช้สำหรับ เนื้อหาแต่ละรายการ และ 1 รายการสำหรับลงทะเบียนออบเจ็กต์ NativeAd การลงทะเบียนมุมมองด้วยวิธีนี้จะช่วยให้ SDK จัดการงานต่างๆ โดยอัตโนมัติได้ เช่น

การบันทึกการคลิก
การแสดงผลการบันทึกเมื่อพิกเซลแรกปรากฏบนหน้าจอ
การแสดงการวางซ้อน "ตัวเลือกโฆษณาอื่นๆ"

การวางซ้อน "ตัวเลือกโฆษณาอื่นๆ"

SDK จะเพิ่มการวางซ้อน "ตัวเลือกโฆษณาอื่นๆ" ลงในมุมมองโฆษณาแต่ละรายการ เว้นพื้นที่ไว้ที่มุมที่ต้องการของมุมมองโฆษณาเนทีฟสําหรับโลโก้ตัวเลือกโฆษณาอื่นๆ ที่แทรกโดยอัตโนมัติ นอกจากนี้ การวางซ้อนตัวเลือกโฆษณาอื่นๆ นั้นสำคัญอย่างมาก คุณจึงควรเลือกสีพื้นหลัง และรูปภาพอย่างเหมาะสม ดูข้อมูลเพิ่มเติมเกี่ยวกับลักษณะและฟังก์ชันของการวางซ้อนได้ที่คำอธิบายช่องโฆษณาเนทีฟ

การระบุว่าเป็นโฆษณา

คุณต้องแสดงการระบุว่าเป็นโฆษณาเพื่อระบุว่าการดูนั้นเป็นโฆษณา ดูข้อมูลเพิ่มเติมได้ที่หลักเกณฑ์ด้านนโยบาย

ตัวอย่างโค้ด

ขั้นตอนในการแสดงโฆษณาเนทีฟมีดังนี้

สร้างอินสแตนซ์ของคลาส NativeAdView
สำหรับชิ้นงานโฆษณาแต่ละรายการที่จะแสดง ให้ทำดังนี้
1. ป้อนข้อมูลในมุมมองชิ้นงานด้วยชิ้นงานในออบเจ็กต์โฆษณา
2. ลงทะเบียนมุมมองเนื้อหากับคลาส NativeAdView
ลงทะเบียน MediaView หากเลย์เอาต์โฆษณาเนทีฟมีเนื้อหาสื่อขนาดใหญ่
ลงทะเบียนออบเจ็กต์โฆษณากับคลาส NativeAdView

ต่อไปนี้เป็นฟังก์ชันตัวอย่างที่แสดง NativeAd

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

แต่ละงานมีดังนี้

ขยายเลย์เอาต์
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
```
โค้ดนี้กำลังขยายเค้าโครง XML ซึ่งมีมุมมองสำหรับแสดงโฆษณาเนทีฟ และค้นหาการอ้างอิงไปยัง NativeAdView โปรดทราบว่าคุณยังใช้ NativeAdView ที่มีอยู่ซ้ำได้หากมีในฟragment หรือกิจกรรม หรือแม้แต่สร้างอินสแตนซ์แบบไดนามิกโดยไม่ใช้ไฟล์เลย์เอาต์
ป้อนข้อมูลและลงทะเบียนมุมมองเนื้อหา

โค้ดตัวอย่างนี้จะค้นหามุมมองที่ใช้เพื่อแสดงบรรทัดแรก และตั้งข้อความ โดยใช้เนื้อหาสตริงที่ได้จากออบเจ็กต์โฆษณา และลงทะเบียนกับ ออบเจ็กต์ NativeAdView รายการ:
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
```
กระบวนการค้นหาข้อมูลพร็อพเพอร์ตี้ การตั้งค่า และลงทะเบียนข้อมูลพร็อพเพอร์ตี้กับ คุณควรใช้คลาสการดูโฆษณาซ้ำ สำหรับชิ้นงานแต่ละรายการ ที่แอปจะแสดง

จัดการการคลิก

อย่าใช้เครื่องจัดการคลิกที่กำหนดเองใดๆ ในมุมมองใดๆ ภายในหรือภายใน ของโฆษณาเนทีฟ SDK จะจัดการการคลิกชิ้นงานมุมมองโฆษณา ตราบใดที่คุณป้อนข้อมูลและลงทะเบียนมุมมองชิ้นงานอย่างถูกต้องตามที่ได้อธิบายไว้ในส่วนก่อนหน้า

หากต้องการรอฟังการคลิก ให้ใช้การเรียกกลับการคลิกของ Google Mobile Ads SDK โดยทำดังนี้

Java

AdLoader adLoader = new AdLoader.Builder(context, "ca-app-pub-3940256099942544/2247696110")
    // ...
    .withAdListener(new AdListener() {
        @Override
        public void onAdFailedToLoad(LoadAdError adError) {
            // Handle the failure by logging.
        }
        @Override
        public void onAdClicked() {
            // Log the click event or other custom behavior.
        }
    })
    .build();

Kotlin

val adLoader = AdLoader.Builder(this, "ca-app-pub-3940256099942544/2247696110")
    // ...
    .withAdListener(object : AdListener() {
        override fun onAdFailedToLoad(adError: LoadAdError) {
            // Handle the failure.
        }
        override fun onAdClicked() {
            // Log the click event or other custom behavior.
        }
    })
    .build()

ลงทะเบียน MediaView

คุณจะต้องใช้ MediaView แทนที่จะเป็น ImageView หากคุณต้องการรวมชิ้นงานรูปภาพหลักไว้ในเลย์เอาต์สำหรับโฆษณาเนทีฟ โฆษณาของคุณ

MediaView คือ View พิเศษที่ออกแบบมาเพื่อแสดงชิ้นงานสื่อหลัก ไม่ว่าจะเป็นวิดีโอหรือรูปภาพ

MediaView สามารถกําหนดได้ในเลย์เอาต์ XML หรือสร้างแบบไดนามิก โดยควรวางไว้ในลําดับชั้นมุมมองของ NativeAdView เช่นเดียวกับมุมมองชิ้นงานอื่นๆ แอปที่ใช้ MediaView ต้องลงทะเบียน MediaView กับ ดังนี้
Java
```
 // Populate and register the media asset view.
 nativeAdView.setMediaView(nativeAdBinding.adMedia);
```
Kotlin
```
 // Populate and register the media asset view.
 nativeAdView.mediaView = nativeAdBinding.adMedia
```
ImageScaleType

คลาส MediaView มีพร็อพเพอร์ตี้ ImageScaleType เมื่อแสดง รูปภาพ หากต้องการเปลี่ยนวิธีปรับขนาดรูปภาพใน MediaView ให้ตั้งค่า ImageView.ScaleType ที่เกี่ยวข้องโดยใช้ setImageScaleType() ของ MediaView:
Java
```
mediaView.setImageScaleType(ImageView.ScaleType.CENTER_CROP);
```
Kotlin
```
mediaView.imageScaleType = ImageView.ScaleType.CENTER_CROP
```
MediaContent

คลาส MediaContent มีข้อมูลที่เกี่ยวข้องกับเนื้อหาสื่อของ โฆษณาเนทีฟ ซึ่งแสดงโดยใช้คลาส MediaView เมื่อ พร็อพเพอร์ตี้ MediaView mediaContent ได้รับการตั้งค่าด้วยอินสแตนซ์ MediaContent
- หากมีเนื้อหาวิดีโอพร้อมใช้งาน ระบบจะบัฟเฟอร์และเริ่มเล่นภายใน MediaView คุณจะทราบได้ว่าเนื้อหาวิดีโอพร้อมใช้งานหรือไม่โดยตรวจสอบ hasVideoContent()
- หากโฆษณาไม่มีชิ้นงานวิดีโอ ระบบจะดาวน์โหลดชิ้นงาน mainImage และวางอยู่ใน MediaView แทน
โดยค่าเริ่มต้น mainImage คือชิ้นงานรูปภาพที่ดาวน์โหลดรายการแรก ถ้า ใช้ setReturnUrlsForImageAssets(true) อยู่ mainImage คือ null และคุณต้อง ตั้งค่าพร็อพเพอร์ตี้ mainImage เป็นรูปภาพที่คุณดาวน์โหลดด้วยตนเอง โปรดทราบว่าระบบจะใช้รูปภาพนี้เฉพาะในกรณีที่ไม่มีชิ้นงานวิดีโอเท่านั้น
ลงทะเบียนออบเจ็กต์โฆษณาเนทีฟ

ขั้นตอนสุดท้ายนี้จะลงทะเบียนออบเจ็กต์โฆษณาเนทีฟกับมุมมองที่รับผิดชอบในการแสดงโฆษณา
Java
```
adView.setNativeAd(ad);
```
Kotlin
```
adView.setNativeAd(ad)
```

ทำลายโฆษณา

เมื่อแสดงโฆษณาเนทีฟเสร็จแล้ว คุณควรทำลายโฆษณาเพื่อให้ระบบรวบรวมขยะอย่างเหมาะสม

Java

nativeAd.destroy();

Kotlin

nativeAd.destroy()

ตัวอย่างใน GitHub

ตัวอย่างการติดตั้งใช้งานโฆษณาเนทีฟที่สมบูรณ์

Java Kotlin

ขั้นตอนถัดไป

สำรวจหัวข้อต่อไปนี้

ความเป็นส่วนตัวของผู้ใช้

การเพิ่มประสิทธิภาพการเริ่มต้น SDK และโหลดโฆษณา (เบต้า)

เนทีฟขั้นสูง

แสดงโฆษณาเนทีฟ

NativeAdView ชั้นเรียน

Java

Kotlin

การวางซ้อน "ตัวเลือกโฆษณาอื่นๆ"

การระบุว่าเป็นโฆษณา

ตัวอย่างโค้ด

Java

Kotlin

Java

Kotlin

Java

Kotlin

Java

Kotlin

Java

Kotlin

ImageScaleType

Java

Kotlin

MediaContent

Java

Kotlin

ทำลายโฆษณา

Java

Kotlin

ตัวอย่างใน GitHub

ขั้นตอนถัดไป

`NativeAdView` ชั้นเรียน