Banery reklamowe

Banery reklamowe to prostokątne reklamy, które zajmują część układu aplikacji. Pozostają na ekranie, gdy użytkownicy wchodzą w interakcję z aplikacją – są zakotwiczone u góry lub u dołu ekranu albo pozostają w tekście podczas przewijania strony. Banery reklamowe mogą być automatycznie odświeżane po upływie określonego czasu. Więcej informacji znajdziesz w artykule Omówienie banerów reklamowych.

Z tego przewodnika dowiesz się, jak zacząć korzystać z zakotwiczonych banerów adaptacyjnych, które zwiększają skuteczność kampanii dzięki optymalizacji rozmiaru reklamy na każdym urządzeniu przy użyciu określonej przez Ciebie szerokości reklamy.

Zakotwiczony baner adaptacyjny

Zakotwiczone banery adaptacyjne to reklamy o stałych proporcjach, a nie zwykłe reklamy o stałym rozmiarze. Współczynnik proporcji jest podobny do standardowego banera 320x50. Gdy określisz pełną dostępną szerokość, zwróci ona reklamę o optymalnej wysokości dla tej szerokości. Optymalna wysokość nie zmienia się w przypadku żądań z tego samego urządzenia, a otaczające widoki nie muszą się przesuwać, gdy reklama jest odświeżana.

Wymagania wstępne

• Zapoznaj się z przewodnikiem dla początkujących.

Zawsze testuj za pomocą reklam testowych

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

Najłatwiejszym sposobem wczytywania reklam testowych jest użycie specjalnego identyfikatora testowej jednostki reklamowej na banery w iOS:

ca-app-pub-3940256099942544/2435281174

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 identyfikatorem swojej jednostki reklamowej.

Więcej informacji o działaniu reklam testowych w pakiecie SDK do reklam mobilnych znajdziesz w artykule Reklamy testowe.

Tworzenie obiektu GADBannerView

Banery reklamowe są wyświetlane w GADBannerView obiektach, więc pierwszym krokiem w integracji banerów reklamowych jest umieszczenie elementu GADBannerView w hierarchii widoków. Zwykle odbywa się to programowo lub za pomocą narzędzia Interface Builder.

automatycznie,

GADBannerView można też utworzyć bezpośrednio. W tym przykładzie tworzymy GADBannerView:

// Initialize the BannerView.
bannerView = BannerView()

bannerView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(bannerView)

// This example doesn't give width or height constraints, as the ad size gives the banner an
// intrinsic content size to size the view.
NSLayoutConstraint.activate([
  // Align the banner's bottom edge with the safe area's bottom edge
  bannerView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor),
  // Center the banner horizontally in the view
  bannerView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
])
BannerSnippets.swift

private struct BannerViewContainer: UIViewRepresentable {
  typealias UIViewType = BannerView
  let adSize: AdSize

  init(_ adSize: AdSize) {
    self.adSize = adSize
  }

  func makeUIView(context: Context) -> BannerView {
    let banner = BannerView(adSize: adSize)
    banner.adUnitID = "ca-app-pub-3940256099942544/2435281174"
    banner.load(Request())
    banner.delegate = context.coordinator
    return banner
  }

  func updateUIView(_ uiView: BannerView, context: Context) {}

  func makeCoordinator() -> BannerCoordinator {
    return BannerCoordinator(self)
  }
BannerContentView.swift

var body: some View {
  Spacer()
  // Request an anchored adaptive banner with a width of 375.
  let adSize = currentOrientationAnchoredAdaptiveBanner(width: 375)
  BannerViewContainer(adSize)
    .frame(width: adSize.size.width, height: adSize.size.height)
}
BannerContentView.swift

// Initialize the GADBannerView.
self.bannerView = [[GADBannerView alloc] init];

self.bannerView.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:self.bannerView];

// This example doesn't give width or height constraints, as the ad size gives the banner an
// intrinsic content size to size the view.
[NSLayoutConstraint activateConstraints:@[
    // Align the banner's bottom edge with the safe area's bottom edge
    [self.bannerView.bottomAnchor constraintEqualToAnchor:self.view.safeAreaLayoutGuide.bottomAnchor],
    // Center the banner horizontally in the view
    [self.bannerView.centerXAnchor constraintEqualToAnchor:self.view.centerXAnchor],
]];
BannerSnippets.m

Interface Builder

Możesz dodać GADBannerView do pliku storyboard lub xib. Jeśli używasz tej metody, pamiętaj, aby dodawać do banera tylko ograniczenia pozycji. Na przykład podczas wyświetlania adaptacyjnego banera u dołu ekranu ustaw dolną krawędź widoku banera na górną krawędź dolnego układu pomocniczego, a ograniczenie centerX ustaw na centerX widoku nadrzędnego.

Rozmiar reklamy banerowej jest nadal ustawiany automatycznie:

// Request an anchored adaptive banner with a width of 375.
bannerView.adSize = currentOrientationAnchoredAdaptiveBanner(width: 375)
ViewController.swift

// Request an anchored adaptive banner with a width of 375.
self.bannerView.adSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(375);
ViewController.m

Wczytywanie reklamy

Gdy GADBannerView jest już na miejscu i ma skonfigurowane właściwości, takie jak adUnitID, czas wczytać reklamę. W tym celu wywołaj loadRequest: na obiekcie GADRequest:

bannerView.load(Request())
ViewController.swift

banner.adUnitID = "ca-app-pub-3940256099942544/2435281174"
banner.load(Request())
BannerContentView.swift

[self.bannerView loadRequest:[GADRequest request]];
ViewController.m

GADRequest reprezentują pojedyncze żądanie reklamy i zawierają właściwości dotyczące m.in. informacji o kierowaniu.

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ć. Pakiet SDK do reklam mobilnych Google uwzględnia każdą częstotliwość odświeżania określoną w interfejsie AdMob. 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 Używanie opcji automatycznego odświeżania w przypadku banerów reklamowych.

Zdarzenia reklamowe

Za pomocą GADBannerViewDelegate możesz nasłuchiwać zdarzeń cyklu życia, np. zamknięcia reklamy lub opuszczenia aplikacji przez użytkownika.

Rejestrowanie wydarzeń banerowych

Aby zarejestrować zdarzenia związane z reklamami banerowymi, ustaw właściwość delegate w GADBannerView na obiekt, który implementuje protokół GADBannerViewDelegate. Zwykle klasa, która implementuje reklamy banerowe, pełni też funkcję klasy delegata. W takim przypadku właściwość delegate można ustawić na self.

bannerView.delegate = self
ViewController.swift

banner.delegate = context.coordinator
BannerContentView.swift

self.bannerView.delegate = self;
ViewController.m

Implementowanie zdarzeń banera

Każda z metod w GADBannerViewDelegate jest oznaczona jako opcjonalna, więc musisz zaimplementować tylko te metody, które chcesz. W tym przykładzie zaimplementowano każdą metodę i zapisano komunikat w konsoli:

func bannerViewDidReceiveAd(_ bannerView: BannerView) {
  print(#function)
}

func bannerView(_ bannerView: BannerView, didFailToReceiveAdWithError error: Error) {
  print(#function + ": " + error.localizedDescription)
}

func bannerViewDidRecordClick(_ bannerView: BannerView) {
  print(#function)
}

func bannerViewDidRecordImpression(_ bannerView: BannerView) {
  print(#function)
}

func bannerViewWillPresentScreen(_ bannerView: BannerView) {
  print(#function)
}

func bannerViewWillDismissScreen(_ bannerView: BannerView) {
  print(#function)
}

func bannerViewDidDismissScreen(_ bannerView: BannerView) {
  print(#function)
}
ViewController.swift

- (void)bannerViewDidReceiveAd:(GADBannerView *)bannerView {
  NSLog(@"bannerViewDidReceiveAd");
}

- (void)bannerView:(GADBannerView *)bannerView didFailToReceiveAdWithError:(NSError *)error {
  NSLog(@"bannerView:didFailToReceiveAdWithError: %@", [error localizedDescription]);
}

- (void)bannerViewDidRecordImpression:(GADBannerView *)bannerView {
  NSLog(@"bannerViewDidRecordImpression");
}

- (void)bannerViewWillPresentScreen:(GADBannerView *)bannerView {
  NSLog(@"bannerViewWillPresentScreen");
}

- (void)bannerViewWillDismissScreen:(GADBannerView *)bannerView {
  NSLog(@"bannerViewWillDismissScreen");
}

- (void)bannerViewDidDismissScreen:(GADBannerView *)bannerView {
  NSLog(@"bannerViewDidDismissScreen");
}
ViewController.m

Przykład implementacji metod przekazywania banerów znajdziesz w aplikacji demonstracyjnej interfejsu iOS API w sekcji Ad Delegate.

Swift Objective-C

Przypadki użycia

Oto kilka przykładowych przypadków użycia tych metod zdarzeń związanych z reklamami.

Dodawanie banera do hierarchii widoków po otrzymaniu reklamy

Możesz opóźnić dodanie elementu GADBannerView do hierarchii widoków do momentu otrzymania reklamy. Możesz to zrobić, nasłuchując zdarzenia bannerViewDidReceiveAd::

func bannerViewDidReceiveAd(_ bannerView: BannerView) {
  // Add banner to view and add constraints.
  addBannerViewToView(bannerView)
}

- (void)bannerViewDidReceiveAd:(GADBannerView *)bannerView {
  // Add bannerView to view and add constraints as above.
  [self addBannerViewToView:self.bannerView];
}

Animowanie banera reklamowego

Możesz też użyć zdarzenia bannerViewDidReceiveAd:, aby animować baner reklamowy po jego zwróceniu, jak pokazano w tym przykładzie:

func bannerViewDidReceiveAd(_ bannerView: BannerView) {
  bannerView.alpha = 0
  UIView.animate(withDuration: 1, animations: {
    bannerView.alpha = 1
  })
}

- (void)bannerViewDidReceiveAd:(GADBannerView *)bannerView {
  bannerView.alpha = 0;
  [UIView animateWithDuration:1.0 animations:^{
    bannerView.alpha = 1;
  }];
}

Wstrzymywanie i wznawianie aplikacji

Protokół GADBannerViewDelegate ma metody powiadamiania o zdarzeniach, np. gdy kliknięcie powoduje wyświetlenie lub zamknięcie nakładki. Jeśli chcesz śledzić, czy te zdarzenia były spowodowane przez reklamy, zarejestruj się w tych metodach:GADBannerViewDelegate

Aby wykrywać wszystkie typy prezentacji nakładkowych lub wywołań zewnętrznych przeglądarek, a nie tylko te, które pochodzą z kliknięć reklam, aplikacja powinna nasłuchiwać odpowiednich metod w UIViewController lub UIApplication. W tabeli poniżej znajdziesz odpowiedniki metod iOS, które są wywoływane w tym samym czasie co metody GADBannerViewDelegate:

Dodatkowe materiały

Przykłady w GitHubie

• Przykład zakotwiczonych adaptacyjnych banerów reklamowych: Swift | SwiftUI | Objective-C

• Demonstracja funkcji zaawansowanych:Swift | Objective-C

Dalsze kroki

Banery zwijane

Banery zwijane to reklamy banerowe, które początkowo wyświetlają się jako większa nakładka z przyciskiem umożliwiającym zwinięcie reklamy do mniejszego rozmiaru. Możesz go użyć, aby jeszcze bardziej zoptymalizować skuteczność. Więcej informacji znajdziesz w sekcji zwijane banery reklamowe.

Wbudowane banery adaptacyjne

Wbudowane banery adaptacyjne są większe i wyższe od zakotwiczonych banerów adaptacyjnych. Mają zmienną wysokość i mogą zajmować całą wysokość ekranu urządzenia. W przypadku aplikacji, w których banery reklamowe są umieszczane w treściach, które można przewijać, zalecane są adaptacyjne banery śródtekstowe zamiast zakotwiczonych adaptacyjnych banerów reklamowych. Więcej informacji znajdziesz w sekcji banery adaptacyjne w treści.

Przeglądaj inne tematy

• Prywatność użytkownika