Aggiungere il supporto degli annunci companion

Seleziona la piattaforma: HTML5 Android iOS

Questa guida è destinata agli editori interessati ad aggiungere annunci companion alla loro implementazione IMA per Android.

Prerequisiti

• App per Android con l'SDK IMA integrato. Se non hai già un'app con l'SDK integrato, consulta il BasicExample. Se hai bisogno di aiuto per implementare l'SDK IMA nella tua app, consulta Configurare l'SDK IMA.
• Un tag annuncio configurato per restituire un annuncio companion. Se hai bisogno di un esempio, consulta le nostre domande frequenti.

Aggiungere annunci companion all'app

Segui i passaggi per aggiungere un'area annunci companion e visualizzare gli annunci companion nella tua app.

Creare un ViewGroup per visualizzare l'annuncio companion

Prima di richiedere un annuncio companion, devi creare uno spazio per questo nel layout. Nel file XML del layout, aggiungi un elemento ViewGroup. In questo esempio viene utilizzato un LinearLayout. In un passaggio successivo, passerai un riferimento a questo elemento al tuo AdDisplayContainer.

Se stai eseguendo l'integrazione nell'app BasicExample, aggiungi questo al activity_my.xml file, sotto videoPlayerContainer.

<LinearLayout
    android:id="@+id/companionAdSlot"
    android:layout_width="match_parent"
    android:layout_height="250dp"
    android:layout_gravity="center_horizontal"
    android:gravity="center"
    android:orientation="vertical"
    android:textAlignment="center" />
companion_ad_slot_snippet.xml

Creare un CompanionAdSlot

Il passaggio successivo consiste nel creare un oggetto CompanionAdSlot, che viene poi aggiunto a un'istanza ArrayList<CompanionAdSlot>. L'interfaccia AdDisplayContainer accetta un elenco di slot per annunci companion, in modo da poter visualizzare più annunci companion contemporaneamente. Per creare l'oggetto CompanionAdSlot, devi creare un'istanza della classe ImaSdkFactory.

public void createCompanionAdSlot(ViewGroup companionViewGroup) {
  ImaSdkFactory sdkFactory = ImaSdkFactory.getInstance();
  CompanionAdSlot companionAdSlot = sdkFactory.createCompanionAdSlot(companionViewGroup);
  companionAdSlot.setSize(300, 250);
  ArrayList<CompanionAdSlot> companionAdSlots = new ArrayList<CompanionAdSlot>();
  companionAdSlots.add(companionAdSlot);
}
CompanionAdSnippets.java

Crea un'area annunci companion per ogni dimensione di annuncio companion che intendi mostrare nella tua app. L'SDK IMA popola l'area annunci companion con tutti gli annunci companion della risposta VAST le cui dimensioni corrispondono all'altezza e alla larghezza della visualizzazione. L'SDK IMA supporta anche l'utilizzo di annunci companion di dimensioni flessibili. Dopo aver creato gli companionAdSlots, aggiungili all'AdsLoader. Gli esempi seguenti mostrano come eseguire questa operazione a seconda che tu stia utilizzando l' estensione Exoplayer-IMA, o altre implementazioni IMA che non utilizzano l'estensione.

Estensione Exoplayer-IMA

public void setCompanionAdSlotExoPlayer(
    Context context, ArrayList<CompanionAdSlot> companionAdSlots) {
  ImaAdsLoader adsLoader =
      new ImaAdsLoader.Builder(context).setCompanionAdSlots(companionAdSlots).build();
}
CompanionAdSnippets.java

Altre implementazioni

public void setCompanionAdSlot(
    AdDisplayContainer adDisplayContainer, ArrayList<CompanionAdSlot> companionAdSlots) {
  adDisplayContainer.setCompanionSlots(companionAdSlots);
}
CompanionAdSnippets.java

E con questo è tutto! Ora la tua applicazione mostra gli annunci companion.

Visualizzare annunci companion flessibili

IMA supporta gli annunci companion flessibili. Questi annunci companion possono essere ridimensionati in base alle dimensioni dell'area annunci. Riempiono il 100% della larghezza della vista genitore, quindi ridimensionano l'altezza per adattarsi ai contenuti dell'annuncio companion. Vengono impostati utilizzando la dimensione dell'annuncio companion Fluid in Ad Manager. Consulta l'immagine seguente per scoprire dove impostare questo valore.

Aggiornare le app Android per gli annunci companion flessibili

Puoi dichiarare uno slot per annunci companion flessibili aggiornando il CompanionAdSlot.setSize() in modo che accetti CompanionAdSlot.FLUID_SIZE come entrambi i parametri.

companionAdSlot.setSize(CompanionAdSlot.FLUID_SIZE, CompanionAdSlot.FLUID_SIZE);
CompanionAdSnippets.java

Domande frequenti

Ho seguito la guida, ma non vedo gli annunci companion. Che cosa devo fare?

Innanzitutto, verifica che il tag restituisca effettivamente gli annunci companion. Per farlo, apri il tag in un browser web e cerca un tag <CompanionAds>. Se lo vedi, verifica che le dimensioni dell'annuncio companion restituito siano le stesse delle dimensioni che stai passando all'oggetto CompanionAdSlot.

Che aspetto avrà l'area annunci companion se seguo questa guida?

L'immagine seguente è stata creata da BasicExample e mostra il video dei contenuti in riproduzione in alto con l'annuncio companion sotto.