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
- Completa la Guida introduttiva.
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.
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
- Esempio di annunci banner adattivi ancorati: Swift | Objective-C
- Demo sulle funzionalità avanzate: Swift | Objective-C
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.