Annunci banner

Seleziona la piattaforma: Android iOS Unity Flutter

Gli annunci banner sono annunci rettangolari che occupano una parte del layout di un'app. Rimangono sullo schermo durante l'interazione degli utenti con l'app, ancorati nella parte superiore o inferiore dello schermo o in linea con i contenuti mentre l'utente scorre. Gli annunci banner possono aggiornarsi automaticamente dopo un determinato periodo di tempo. Per saperne di più, consulta la Panoramica degli annunci banner.

Questa guida mostra come iniziare a utilizzare gli annunci banner adattivi ancorati, che massimizzano il rendimento ottimizzando le dimensioni dell'annuncio per ogni dispositivo utilizzando una larghezza dell'annuncio specificata.

Banner adattivo ancorato

Gli annunci banner adattivi ancorati hanno proporzioni fisse anziché le normali dimensioni fisse. Le proporzioni sono simili a quelle dello standard di settore 320x50. Una volta specificata la larghezza completa disponibile, viene restituito un annuncio con l'altezza ottimale per quella larghezza. L'altezza ottimale non cambia nelle richieste dello stesso dispositivo e le visualizzazioni circostanti non devono spostarsi quando l'annuncio viene aggiornato.

Prerequisiti

Esegui sempre i test con gli annunci di prova

Quando crei ed esegui test sulle tue app, assicurati di utilizzare annunci di prova anziché annunci di produzione live. In caso contrario, il tuo account potrebbe essere sospeso.

Il modo più semplice per caricare gli annunci di prova è utilizzare il nostro ID unità pubblicitaria di prova dedicato per i banner iOS:

ca-app-pub-3940256099942544/2435281174

È stato configurato appositamente per restituire annunci di test per ogni richiesta e puoi utilizzarlo liberamente nelle tue app durante la codifica, i test e il debug. Assicurati solo di sostituirlo con il tuo ID unità pubblicitaria prima di pubblicare l'app.

Per saperne di più sul funzionamento degli annunci di test dell'SDK Mobile Ads, consulta Annunci di test.

Crea un GADBannerView

Gli annunci banner vengono visualizzati negli oggetti GADBannerView, quindi il primo passo per integrarli è includere un GADBannerView nella gerarchia delle visualizzazioni. Questa operazione viene in genere eseguita a livello di programmazione o tramite Interface Builder.

In modo programmatico

È anche possibile creare direttamente un GADBannerView. L'esempio seguente crea un GADBannerView:

Swift

// 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

SwiftUI

Per utilizzare un BannerView, crea un UIViewRepresentable:

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

Aggiungi UIViewRepresentable alla gerarchia di visualizzazione, specificando i valori height e width:

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

Objective-C

// 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

Puoi aggiungere un GADBannerView a uno storyboard o a un file xib. Quando utilizzi questo metodo, assicurati di aggiungere solo vincoli di posizione al banner. Ad esempio, quando visualizzi un banner adattivo nella parte inferiore dello schermo, imposta la parte inferiore della visualizzazione del banner in modo che sia uguale alla parte superiore della guida di layout inferiore e imposta il vincolo centerX in modo che sia uguale a centerX della supervisualizzazione.

Le dimensioni dell'annuncio banner vengono comunque impostate in modo programmatico:

Swift

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

Objective-C

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

Caricare un annuncio

Una volta inserito il GADBannerView e configurate le relative proprietà, ad esempio adUnitID, è il momento di caricare un annuncio. Per farlo, chiama loadRequest: su un oggetto GADRequest:

Swift

bannerView.load(Request())
ViewController.swift

SwiftUI

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

Objective-C

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

Gli oggetti GADRequest rappresentano una singola richiesta di annuncio e contengono proprietà per elementi come le informazioni di targeting.

Aggiornare un annuncio

Se hai configurato l'unità pubblicitaria in modo che venga aggiornata, non devi richiedere un altro annuncio quando il caricamento dell'annuncio non va a buon fine. L'SDK Google Mobile Ads rispetta qualsiasi frequenza di aggiornamento che hai specificato nell'interfaccia utente AdMob. Se non hai attivato l'aggiornamento, invia una nuova richiesta. Per ulteriori dettagli sull'aggiornamento delle unità pubblicitarie, ad esempio l'impostazione di una frequenza di aggiornamento, consulta Utilizzare l'aggiornamento automatico per gli annunci banner.

Eventi annuncio

Utilizzando GADBannerViewDelegate, puoi ascoltare gli eventi del ciclo di vita, ad esempio quando un annuncio viene chiuso o l'utente esce dall'app.

Registrarsi agli eventi banner

Per registrarti agli eventi degli annunci banner, imposta la proprietà delegate di GADBannerView su un oggetto che implementa il protocollo GADBannerViewDelegate. In genere, la classe che implementa gli annunci banner funge anche da classe delegata, nel qual caso la proprietà delegate può essere impostata su self.

Swift

bannerView.delegate = self
ViewController.swift

SwiftUI

banner.delegate = context.coordinator
BannerContentView.swift

Objective-C

self.bannerView.delegate = self;
ViewController.m

Implementare gli eventi banner

Ciascuno dei metodi in GADBannerViewDelegate è contrassegnato come facoltativo, quindi devi implementare solo i metodi che ti interessano. Questo esempio implementa ogni metodo e registra un messaggio nella console:

Swift

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

Objective-C

- (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

Consulta l'esempio di delega dell'annuncio per un'implementazione dei metodi di delega del banner nell'app demo dell'API iOS.

Swift Objective-C

Casi d'uso

Ecco alcuni casi d'uso di esempio per questi metodi di eventi pubblicitari.

Aggiungere un banner alla gerarchia delle visualizzazioni una volta ricevuto un annuncio

Potresti voler ritardare l'aggiunta di un GADBannerView alla gerarchia di visualizzazione finché non viene ricevuto un annuncio. Puoi farlo ascoltando l'evento bannerViewDidReceiveAd::

Swift

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

Objective-C

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

Animare un annuncio banner

Puoi anche utilizzare l'evento bannerViewDidReceiveAd: per animare un annuncio banner una volta restituito, come mostrato nell'esempio seguente:

Swift

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

Objective-C

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

Mettere in pausa e riprendere l'app

Il protocollo GADBannerViewDelegate ha metodi per notificarti gli eventi, ad esempio quando un clic causa la visualizzazione o la chiusura di un overlay. Se vuoi tracciare se questi eventi sono dovuti agli annunci, registrati a questi metodi GADBannerViewDelegate.

Per rilevare tutti i tipi di presentazioni in overlay o invocazioni di browser esterni, non solo quelli provenienti dai clic sugli annunci, è meglio che la tua app ascolti i metodi equivalenti su UIViewController o UIApplication. Di seguito è riportata una tabella che mostra i metodi iOS equivalenti richiamati contemporaneamente ai metodi GADBannerViewDelegate:

Metodo GADBannerViewDelegate Metodo iOS
bannerViewWillPresentScreen: viewWillDisappear: di UIViewController
bannerViewWillDismissScreen: viewWillAppear: di UIViewController
bannerViewDidDismissScreen: viewDidAppear: di UIViewController

Risorse aggiuntive

Esempi su GitHub

Passaggi successivi

Banner comprimibili

Gli annunci banner comprimibili sono annunci banner che inizialmente vengono presentati come overlay più grande, con un pulsante per comprimere l'annuncio a una dimensione più piccola. Valuta la possibilità di utilizzarlo per ottimizzare ulteriormente il rendimento. Per maggiori dettagli, consulta la sezione sugli annunci banner comprimibili.

Banner adattivi in linea

I banner adattivi in linea sono più grandi e più alti rispetto ai banner adattivi ancorati. Hanno un'altezza variabile e possono occupare l'intero schermo del dispositivo. I banner adattivi in linea sono consigliati rispetto agli annunci banner adattivi ancorati per le app che posizionano gli annunci banner in contenuti scorrevoli. Per ulteriori dettagli, consulta la sezione Banner adattivi in linea.

Esplora altri argomenti