Biểu ngữ thích ứng

Biểu ngữ thích ứng là thế hệ tiếp theo của quảng cáo thích ứng, giúp bạn tăng tối đa hiệu quả hoạt động bằng cách tối ưu hóa kích thước quảng cáo cho từng thiết bị. Được cải tiến dựa trên biểu ngữ thông minh mà trước đó chỉ hỗ trợ chiều cao cố định, biểu ngữ thích ứng cho phép nhà phát triển chỉ định chiều rộng quảng cáo và sử dụng yếu tố này để xác định kích thước quảng cáo tối ưu.

Để chọn kích thước quảng cáo thích hợp nhất, biểu ngữ thích ứng sử dụng tỷ lệ khung hình cố định thay vì chiều cao cố định. Nhờ đó, quảng cáo biểu ngữ chiếm phần màn hình nhất quán hơn trên các thiết bị và mang lại cơ hội cải thiện hiệu quả hoạt động.

Khi sử dụng biểu ngữ thích ứng, xin lưu ý rằng các biểu ngữ này sẽ luôn trả về ở một kích thước không đổi cho một thiết bị và chiều rộng nhất định. Sau khi đã thử nghiệm bố cục trên một thiết bị nhất định, bạn có thể chắc chắn rằng kích thước quảng cáo đó sẽ không thay đổi. Tuy nhiên, kích thước của quảng cáo biểu ngữ có thể thay đổi trên các thiết bị khác nhau. Do đó, bạn nên đảm bảo bố cục của mình có thể phù hợp với các kiểu bố cục có chiều cao khác nhau của quảng cáo. Trong vài trường hợp, kích thước thích ứng đầy đủ có thể không hiển thị được và một quảng cáo có kích thước tiêu chuẩn sẽ được đặt ở giữa trong vùng này.

Trường hợp sử dụng biểu ngữ thích ứng

Biểu ngữ thích ứng dùng để thay thế cho biểu ngữ có kích thước tiêu chuẩn ngành 320x50 và định dạng biểu ngữ thông minh.

Các kích thước biểu ngữ này thường được dùng làm biểu ngữ cố định (biểu ngữ thường xuất hiện ở phía trên cùng hoặc dưới cùng của màn hình). Đối với các biểu ngữ cố định như vậy, tỷ lệ khung hình khi sử dụng biểu ngữ thích ứng sẽ tương tự như tỷ lệ khung hình của quảng cáo chuẩn 320x50. Hãy xem các ảnh chụp màn hình dưới đây:


Biểu ngữ 320x50

Biểu ngữ thông minh

Biểu ngữ thích ứng

Biểu ngữ thích ứng sử dụng kích thước màn hình có sẵn hiệu quả hơn. Ngoài ra, so với biểu ngữ thông minh, bạn nên chọn biểu ngữ thích ứng vì:

  • Biểu ngữ thích ứng có thể hiển thị với chiều rộng đã chỉ định thay vì chiều rộng toàn màn hình, cho phép bạn xem xét vết cắt trên màn hình .

  • Biểu ngữ thích ứng chọn một chiều cao tối ưu cho thiết bị cụ thể, thay vì hiển thị với chiều cao không đổi trên các thiết bị có kích thước khác nhau, giúp giảm thiểu tác động của hiện tượng phân mảnh thiết bị.

Lưu ý khi triển khai

Khi triển khai biểu ngữ thích ứng trong ứng dụng, hãy lưu ý những điểm sau:

  • Hãy đảm bảo rằng bạn đang sử dụng phiên bản mới nhất của SDK quảng cáo trên thiết bị di động của Google. Hãy sử dụng phiên bản mới nhất của bộ chuyển đổi dàn xếp để triển khai hoạt động dàn xếp.
  • Kích thước biểu ngữ thích ứng hoạt động hiệu quả nhất khi sử dụng toàn bộ chiều rộng có sẵn. Trong hầu hết các trường hợp, đây sẽ là chiều rộng toàn màn hình của thiết bị mà bạn đang sử dụng. Hãy nhớ xét đến vết cắt trên màn hình (nếu có).

  • SDK quảng cáo trên thiết bị di động của Google sẽ trả về chiều cao quảng cáo tối ưu cho chiều rộng nhất định trong với kích thước AdSize.

  • Bạn có thể thực hiện 3 phương pháp để đặt kích thước quảng cáo biểu ngữ thích ứng, trong đó một phương pháp dành cho biểu ngữ ngang, một phương pháp dành cho biểu ngữ dọc và một phương pháp dành cho hướng hiện tại tại thời điểm thực thi. Để biết thêm thông tin, hãy xem tài liệu đầy đủ về API dưới đây.

  • Kích thước được trả về cho một chiều rộng cụ thể trên một thiết bị cụ thể sẽ luôn giống nhau. Do đó, sau khi thử nghiệm bố cục trên một thiết bị cụ thể, bạn có thể chắc chắn rằng kích thước quảng cáo sẽ không thay đổi.

  • Chiều cao của biểu ngữ cố định không được lớn hơn 15% chiều cao của thiết bị và không được nhỏ hơn 50 dp.

Bắt đầu nhanh

Thực hiện theo các bước dưới đây để triển khai một biểu ngữ thích ứng cố định đơn giản.

  1. Tạo đối tượng an AdView và đặt mã đơn vị quảng cáo của bạn.

  2. Thu thập kích thước quảng cáo biểu ngữ thích ứng. Kích thước bạn nhận được sẽ được dùng để yêu cầu biểu ngữ thích ứng của bạn. Để có kích thước quảng cáo thích ứng, hãy đảm bảo rằng bạn:

    1. Biết chiều rộng của thiết bị mà bạn đang sử dụng hoặc đặt chiều rộng riêng nếu bạn không muốn sử dụng chiều rộng toàn màn hình.
    2. Sử dụng các phương thức tĩnh thích hợp đối với lớp kích thước quảng cáo, chẳng hạn như AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(context, width) để thu thập đối tượng thích ứng AdSize cho hướng mà bạn đã chọn.
    3. Đặt kích thước quảng cáo trên chế độ xem quảng cáo biểu ngữ. Để thực hiện việc này , bạn có thể sử dụng AdView.setAdSize().

    Hãy xem ví dụ đầy đủ dưới đây.

  3. Tạo đối tượng yêu cầu quảng cáo và sử dụng phương thức loadAd() để tải biểu ngữ của bạn trên chế độ xem quảng cáo có sẵn, giống như cách bạn thực hiện với yêu cầu biểu ngữ thông thường.

Mã mẫu

Dưới đây là ví dụ về hoạt động sẽ tải biểu ngữ thích ứng vừa với chiều rộng của màn hình:

Java

    import android.content.res.Configuration;
    import android.os.Bundle;
    import android.support.v7.app.AppCompatActivity;
    import android.util.DisplayMetrics;
    import android.view.Display;
    import android.widget.FrameLayout;

    import com.google.android.gms.ads.AdRequest;
    import com.google.android.gms.ads.AdSize;
    import com.google.android.gms.ads.AdView;
        import com.google.android.gms.ads.MobileAds;
    /** Main Activity. Inflates main activity xml and child fragments. */
    public class MyActivity extends AppCompatActivity {

      private FrameLayout adContainerView;
      private AdView adView;

      @Override
      protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_my);

        // Initialize the Mobile Ads SDK.
        MobileAds.initialize(this, new OnInitializationCompleteListener() {
            @Override
            public void onInitializationComplete(InitializationStatus initializationStatus) { }
        });
        adContainerView = findViewById(R.id.ad_view_container);
        // Step 1 - Create an AdView and set the ad unit ID on it.
        adView = new AdView(this);
        adView.setAdUnitId(getString(R.string.adaptive_banner_ad_unit_id));
        adContainerView.addView(adView);
        loadBanner();
      }

      private void loadBanner() {
        // Create an ad request. Check your logcat output for the hashed device ID
        // to get test ads on a physical device, e.g.,
        // "Use AdRequest.Builder.addTestDevice("ABCDE0123") to get test ads on this
        // device."
        AdRequest adRequest =
            new AdRequest.Builder().addTestDevice(AdRequest.DEVICE_ID_EMULATOR)
                .build();

        AdSize adSize = getAdSize();
        // Step 4 - Set the adaptive ad size on the ad view.
        adView.setAdSize(adSize);
        
        // Step 5 - Start loading the ad in the background.
        adView.loadAd(adRequest);
      }

      private AdSize getAdSize() {
        // Step 2 - Determine the screen width (less decorations) to use for the ad width.
        Display display = getWindowManager().getDefaultDisplay();
        DisplayMetrics outMetrics = new DisplayMetrics();
        display.getMetrics(outMetrics);

        float widthPixels = outMetrics.widthPixels;
        float density = outMetrics.density;

        int adWidth = (int) (widthPixels / density);

        // Step 3 - Get adaptive ad size and return for setting on the ad view.
        return AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, adWidth);
      }
    }
    

Kotlin

    import android.os.Bundle
    import android.util.DisplayMetrics
    import androidx.appcompat.app.AppCompatActivity
    import com.google.android.gms.ads.AdRequest
    import com.google.android.gms.ads.AdSize
    import com.google.android.gms.ads.AdView
    import com.google.android.gms.ads.MobileAds
    import kotlinx.android.synthetic.main.activity_my.*

    /** Main Activity. Inflates main activity xml and child fragments.  */
    class MyActivity : AppCompatActivity() {
      private lateinit var adView: AdView

      // Determine the screen width (less decorations) to use for the ad width.
      // If the ad hasn't been laid out, default to the full screen width.
      private val adSize: AdSize
        get() {
          val display = windowManager.defaultDisplay
          val outMetrics = DisplayMetrics()
          display.getMetrics(outMetrics)

          val density = outMetrics.density

          var adWidthPixels = ad_view_container.width.toFloat()
          if (adWidthPixels == 0f) {
            adWidthPixels = outMetrics.widthPixels.toFloat()
          }

          val adWidth = (adWidthPixels / density).toInt()
          return AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, adWidth)
        }

      override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_my)

        // Initialize the Mobile Ads SDK.
        MobileAds.initialize(this) { }

        adView = AdView(this)
        ad_view_container.addView(adView)
        loadBanner()
      }

      private fun loadBanner() {
        adView.adUnitId = ad unit id

        adView.adSize = adSize

        // Create an ad request. Check your logcat output for the hashed device ID to
        // get test ads on a physical device, e.g.,
        // "Use AdRequest.Builder.addTestDevice("ABCDE0123") to get test ads on this device."
        val adRequest = AdRequest
            .Builder()
            .addTestDevice(AdRequest.DEVICE_ID_EMULATOR).build()

        // Start loading the ad in the background.
        adView.loadAd(adRequest)
      }

      companion object {
        // This is an ad unit ID for a test ad. Replace with your own banner ad unit ID.
        private val AD_UNIT_ID = "ca-app-pub-3940256099942544~3347511713"
      }
    }
    

Ở đây, hàm AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize dùng để lấy kích thước của biểu ngữ ở một vị trí cố định cho hướng giao diện hiện tại. Để tải trước một biểu ngữ cố định theo một hướng nhất định, hãy sử dụng hàm có liên quan từ AdSize.getPortraitAnchoredAdaptiveBannerAdSizeAdSize.getLandscapeAnchoredAdaptiveBannerAdSize.

Ví dụ về Biểu ngữ thích ứng trên GitHub

Java Kotlin