Le visualizzazioni banner sono annunci di testo o illustrati rettangolari che occupano uno spazio sullo schermo. Rimangono sullo schermo durante l'interazione degli utenti con l'app e possono aggiornarsi automaticamente dopo un certo periodo di tempo. Se non hai mai utilizzato un dispositivo mobile pubblicità, sono un ottimo punto di partenza.
Questa guida mostra come integrare le visualizzazioni dei banner in un'app Unity. Oltre agli snippet di codice e alle istruzioni, include anche informazioni su come impostare correttamente le dimensioni dei banner e link a risorse aggiuntive.
Prerequisiti
- Completa la Guida introduttiva.
Effettua sempre test con annunci di prova
Il seguente codice di esempio contiene un ID unità pubblicitaria che puoi utilizzare per richiedere annunci di prova. È stato appositamente configurato per restituire annunci di prova anziché annunci di produzione per ogni richiesta, quindi è possibile usarla in sicurezza.
Tuttavia, dopo aver registrato un'app nella nell'interfaccia web di Ad Manager e hai creato la tua unità pubblicitaria ID da utilizzare nella tua app, configura il dispositivo come prova in modo esplicito dispositivo durante sviluppo del prodotto.
/21775744923/example/adaptive-banner
Inizializzare l'SDK Mobile Ads
Prima di caricare gli annunci, chiedi all'app di inizializzare l'SDK Mobile Ads chiamando
MobileAds.Initialize()
. Questa operazione deve essere eseguita una sola volta, idealmente al momento del lancio dell'app.
using GoogleMobileAds;
using GoogleMobileAds.Api;
public class GoogleMobileAdsDemoScript : MonoBehaviour
{
public void Start()
{
// Initialize the Google Mobile Ads SDK.
MobileAds.Initialize((InitializationStatus initStatus) =>
{
// This callback is called once the MobileAds SDK is initialized.
});
}
}
Se utilizzi la mediazione, attendi che venga eseguito il callback prima di caricare gli annunci Ciò garantirà che tutti gli adattatori di mediazione siano inizializzati.
Esempio di BannerView
Il codice di esempio seguente indica in modo dettagliato come utilizzare la visualizzazione banner. In questo esempio,
per creare un'istanza di una visualizzazione banner, utilizza
AdManagerAdRequest
per caricare un annuncio nella visualizzazione banner e
e poi estenderne le capacità gestendo gli eventi del ciclo di vita.
Creare una visualizzazione banner
Il primo passaggio per utilizzare una visualizzazione banner consiste nel creare un'istanza di una visualizzazione banner
in uno script C# allegato a un GameObject
.
// This ad unit is configured to always serve test ads.
private string _adUnitId = "/21775744923/example/adaptive-banner";
AdManagerBannerView _bannerView;
/// <summary>
/// Creates a 320x50 banner view at top of the screen.
/// </summary>
public void CreateBannerView()
{
Debug.Log("Creating banner view");
// If we already have a banner, destroy the old one.
if (_bannerView != null)
{
DestroyAd();
}
// Create a 320x50 banner at top of the screen
_bannerView = new AdManagerBannerView(_adUnitId, AdSize.Banner, AdPosition.Top);
}
Il costruttore di un AdManagerBannerView
ha quanto segue
parametri:
adUnitId
: l'ID unità pubblicitaria da cuiAdManagerBannerView
dovrebbe caricare gli annunci.AdSize
: la dimensione dell'annuncio che vuoi utilizzare. Consulta Dimensioni banner per maggiori dettagli.AdPosition
: la posizione in cui devono essere inserite le visualizzazioni del banner. La L'enumAdPosition
elenca i valori di posizione dell'annuncio validi.
Osserva come vengono utilizzate le diverse unità pubblicitarie a seconda della piattaforma. Devi utilizzare un'unità pubblicitaria per iOS per effettuare richieste di annunci su iOS e un'unità pubblicitaria per Android per effettuare richieste su Android.
(Facoltativo) Creare una visualizzazione banner con una posizione personalizzata
Per un maggiore controllo sulla posizione di un AdManagerBannerView
posizionate sullo schermo rispetto ai valori di AdPosition
, usa il costruttore
che ha le coordinate x e y come parametri:
// Create a 320x50 banner views at coordinate (0,50) on screen.
_bannerView = new AdManagerBannerView(_adUnitId, AdSize.Banner, 0, 50);
L'angolo in alto a sinistra di AdManagerBannerView
è
ai valori x e y passati al costruttore, dove l'origine è
in alto a sinistra dello schermo.
(Facoltativo) Creare una visualizzazione banner con dimensioni personalizzate
Oltre a utilizzare una costante AdSize
, puoi anche specificare una dimensione personalizzata
per il tuo annuncio:
// Use the AdSize argument to set a custom size for the ad.
AdSize adSize = new AdSize(250, 250);
_bannerView = new AdManagerBannerView(_adUnitId, adSize, AdPosition.Bottom);
(Facoltativo) Più dimensioni degli annunci
Ad Manager ti consente di specificare più dimensioni degli annunci che potrebbero essere idonee alla pubblicazione
in un AdManagerBannerView
. Prima di implementare questa funzionalità nell'SDK, crea
un elemento pubblicitario che ha come target le stesse unità
pubblicitarie associate a creatività di dimensioni diverse.
Nella tua app, trasmetti più parametri AdSize
in ValidAdSizes
:
var adView = new AdManagerBannerView(_adUnitId, AdSize.Banner, AdPosition.Top);
adView.ValidAdSizes = new List<AdSize>
{
AdSize.Banner, new AdSize(120, 20), new AdSize(250, 250),
};
Se le dimensioni di AdManagerAdView
cambiano al momento dell'aggiornamento, il layout dovrebbe essere in grado di:
si adattano automaticamente alle nuove dimensioni. AdManagerAdView
assume per impostazione predefinita la dimensione passata nel primo parametro fino al ritorno dell'annuncio successivo.
Carica un annuncio banner
Dopo aver installato l'AdManagerBannerView
, procedi con il caricamento
un annuncio con il metodo LoadAd()
in AdManagerBannerView
. Prende un parametro che contiene
informazioni sul tempo di esecuzione, ad esempio informazioni sul targeting, etichette di esclusione e il publisher
ID fornito.
/// <summary>
/// Creates the banner view and loads a banner ad.
/// </summary>
public void LoadAd()
{
// create an instance of a banner view first.
if(_bannerView == null)
{
CreateAdManagerBannerView();
}
// create our request used to load the ad.
var adRequest = new AdManagerAdRequest();
// send the request to load the ad.
Debug.Log("Loading banner ad.");
_bannerView.LoadAd(adRequest);
}
Ascolta gli eventi di visualizzazione banner
Per personalizzare il comportamento dell'annuncio, puoi collegarti a una serie di eventi nel ciclo di vita dell'annuncio, come il caricamento, l'apertura o la chiusura. Per ascoltare questi eventi, registra un delegato:
/// <summary>
/// listen to events the banner view may raise.
/// </summary>
private void ListenToAdEvents()
{
// Raised when an ad is loaded into the banner view.
_bannerView.OnBannerAdLoaded += () =>
{
Debug.Log("Banner view loaded an ad with response : "
+ _bannerView.GetResponseInfo());
};
// Raised when an ad fails to load into the banner view.
_bannerView.OnBannerAdLoadFailed += (LoadAdError error) =>
{
Debug.LogError("Banner view failed to load an ad with error : "
+ error);
};
// Raised when the ad is estimated to have earned money.
_bannerView.OnAdPaid += (AdValue adValue) =>
{
Debug.Log(String.Format("Banner view paid {0} {1}.",
adValue.Value,
adValue.CurrencyCode));
};
// Raised when an impression is recorded for an ad.
_bannerView.OnAdImpressionRecorded += () =>
{
Debug.Log("Banner view recorded an impression.");
};
// Raised when a click is recorded for an ad.
_bannerView.OnAdClicked += () =>
{
Debug.Log("Banner view was clicked.");
};
// Raised when an ad opened full screen content.
_bannerView.OnAdFullScreenContentOpened += () =>
{
Debug.Log("Banner view full screen content opened.");
};
// Raised when the ad closed full screen content.
_bannerView.OnAdFullScreenContentClosed += () =>
{
Debug.Log("Banner view full screen content closed.");
};
}
Elimina la visualizzazione del banner
Quando hai finito di utilizzare la visualizzazione banner, assicurati di chiamare Destroy()
per rilasciare
Google Cloud.
/// <summary>
/// Destroys the banner view.
/// </summary>
public void DestroyAd()
{
if (_bannerView != null)
{
Debug.Log("Destroying banner view.");
_bannerView.Destroy();
_bannerView = null;
}
}
È tutto. L'app è ora pronta per mostrare annunci banner.
Dimensioni dei banner
La tabella seguente elenca le dimensioni standard dei banner.
Dimensioni in dp (LxA) | Descrizione | Disponibilità | Costante AdSize |
---|---|---|---|
320 x 50 | Banner standard | Cellulari e tablet | BANNER |
320 x 100 | Banner grande | Cellulari e tablet | LARGE_BANNER |
300 x 250 | Rettangolo medio IAB | Cellulari e tablet | MEDIUM_RECTANGLE |
468 x 60 | Banner a dimensione intera IAB | Tablet | FULL_BANNER |
728 x 90 | Classifica IAB | Tablet | LEADERBOARD |
Larghezza fornita x Altezza adattiva | Banner adattivo | Cellulari e tablet | N/D |
Larghezza dello schermo x 32|50|90 | Banner intelligente | Cellulari e tablet | SMART_BANNER |
Scopri di più sui banner adattivi. pensato per sostituire i banner intelligenti. |
Eventi app
Gli eventi app ti consentono di creare annunci che possono inviare messaggi al loro codice dell'app. L'app può quindi eseguire azioni basate su questi messaggi.
Puoi ascoltare eventi dell'app specifici di Ad Manager utilizzando AppEvent
. Questi eventi
possono verificarsi in qualsiasi momento durante il ciclo di vita dell'annuncio, anche prima che venga chiamato il caricamento.
namespace GoogleMobileAds.Api.AdManager;
/// The App event message sent from the ad.
public class AppEvent
{
// Name of the app event.
string Name;
// Argument passed from the app event.
string Value;
}
OnAppEventReceived
viene attivato quando si verifica un evento dell'app in un annuncio. Ecco un
esempio di come gestire questo evento nel codice:
_bannerview.OnAppEventReceived += (AppEvent args) =>
{
Debug.Log($"Received app event from the ad: {args.Name}, {args.Value}.");
};
Ecco un esempio che mostra come modificare il colore di sfondo di un'app a seconda di un evento app con un nome di colore:
_bannerview.OnAppEventReceived += (AppEvent args) =>
{
if (args.Name == "color")
{
Color color;
if (ColorUtility.TryParseColor(arg.Value, out color))
{
gameObject.GetComponent<Renderer>().material.color = color;
}
}
};
Di seguito è riportata la creatività corrispondente che invia l'evento app colore:
<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>
Risorse aggiuntive
- Esempio di HelloWorld: Implementazione minima di tutti i formati degli annunci.