Banery reklamowe

Wybierz platformę: Android (beta) Nowy wybrany Android iOS Unity Flutter

Banery reklamowe to prostokątne reklamy, które zajmują część układu aplikacji. Zakotwiczone banery adaptacyjne to reklamy o stałym współczynniku proporcji, które pozostają na ekranie, gdy użytkownicy wchodzą w interakcję z aplikacją – są zakotwiczone u góry lub u dołu ekranu.

Z tego przewodnika dowiesz się, jak wczytać zakotwiczony adaptacyjny baner reklamowy w aplikacji na Androida.

Wymagania wstępne

Zawsze testuj za pomocą reklam testowych

Podczas tworzenia i testowania aplikacji używaj reklam testowych zamiast reklam aktywnych. Jeśli tego nie zrobisz, Twoje konto może zostać zawieszone.

Najłatwiejszym sposobem wczytywania reklam testowych jest użycie specjalnego identyfikatora jednostki reklamowej na potrzeby reklam testowych w przypadku banerów na Androida:

/21775744923/example/adaptive-banner

Został on specjalnie skonfigurowany tak, aby zwracać reklamy testowe w przypadku każdego żądania. Możesz go używać w swoich aplikacjach podczas kodowania, testowania i debugowania. Pamiętaj tylko, aby przed opublikowaniem aplikacji zastąpić go własnym identyfikatorem jednostki reklamowej.

Więcej informacji o tym, jak działają GMA Next-Gen SDK reklamy testowe, znajdziesz w artykule Włączanie reklam testowych.

Tworzenie obiektu AdView

Aby wyświetlać banery:

Kotlin

  1. Utwórz obiekt AdView.
  2. Dodaj obiekt AdView do układu aplikacji.

Ten przykład tworzy obiekt AdView i dodaje go do układu aplikacji:

private fun createAdView(adViewContainer: FrameLayout, activity: Activity) {
  val adView = AdView(activity)
  adViewContainer.addView(adView)
}

Java

  1. Utwórz obiekt AdView.
  2. Dodaj obiekt AdView do układu aplikacji.

Ten przykład tworzy obiekt AdView i dodaje go do układu aplikacji:

private void createAdView(FrameLayout adViewContainer, Activity activity) {
  AdView adView = new AdView(activity);
  adViewContainer.addView(adView);
}

Układ XML

Dodaj element AdView do pliku XML układu:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

  <com.google.android.libraries.ads.mobile.sdk.banner.AdView
      android:id="@+id/adView"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      app:layout_constraintBottom_toBottomOf="parent"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Jetpack Compose

  1. Umieść element AndroidView w interfejsie Compose.
  2. Zdefiniuj zmienną mutableStateOf<BannerAd?> do przechowywania reklamy banerowej:
// Initialize required variables.
val context = LocalContext.current
var bannerAdState by remember { mutableStateOf<BannerAd?>(null) }

// The AdView is placed at the bottom of the screen.
Column(modifier = modifier.fillMaxSize(), verticalArrangement = Arrangement.Bottom) {
  bannerAdState?.let { bannerAd ->
    Box(modifier = Modifier.fillMaxWidth()) {
      // Display the ad within an AndroidView.
      AndroidView(
        modifier = modifier.wrapContentSize(),
        factory = { bannerAd.getView(requireActivity()) },
      )
    }
  }
}

Wczytywanie reklamy

Poniższy przykład wczytuje zakotwiczony baner adaptacyjny o szerokości 360 pikseli do obiektu AdView:

Kotlin

private fun loadBannerAd(adView: AdView, activity: Activity) {
  // Get a BannerAdRequest for a 360 wide anchored adaptive banner ad.
  val adSize = AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(activity, 360)
  val adRequest = BannerAdRequest.Builder(AD_UNIT_ID, adSize).build()

  adView.loadAd(
    adRequest,
    object : AdLoadCallback<BannerAd> {
      override fun onAdLoaded(ad: BannerAd) {
        ad.adEventCallback =
          object : BannerAdEventCallback {
            override fun onAdImpression() {
              Log.d(TAG, "Banner ad recorded an impression.")
            }

            override fun onAdClicked() {
              Log.d(TAG, "Banner ad clicked.")
            }
          }
      }

      override fun onAdFailedToLoad(adError: LoadAdError) {
        Log.e(TAG, "Banner ad failed to load: $adError")
      }
    },
  )
}

Java

private void loadBannerAd(AdView adView, Activity activity) {
  // Get a BannerAdRequest for a 360 wide anchored adaptive banner ad.
  AdSize adSize = AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(activity, 360);
  BannerAdRequest adRequest = new BannerAdRequest.Builder(AD_UNIT_ID, adSize).build();

  adView.loadAd(
      adRequest,
      new AdLoadCallback<BannerAd>() {
        @Override
        public void onAdLoaded(@NonNull BannerAd bannerAd) {
          bannerAd.setAdEventCallback(
              new BannerAdEventCallback() {
                @Override
                public void onAdImpression() {
                  Log.d(TAG, "Banner ad recorded an impression.");
                }

                @Override
                public void onAdClicked() {
                  Log.d(TAG, "Banner ad clicked.");
                }
              });
        }

        @Override
        public void onAdFailedToLoad(@NonNull LoadAdError adError) {
          Log.e(TAG, "Banner ad failed to load: " + adError);
        }
      });
}

Jetpack Compose

// Request an anchored adaptive banner with a width of 360.
val adSize = AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(requireContext(), 360)

// Load the ad when the screen is active.
val coroutineScope = rememberCoroutineScope()
val isPreviewMode = LocalInspectionMode.current
LaunchedEffect(context) {
  bannerAdState?.destroy()
  if (!isPreviewMode) {
    coroutineScope.launch {
      when (val result = BannerAd.load(BannerAdRequest.Builder(AD_UNIT_ID, adSize).build())) {
        is AdLoadResult.Success -> {
          bannerAdState = result.ad
        }
        is AdLoadResult.Failure -> {
          showToast("Banner failed to load.")
          Log.w(Constant.TAG, "Banner ad failed to load: $result.error")
        }
      }
    }
  }
}

Odświeżanie reklamy

Jeśli jednostka reklamowa jest skonfigurowana do odświeżania, nie musisz wysyłać kolejnej prośby o reklamę, gdy nie uda się jej wczytać. GMA Next-Gen SDK uwzględnia każdą częstotliwość odświeżania określoną w interfejsie Ad Managera. Jeśli nie masz włączonego odświeżania, wyślij nową prośbę. Więcej informacji o odświeżaniu jednostek reklamowych, np. o ustawianiu częstotliwości odświeżania, znajdziesz w artykule Częstotliwość odświeżania reklam w aplikacjach mobilnych.

Zwalnianie zasobu reklamy

Gdy skończysz korzystać z banera reklamowego, możesz zwolnić jego zasoby.

Aby zwolnić zasób reklamy, usuń ją z hierarchii widoków i usuń wszystkie odwołania do niej:

Kotlin 

// Remove banner from view hierarchy.
val parentView = adView?.parent
if (parentView is ViewGroup) {
  parentView.removeView(adView)
}

// Destroy the banner ad resources.
adView?.destroy()

// Drop reference to the banner ad.
adView = null

Java 

// Remove banner from view hierarchy.
if (adView.getParent() instanceof ViewGroup) {
  ((ViewGroup) adView.getParent()).removeView(adView);
}
// Destroy the banner ad resources.
adView.destroy();
// Drop reference to the banner ad.
adView = null;

Jetpack Compose 


// Destroy the ad when the screen is disposed.
DisposableEffect(Unit) { onDispose { bannerAdState?.destroy() } }

Zdarzenia reklamowe

Możesz nasłuchiwać wielu zdarzeń w cyklu życia reklamy, w tym wyświetleń i kliknięć reklamy, a także jej otwierania i zamykania. Zalecamy ustawienie wywołania zwrotnego przed wyświetleniem banera.

Kotlin

BannerAd.load(
  BannerAdRequest.Builder("/21775744923/example/adaptive-banner", adSize).build(),
  object : AdLoadCallback<BannerAd> {
    override fun onAdLoaded(ad: BannerAd) {
      ad.adEventCallback =
        object : BannerAdEventCallback {
          override fun onAdImpression() {
            // Banner ad recorded an impression.
          }

          override fun onAdClicked() {
            // Banner ad recorded a click.
          }

          override fun onAdShowedFullScreenContent() {
            // Banner ad showed.
          }

          override fun onAdDismissedFullScreenContent() {
            // Banner ad dismissed.
          }

          override fun onAdFailedToShowFullScreenContent(
            fullScreenContentError: FullScreenContentError
          ) {
            // Banner ad failed to show.
          }
        }
    }
    // ...
  }
)

Java

BannerAd.load(
    new BannerAdRequest.Builder("/21775744923/example/adaptive-banner", adSize).build(),
    new AdLoadCallback<BannerAd>() {
      @Override
      public void onAdLoaded(@NonNull BannerAd ad) {
        ad.setAdEventCallback(new BannerAdEventCallback() {
          @Override
          public void onAdImpression() {
            // Banner ad recorded an impression.
          }

          @Override
          public void onAdClicked() {
            // Banner ad recorded a click.
          }

          @Override
          public void onAdShowedFullScreenContent() {
            // Banner ad showed.
          }

          @Override
          public void onAdDismissedFullScreenContent() {
            // Banner ad dismissed.
          }

          @Override
          public void onAdFailedToShowFullScreenContent(
              @NonNull FullScreenContentError fullScreenContentError) {
            // Banner ad failed to show.
          }
        });

        // ...
      }
    });

Wywołanie zwrotne odświeżania reklamy

BannerAdRefreshCallback obsługuje zdarzenia odświeżania reklam, jeśli w przypadku banerów reklamowych używasz automatycznego odświeżania. Pamiętaj, aby ustawić wywołanie zwrotne przed dodaniem widoku reklamy do hierarchii widoków. Więcej informacji o odświeżaniu reklam znajdziesz w artykule Odświeżanie reklamy.

Kotlin

BannerAd.load(
  BannerAdRequest.Builder("/21775744923/example/adaptive-banner", adSize).build(),
  object : AdLoadCallback<BannerAd> {
    override fun onAdLoaded(ad: BannerAd) {
      ad.bannerAdRefreshCallback =
        object : BannerAdRefreshCallback {
          // Set the ad refresh callbacks.
          override fun onAdRefreshed() {
            // Called when the ad refreshes.
          }

          override fun onAdFailedToRefresh(loadAdError: LoadAdError) {
            // Called when the ad fails to refresh.
          }
        }

      // ...
    }
  }
)

Java

BannerAd.load(
    new BannerAdRequest.Builder("/21775744923/example/adaptive-banner", adSize).build(),
    new AdLoadCallback<BannerAd>() {
      @Override
      public void onAdLoaded(@NonNull BannerAd ad) {
        ad.setBannerAdRefreshCallback(
            // Set the ad refresh callbacks.
            new BannerAdRefreshCallback() {
              @Override
              public void onAdRefreshed() {
                // Called when the ad refreshes.
              }

              @Override
              public void onAdFailedToRefresh(@NonNull LoadAdError adError) {
                // Called when the ad fails to refresh.
              }
            });
        // ...
      }
    });

Akceleracja sprzętowa w przypadku reklam wideo

Aby reklamy wideo wyświetlały się prawidłowo w wyświetleniach banerów reklamowych, musi być włączona akceleracja sprzętowa.

Akceleracja sprzętowa jest domyślnie włączona, ale niektóre aplikacje mogą ją wyłączyć. Jeśli dotyczy to Twojej aplikacji, zalecamy włączenie akceleracji sprzętowej w przypadku klas, które korzystają z reklam.Activity

Włączanie akceleracji sprzętowej

Jeśli aplikacja nie działa prawidłowo po włączeniu akceleracji sprzętowej w całym systemie, możesz też sterować nią w przypadku poszczególnych działań. Aby włączyć lub wyłączyć akcelerację sprzętową, możesz użyć atrybutu android:hardwareAccelerated w przypadku elementów <application> i <activity> w pliku AndroidManifest.xml. W tym przykładzie włączamy akcelerację sprzętową w całej aplikacji, ale wyłączamy ją w przypadku jednej aktywności:

<application android:hardwareAccelerated="true">
    <!-- For activities that use ads, hardwareAcceleration should be true. -->
    <activity android:hardwareAccelerated="true" />
    <!-- For activities that don't use ads, hardwareAcceleration can be false. -->
    <activity android:hardwareAccelerated="false" />
</application>

Więcej informacji o opcjach sterowania akceleracją sprzętową znajdziesz w przewodniku po akceleracji sprzętowej. Pamiętaj, że wyświetleń poszczególnych reklam nie można włączyć w przypadku akceleracji sprzętowej, jeśli aktywność jest wyłączona, więc sama aktywność musi mieć włączoną akcelerację sprzętową.

Pobierz i uruchom przykładową aplikację, która pokazuje, jak używać GMA Next-Gen SDK.