Annunci banner

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 da te specificata.

Banner adattivo ancorato

Gli annunci banner adattivi ancorati sono annunci con proporzioni fisse anziché normali annunci con dimensioni fisse. Le proporzioni sono simili allo standard di settore 320 x 50. Una volta specificata l'intera larghezza disponibile, verrà restituito un annuncio con altezza ottimale per quella larghezza. L'altezza ottimale non cambia tra le richieste provenienti dallo stesso dispositivo e non è necessario che le visualizzazioni circostanti si spostino quando l'annuncio si aggiorna.

Prerequisiti

Esegui sempre test con annunci di prova

Quando crei e test le tue app, assicurati di utilizzare annunci di prova anziché annunci di produzione pubblicati. In caso contrario, l'account potrebbe essere sospeso.

Il modo più semplice per caricare gli annunci di prova è utilizzare il nostro ID unità pubblicitaria di test dedicato per i banner iOS: ca-app-pub-3940256099942544/2435281174

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

Per ulteriori informazioni su come funzionano gli annunci di prova dell'SDK Mobile Ads, consulta Test Ads.

Crea un GADBannerView

Gli annunci banner vengono visualizzati negli oggetti GADBannerView, pertanto il primo passaggio per integrare gli annunci banner consiste nell'includere un GADBannerView nella gerarchia delle visualizzazioni. In genere, questa operazione viene eseguita in modo programmatico o tramite Interface Builder.

In modo programmatico

Puoi anche creare un'istanza direttamente di GADBannerView. Ecco un esempio di come creare un elemento GADBannerView, allineato al centro inferiore dell'area sicura dello schermo:

Swift

import GoogleMobileAds
import UIKit

class ViewController: UIViewController {

  var bannerView: GADBannerView!

  override func viewDidLoad() {
    super.viewDidLoad()
    
    let viewWidth = view.frame.inset(by: view.safeAreaInsets).width

    // Here the current interface orientation is used. Use
    // GADLandscapeAnchoredAdaptiveBannerAdSizeWithWidth or
    // GADPortraitAnchoredAdaptiveBannerAdSizeWithWidth if you prefer to load an ad of a
    // particular orientation,
    let adaptiveSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(viewWidth)
    bannerView = GADBannerView(adSize: adaptiveSize)

    addBannerViewToView(bannerView)
  }

  func addBannerViewToView(_ bannerView: GADBannerView) {
    bannerView.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(bannerView)
    view.addConstraints(
      [NSLayoutConstraint(item: bannerView,
                          attribute: .bottom,
                          relatedBy: .equal,
                          toItem: view.safeAreaLayoutGuide,
                          attribute: .bottom,
                          multiplier: 1,
                          constant: 0),
       NSLayoutConstraint(item: bannerView,
                          attribute: .centerX,
                          relatedBy: .equal,
                          toItem: view,
                          attribute: .centerX,
                          multiplier: 1,
                          constant: 0)
      ])
   }
   
}

Objective-C

@import GoogleMobileAds;

@interface ViewController ()

@property(nonatomic, strong) GADBannerView *bannerView;

@end

@implementation ViewController

- (void)viewDidLoad {
  [super viewDidLoad];
  
  // Here safe area is taken into account, hence the view frame is used after the
  // view has been laid out.
  CGRect frame = UIEdgeInsetsInsetRect(self.view.frame, self.view.safeAreaInsets);
  CGFloat viewWidth = frame.size.width;

  // Here the current interface orientation is used. If the ad is being preloaded
  // for a future orientation change or different orientation, the function for the
  // relevant orientation should be used.
  GADAdSize adaptiveSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(viewWidth);
  // In this case, we instantiate the banner with desired ad size.
  self.bannerView = [[GADBannerView alloc] initWithAdSize:adaptiveSize];

  [self addBannerViewToView:self.bannerView];
}

- (void)addBannerViewToView:(UIView *)bannerView {
  bannerView.translatesAutoresizingMaskIntoConstraints = NO;
  [self.view addSubview:bannerView];
  [self.view addConstraints:@[
    [NSLayoutConstraint constraintWithItem:bannerView
                               attribute:NSLayoutAttributeBottom
                               relatedBy:NSLayoutRelationEqual
                                  toItem:self.view.safeAreaLayoutGuide
                               attribute:NSLayoutAttributeBottom
                              multiplier:1
                                constant:0],
    [NSLayoutConstraint constraintWithItem:bannerView
                               attribute:NSLayoutAttributeCenterX
                               relatedBy:NSLayoutRelationEqual
                                  toItem:self.view
                               attribute:NSLayoutAttributeCenterX
                              multiplier:1
                                constant:0]
                                ]];
}
  
@end

Tieni presente che, in questo caso, non forniamo vincoli di larghezza o altezza, in quanto le dimensioni dell'annuncio fornite conferiscono al banner una dimensione intrinseca dei contenuti per dimensionare la visualizzazione.

Interface Builder

È possibile aggiungere GADBannerView a uno storyboard o a un file xib. Quando utilizzi questo metodo, assicurati di aggiungere vincoli di posizione solo sul banner. Ad esempio, quando mostri un banner adattivo nella parte inferiore dello schermo, imposta la parte inferiore della visualizzazione del banner in modo che corrisponda alla parte superiore della Guida di layout inferiore e la parte centrale del X in modo che sia uguale al centro X della superview.

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

Swift

  bannerView.adSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(viewWidth)

Objective-C

  self.bannerView.adSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(viewWidth);

Carica un annuncio

Una volta che GADBannerView è presente e le sue proprietà sono configurate, è il momento di caricare un annuncio. Per farlo, chiama loadRequest: su un oggetto GADRequest:

Swift

override func viewDidLoad() {
  super.viewDidLoad()
  ...
  
  //  Set the ad unit ID and view controller that contains the GADBannerView.
  bannerView.adUnitID = "ca-app-pub-3940256099942544/2435281174"
  bannerView.rootViewController = self

  bannerView.load(GADRequest())
}

Objective-C

-   (void)viewDidLoad {
  [super viewDidLoad];
  ...
  
  //  Set the ad unit ID and view controller that contains the GADBannerView.
  self.bannerView.adUnitID = @"ca-app-pub-3940256099942544/2435281174";
  self.bannerView.rootViewController = self;

  [self.bannerView loadRequest:[GADRequest request]];
}

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

Se il tuo annuncio non viene caricato, non è necessario richiederne un altro in modo esplicito, purché tu abbia configurato l'aggiornamento dell'unità pubblicitaria; l'SDK Google Mobile Ads rispetta la frequenza di aggiornamento specificata nell' AdMob UI. Se non hai attivato l'aggiornamento, dovrai inviare una nuova richiesta.

Eventi annuncio

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

Registrazione per eventi banner

Per registrarti per gli eventi di annunci banner, imposta la proprietà delegate su GADBannerView su un oggetto che implementa il protocollo GADBannerViewDelegate. In genere, la classe che implementa gli annunci banner agisce anche come classe delegato, nel qual caso la proprietà delegate può essere impostata su self.

Swift

import GoogleMobileAds
import UIKit

class ViewController: UIViewController, GADBannerViewDelegate {

  var bannerView: GADBannerView!

  override func viewDidLoad() {
    super.viewDidLoad()
    ...
    bannerView.delegate = self
  }
}

Objective-C

@import GoogleMobileAds;

@interface ViewController () <GADBannerViewDelegate>

@property(nonatomic, strong) GADBannerView *bannerView;

@end

@implementation ViewController

-   (void)viewDidLoad {
  [super viewDidLoad];
  ...
  self.bannerView.delegate = self;
}

Implementare gli eventi banner

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

Swift

func bannerViewDidReceiveAd(_ bannerView: GADBannerView) {
  print("bannerViewDidReceiveAd")
}

func bannerView(_ bannerView: GADBannerView, didFailToReceiveAdWithError error: Error) {
  print("bannerView:didFailToReceiveAdWithError: \(error.localizedDescription)")
}

func bannerViewDidRecordImpression(_ bannerView: GADBannerView) {
  print("bannerViewDidRecordImpression")
}

func bannerViewWillPresentScreen(_ bannerView: GADBannerView) {
  print("bannerViewWillPresentScreen")
}

func bannerViewWillDismissScreen(_ bannerView: GADBannerView) {
  print("bannerViewWillDIsmissScreen")
}

func bannerViewDidDismissScreen(_ bannerView: GADBannerView) {
  print("bannerViewDidDismissScreen")
}

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");
}

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

Swift Obiettivo-C

casi d'uso

Di seguito sono riportati alcuni casi d'uso di esempio di questi metodi relativi agli eventi annuncio.

Aggiunta di un banner alla gerarchia di visualizzazione una volta ricevuto un annuncio

È possibile che tu voglia ritardare l'aggiunta di un elemento GADBannerView alla gerarchia delle visualizzazioni fino a quando non viene ricevuto un annuncio. Puoi farlo ascoltando l'evento bannerViewDidReceiveAd::

Swift

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

Objective-C

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

Animazione di 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: GADBannerView) {
  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 prevede metodi per notificare eventi, ad esempio quando un clic causa la visualizzazione o la chiusura di un overlay. Se vuoi scoprire se questi eventi sono dovuti ad annunci, registrati per questi metodi GADBannerViewDelegate.

Per individuare tutti i tipi di presentazioni in overlay o chiamate da browser esterni, non solo quelle generate dai clic sugli annunci, è preferibile che la tua app rilevi i metodi equivalenti su UIViewController o UIApplication. Ecco una tabella che mostra i metodi iOS equivalenti che vengono richiamati contemporaneamente ai metodi GADBannerViewDelegate:

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

Altre risorse

Esempi su GitHub

Passaggi successivi

Banner comprimibili

Gli annunci banner comprimibili sono annunci banner che all'inizio vengono presentati come un overlay più grande, con un pulsante per comprimere l'annuncio riducendolo. Valuta la possibilità di utilizzarlo per ottimizzare ulteriormente il rendimento. Per ulteriori dettagli, consulta la sezione sugli annunci banner comprimibili.

Banner adattivi incorporati

I banner adattivi in linea sono banner più grandi e più alti rispetto ai banner adattivi ancorati. Hanno un'altezza variabile e possono raggiungere l'altezza dello schermo del dispositivo. I banner adattivi in linea sono consigliati rispetto agli annunci banner adattivi ancorati per le app che inseriscono gli annunci banner in contenuti scorrevoli. Per ulteriori dettagli, consulta i banner adattivi incorporati.

Esplora altri argomenti