Konfigurowanie banerów reklamowych

Wybierz platformę: Android iOS Unity Flutter Android (starsza wersja)

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

W tym przewodniku opisujemy, jak wczytać zakotwiczony adaptacyjny baner reklamowy w aplikacji na Androida.

Wymagania wstępne

Zawsze przeprowadzaj testy z użyciem reklam testowych

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

Najłatwiejszym sposobem wczytywania reklam testowych jest użycie naszego dedykowanego identyfikatora testowej jednostki reklamowej dla 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ć we własnych aplikacjach podczas kodowania, testowania i debugowania. Pamiętaj, aby przed opublikowaniem aplikacji zastąpić go własnym identyfikatorem jednostki reklamowej.

Więcej informacji o tym, jak działają reklamy testowe Google Mobile Ads SDK (Legacy), znajdziesz w artykule Włączanie reklam testowych.

Definiowanie widoku reklamy

Układ XML

Dodaj do pliku XML układu widok, który będzie służył jako kontener zakotwiczonego banera reklamowego:

<!-- Ad view container that fills the width of the screen and adjusts its
    height to the content of the ad. -->
<FrameLayout
        android:id="@+id/ad_view_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_alignParentBottom="true" />

Jetpack Compose

  1. Uwzględnij folder JetpackCompose Utilities. Ten folder zawiera obiekty pomocnicze do tworzenia obiektu AdView i komponentów.

  2. Utwórz AdView:


// Place the ad view at the bottom of the screen.
Column(modifier = modifier.fillMaxSize(), verticalArrangement = Arrangement.Bottom) {
  Box(modifier = modifier.fillMaxWidth()) { AdManagerBannerAd(adView, modifier) }
}

Ustawianie rozmiaru reklamy

Duże banery adaptacyjne to większy format przeznaczony do układów bez przewijania. W porównaniu ze standardowymi zakotwiczonymi banerami adaptacyjnymi te banery mogą mieć większą maksymalną wysokość – do 20% wysokości ekranu i od 50 do 150 dp. Ta większa przestrzeń jest zoptymalizowana pod kątem treści wideo.

Ustaw AdSize na zakotwiczony baner adaptacyjny o określonej szerokości:

Java


// Request an anchored adaptive banner with a width of 360.
adView.setAdSize(AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, 360));

Kotlin


// Request a large anchored adaptive banner with a width of 360.
adView.setAdSize(AdSize.getLargeAnchoredAdaptiveBannerAdSize(this, 360))

Jetpack Compose


// Set a large anchored adaptive banner ad size with a given width.
val adSize = AdSize.getLargeAnchoredAdaptiveBannerAdSize(LocalContext.current, 360)
adView.setAdSize(adSize)

Ustaw rozmiar reklamy mniejszy niż rozmiar ekranu urządzenia lub mu równy. Aby określić maksymalny rozmiar ekranu, użyj metody Resources.getDisplayMetrics. Wymiary obiektu AdSize są wyrażone w pikselach niezależnych od gęstości (dp). Podczas porównywania przekonwertuj rozmiar ekranu z pikseli na dp. Szczegółowe informacje o ograniczeniach rozmiaru znajdziesz w artykule Rozwiązywanie problemów z niewypełnionymi wyświetleniami w usłudze Ad Manager.

Dodaj AdManagerAdView do układu

Utwórz obiekt AdManagerAdView, używając rozmiaru reklamy, który chcesz dodać do układu aplikacji:

Java


// Create a new ad view.
adView = new AdManagerAdView(this);
adView.setAdUnitId(AD_UNIT);
// Request an anchored adaptive banner with a width of 360.
adView.setAdSize(AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, 360));

// Replace ad container with new ad view.
adContainerView.removeAllViews();
adContainerView.addView(adView);

Kotlin


// Create a new ad view.
val adView = AdManagerAdView(this)
adView.adUnitId = AD_UNIT_ID
// Request a large anchored adaptive banner with a width of 360.
adView.setAdSize(AdSize.getLargeAnchoredAdaptiveBannerAdSize(this, 360))
this.adView = adView

// Replace ad container with new ad view.
binding.adViewContainer.removeAllViews()
binding.adViewContainer.addView(adView)

Jetpack Compose


val adView = remember { AdManagerAdView(context) }

// Setup and load the adview.
// Set the unique ID for this specific ad unit.
adView.adUnitId = ADMANAGER_ADAPTIVE_BANNER_AD_UNIT_ID

// Set a large anchored adaptive banner ad size with a given width.
val adSize = AdSize.getLargeAnchoredAdaptiveBannerAdSize(LocalContext.current, 360)
adView.setAdSize(adSize)

// Place the ad view at the bottom of the screen.
Column(modifier = modifier.fillMaxSize(), verticalArrangement = Arrangement.Bottom) {
  Box(modifier = modifier.fillMaxWidth()) { AdManagerBannerAd(adView, modifier) }
}

Wczytywanie reklamy

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

Java

AdManagerAdRequest adRequest = new AdManagerAdRequest.Builder().build();
adView.loadAd(adRequest);

Kotlin

val adRequest = AdManagerAdRequest.Builder().build()
adView.loadAd(adRequest)

Odświeżanie reklamy

Jeśli jednostka reklamowa jest skonfigurowana do odświeżania, nie musisz wysyłać kolejnego żądania reklamy, gdy nie uda się jej wczytać. Google Mobile Ads SDK (Legacy) uwzględnia 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 reklamowego

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

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

Java

public void destroyBanner() {
  // Remove banner from view hierarchy.
  if (adView != null) {
    View parentView = (View) adView.getParent();
    if (parentView instanceof ViewGroup) {
      ((ViewGroup) parentView).removeView(adView);
    }

    // Destroy the banner ad resources.
    adView.destroy();
  }

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

Kotlin

fun destroyBanner() {
  // 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
}

Jetpack Compose

DisposableEffect(Unit) {
  // Destroy the AdView to prevent memory leaks when the screen is disposed.
  onDispose { adView.destroy() }
}

Zdarzenia reklamowe

Możesz nasłuchiwać wielu zdarzeń w cyklu życia reklamy, m.in. wczytywania, wyświetlenia reklamy i kliknięcia, a także otwarcia i zamknięcia. Zalecamy ustawienie wywołania zwrotnego przed wczytaniem banera.

Java

if (adView != null) {
  adView.setAdListener(
      new AdListener() {
        @Override
        public void onAdClicked() {
          // Code to be executed when the user clicks on an ad.
        }

        @Override
        public void onAdClosed() {
          // Code to be executed when the user is about to return
          // to the app after tapping on an ad.
        }

        @Override
        public void onAdFailedToLoad(@NonNull LoadAdError adError) {
          // Code to be executed when an ad request fails.
        }

        @Override
        public void onAdImpression() {
          // Code to be executed when an impression is recorded
          // for an ad.
        }

        @Override
        public void onAdLoaded() {
          // Code to be executed when an ad finishes loading.
        }

        @Override
        public void onAdOpened() {
          // Code to be executed when an ad opens an overlay that
          // covers the screen.
        }
      });
}

Kotlin

adView?.adListener =
  object : AdListener() {
    override fun onAdClicked() {
      // Code to be executed when the user clicks on an ad.
    }

    override fun onAdClosed() {
      // Code to be executed when the user is about to return
      // to the app after tapping on an ad.
    }

    override fun onAdFailedToLoad(adError: LoadAdError) {
      // Code to be executed when an ad request fails.
    }

    override fun onAdImpression() {
      // Code to be executed when an impression is recorded
      // for an ad.
    }

    override fun onAdLoaded() {
      // Code to be executed when an ad finishes loading.
    }

    override fun onAdOpened() {
      // Code to be executed when an ad opens an overlay that
      // covers the screen.
    }
  }

Każda z metod, które można zastąpić, w klasie AdListener odpowiada zdarzeniu w cyklu życia reklamy.

Metody, które można zastąpić
onAdClicked() Metoda onAdClicked() jest wywoływana, gdy zostanie zarejestrowane kliknięcie reklamy.
onAdClosed() Metoda onAdClosed() jest wywoływana, gdy użytkownik wraca do aplikacji po wyświetleniu docelowego adresu URL reklamy. Aplikacja może użyć tej metody, aby wznowić zawieszone działania lub wykonać inne czynności niezbędne do przygotowania się do interakcji.
onAdFailedToLoad() Metoda onAdFailedToLoad() jest jedyną, która zawiera parametr. Parametr błędu typu LoadAdError opisuje, jaki błąd wystąpił. Więcej informacji znajdziesz w dokumentacji dotyczącej debugowania błędów wczytywania reklam.
onAdImpression() Metoda onAdImpression() jest wywoływana, gdy zostanie zarejestrowane wyświetlenie reklamy.
onAdLoaded() Metoda onAdLoaded() jest wykonywana po zakończeniu wczytywania reklamy. Jeśli chcesz opóźnić dodanie AdManagerAdView do aktywności lub fragmentu, dopóki nie będziesz mieć pewności, że reklama zostanie wczytana, możesz to zrobić tutaj.
onAdOpened() Metoda onAdOpened() jest wywoływana, gdy reklama otwiera nakładkę, która zakrywa ekran.

Akceleracja sprzętowa w przypadku reklam wideo

Aby reklamy wideo wyświetlały się prawidłowo w widokach banerów reklamowych, musisz włączyć akcelerację sprzętową.

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 klasach Activity, które używają reklam.

Włączanie akceleracji sprzętowej

Jeśli aplikacja nie działa prawidłowo z włączoną globalnie akceleracją sprzętową, możesz ją kontrolować również w przypadku poszczególnych działań. Aby włączyć lub wyłączyć akcelerację sprzętową, możesz użyć atrybutu android:hardwareAccelerated dla elementów <application> i <activity> w pliku AndroidManifest.xml. W tym przykładzie akceleracja sprzętowa jest włączona w całej aplikacji, ale wyłączona w 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 kontrolowania akceleracji sprzętowej znajdziesz w przewodniku po akceleracji sprzętowej. Pamiętaj, że nie można włączyć akceleracji sprzętowej w przypadku wyświetleń pojedynczych reklam, jeśli aktywność jest wyłączona, więc aktywność musi mieć włączoną akcelerację sprzętową.

Ręczne zliczanie wyświetleń

Ręczne liczenie wyświetleń jest zgodne tylko z kampaniami w sprzedaży bezpośredniej i kampaniami autoreklam z kreacjami trafikowanymi bezpośrednio w usłudze Ad Manager. Nie należy go używać w przypadku reklam z elementów zapasowych ani z sieci zewnętrznych. Więcej informacji znajdziesz w artykule Zliczanie wyświetleń i kliknięć.

Jeśli masz specjalne warunki dotyczące tego, kiedy wyświetlenie powinno zostać zarejestrowane, możesz ręcznie wysyłać pingi wyświetleń do Ad Managera:

Java

if (adManagerAdView != null) {
  adManagerAdView.setManualImpressionsEnabled(true);
}

Kotlin

adManagerAdView?.setManualImpressionsEnabled(true)

Gdy ustalisz, że reklama została zwrócona i jest wyświetlana na ekranie, możesz ręcznie zarejestrować wyświetlenie:

Java

if (adManagerAdView != null) {
  adManagerAdView.recordManualImpression();
}

Kotlin

adManagerAdView?.recordManualImpression()

Zdarzenia w aplikacji

Zdarzenia w aplikacjach umożliwiają tworzenie reklam, które mogą wysyłać komunikaty do kodu aplikacji. Aplikacja może następnie podejmować działania na podstawie tych wiadomości.

Możesz nasłuchiwać zdarzeń aplikacji Ad Managera za pomocą AppEventListener. Zdarzenia te mogą wystąpić w dowolnym momencie cyklu życia reklamy, nawet przed wywołaniem metody onAdLoaded().

Ustaw AppEventListener na urządzeniu AdManagerAdView:

Java

if (adManagerAdView != null) {
  adManagerAdView.setAppEventListener(this);
}

Kotlin

adManagerAdView?.appEventListener = this

Oto przykład pokazujący, jak zmienić kolor tła aplikacji w zależności od zdarzenia w aplikacji o nazwie „color”:

Java

@Override
public void onAppEvent(@NonNull String name, @NonNull String info) {
  if (name.equals("color")) {
    switch (info) {
      case "green":
        // Set background color to green.
        break;
      case "blue":
        // Set background color to blue.
        break;
      default:
        // Set background color to black.
        break;
    }
  }
}

Kotlin

override fun onAppEvent(name: String, info: String) {
  if (name == "color") {
    when (info) {
      "green" -> {
        // Set background color to green.
      }
      "blue" -> {
        // Set background color to blue.
      }
      else -> {
        // Set background color to black.
      }
    }
  }
}

Oto odpowiednia kreacja, która wysyła do detektora komunikaty o zdarzeniach w aplikacji związanych z kolorami:

<html>
<head>
  <script src="//www.gstatic.com/afma/api/v1/google_mobile_app_ads.js"></script>
  <script>
    document.addEventListener("DOMContentLoaded", function() {
      // Send a color=green event when ad loads.
      admob.events.dispatchAppEvent("color", "green");

      document.getElementById("ad").addEventListener("click", function() {
        // Send a color=blue event when ad is clicked.
        admob.events.dispatchAppEvent("color", "blue");
      });
    });
  </script>
  <style>
    #ad {
      width: 320px;
      height: 50px;
      top: 0px;
      left: 0px;
      font-size: 24pt;
      font-weight: bold;
      position: absolute;
      background: black;
      color: white;
      text-align: center;
    }
  </style>
</head>
<body>
  <div id="ad">Carpe diem!</div>
</body>
</html>

Przykładową implementację zdarzeń w aplikacji w aplikacji demonstracyjnej interfejsu API znajdziesz w artykule o zdarzeniach w aplikacji Ad Managera.

Java Kotlin JetpackCompose

Dalsze kroki

Banery zwijane

Zwijane banery reklamowe to banery, które początkowo wyświetlają się jako większa nakładka z przyciskiem umożliwiającym zmniejszenie reklamy. Rozważ użycie go, aby jeszcze bardziej zoptymalizować skuteczność. Więcej informacji znajdziesz w artykule Zwijane banery reklamowe.

Wbudowane banery adaptacyjne

Wbudowane banery adaptacyjne są większe i wyższe niż zakotwiczone banery adaptacyjne. Mają zmienną wysokość i mogą być tak wysokie jak ekran urządzenia. Wbudowane banery adaptacyjne są zalecane zamiast zakotwiczonych banerów adaptacyjnych w aplikacjach, które umieszczają banery reklamowe w przewijanych treściach. Więcej informacji znajdziesz w artykule o wbudowanych banerach adaptacyjnych.

Przeglądaj inne tematy