Erste Schritte mit Vungle (SDK v. 5.1 und höher) - Adobe AIR

Folgen Sie diesen Anweisungen zur Integration unseres Vungle Adobe Air Plugins in eine grundlegende Beispielanwendung. Der Quellcode, auf den wir hier Bezug nehmen, ist über unsere öffentliche GitHub Repository verfügbar.

Inhalt

Bevor Sie anfangen

  • Die Vungle-Erweiterung erfordert Adobe AIR SDK 4.0 oder neuer. Anweisungen zur Aktualisierung von SDK in Flash Builder oder Flash Professional, finden Sie im Abschnitt "Weitere Hinweise".

  • Wenn Sie mit Android arbeiten, erfordert die Vungle AIR-Erweiterung die Installation von JDK 6 oder JDK 7 (je nach verwendeter Flash-Version) auf dem Entwicklungssystem. Android 3.0 (Honeycomb - API-Version 11) oder neuer ist erforderlich, damit die Anwendung läuft.

  • Sehen Sie sich die ActionScript 3-Klassen-Dokumentation an.

  • Sehen Sie sich example/VungleExample.as für eine beispielhafte Anwendungsklasse an. (Wenn Sie Flash Professional verwenden und nicht sicher sind, wie eine Dokumentenklasse verwendet wird, lesen Sie "Verwendung der VungleExample.as Dokumentationsklasse in Animate oder Flash Professional CS6" am Ende dieses article.)

Schritt 1. Erfassen der Erweiterungsbibliothek

Erstellen Sie zunächst ein neues AIR for mobile-Projekt und fügen Sie die native Erweiterung hinzu.

Wenn Android Ihr Ziel ist, müssen Sie gegebenenfalls außerdem die Google Play Services-Bibliothek zu Ihrem Projekt hinzufügen: Da viele Erweiterungen bereits in dieser Bibliothek enthalten sind, ist sie vielleicht bereits vorhanden. Um diese Erweiterung hinzuzufügen, wiederholen Sie die Schritte unten, aber verwenden Sie com.vungle.extensions.android.GooglePlayServices.ane anstatt von com.vungle.extensions.Vungle.ane.

Für Animate und Flash Professional CS6 oder neuer

  1. Erstellen Sie ein neues AIR für Android oder AIR für iOS Projekt.
  2. Wählen Sie Datei → Veröffentlichungs-Settings...
  3. Wählen Sie das Schraubenschlüssel-Symbol neben Skript für "ActionScript -Einstellungen".
  4. Klicken Sie in der Registerkarte Bibliothekspfad auf Nach nativen Erweiterungsdateien (ANE) suchen und wählen Sie die vungle.extensions.Vungle.ane Datei. Klicken Sie auf OK.
  5. Wählen Sie das Schraubenschlüssel-Symbol neben Ziel für "Player-Einstellungen".
  6. Wenn Android Ihr Ziel ist: Aktivieren Sie in der Registerkarte Berechtigungen "INTERNET", "WRITE_EXTERNAL_STORAGE" und "ACCESS_NETWORK_STATE".
  7. Wählen Sie die Option Berechtigungen manuell verwalten und Ergänzungen für diese App anzeigen und klicken Sie auf OK.

Für Flash Builder 4.6 oder neuer

  1. Wählen Sie in den Projekteigenschaften unter Baupfad für Actionscript Native Erweiterungen.
  2. Wählen Sie Hinzufügen ANE... und navigieren Sie zur vungle.extensions.Vungle.ane-Datei.
  3. Wählen sie Baupaket für Actionscript → Google Android.
  4. Wählen Sie in der Registerkarte Native Erweiterungen neben der Erweiterung die Option Paket.
  5. Wenn die Verwendung in iOS vorgesehen ist, wiederholen Sie die Schritte 3 und 4 für das Ziel "Apple iOS".

Schritt 2. Aktualisierung Ihres Anwendungsbeschreibers

Damit Vungle funktioniert, sind Änderungen an der XML-Datei Ihrer App erforderlich. Passen Sie die XML-Datei, die von Ihrem IDE erstellt wurde, den folgenden Änderungen an:

Hinweis: Falls Sie Flash Professional verwenden, stellen Sie sicher, dass Sie den obenstehenden Schritten zur Miteinbeziehung der Bibliothek "für Animate und Flash Professional CS6 oder neuer " befolgt haben. Anderenfalls setzt Flash möglicherweise Ihre Änderungen zurück, während Sie diese vornehmen.

  1. Stellen Sie Ihre AIR-SDK in der App Beschreiber-Datei auf 4.0 (oder neuer):
    <application xmlns="http://ns.adobe.com/air/application/4.0">
  2. Fügen Sie im Beschreiber einen Link auf die Erweiterung hinzu:
    <extensions>
    <extensionID>com.vungle.extensions.Vungle</extensionID>
    </extensions>
  3. Wenn Android Ihr Ziel ist, müssen Sie gegebenenfalls die Google Play Services-Erweiterung miteinbeziehen. Fügen Sie hier auch die Erweiterungs-ID hinzu.
    <extensions>
    <extensionID>com.vungle.extensions.Vungle</extensionID>
    <extensionID>com.vungle.extensions.android.GooglePlayServices</extensionID>
    </extensions>

Für AIR Anwendungen, die Android zum Ziel haben

Wenn Android Ihr Ziel ist, passen Sie Ihre Android-Manifest-Erweiterungen im Android XML-Element wie folgt an:

  • Beziehen Sie folgende Berechtigungen mit ein: INTERNET, WRITE_EXTERNAL_STORAGE und ACCESS_NETWORK_STATE
  • fügen Sie VideoFullScreenAdActivity hinzu,MraidFullScreenAdActivity, und MraidFullScreenAdActivity Aktivitätsdefinitionen
  • fügen Sie das google-play-services Versions-Metadaten-Tag hinzu:
    
    <android>
    <manifestAdditions><![CDATA[
    
    <manifest android:installLocation="auto">
    
    <uses-permission android:name="android.permission.INTERNET"/>
     <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" android:maxSdkVersion="18" />
     <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
     <application>
       <meta-data android:name="com.google.android.gms.version" android:value="@integer/google_play_services_version"/>
       <activity android:name="com.vungle.publisher.VideoFullScreenAdActivity"
         android:configChanges="keyboardHidden|orientation|screenSize|screenLayout|smallestScreenSize"
         android:theme="@android:style/Theme.NoTitleBar.Fullscreen"/>
       <activity android:name="com.vungle.publisher.MraidFullScreenAdActivity"
         android:configChanges="keyboardHidden|orientation|screenSize|screenLayout|smallestScreenSize"
         android:theme="@android:style/Theme.Translucent.NoTitleBar.Fullscreen"/>
       <activity android:name="com.vungle.publisher.FlexViewAdActivity"
         android:configChanges="keyboardHidden|orientation|screenSize|screenLayout|smallestScreenSize"
         android:theme="@android:style/Theme.Translucent.NoTitleBar.Fullscreen"/>
     </application>
    
    </manifest>
    ]]></manifestAdditions>
    </android>

Schritt 3. Integrieren Sie die Vungle API

Die Vungle-API kann mit nur wenigen Zeilen von ActionScript zu Ihrer Anwendung hinzugefügt werden.

Initialisieren Sie die Vungle Erweiterung

Hinweis: Eine Standard-Platzierung wird automatisch für jede App erstellt. Sie müssen die Referenz-ID dieser Platzierung in diesem Initialisierungsschritt bereitstellen, auch wenn Sie nicht von der Platzierungs-Funktion Gebrauch machen möchten. Bei der Erstellung mehrerer Platzierungen müssen Sie alle Referenz-IDs angeben.

Initialisieren Sie die API, wenn Ihre Anwendung startet.

  • Wenn Sie ActionScript allein verwenden, führen Sie dies im Konstruktor Ihrer Dokumentenklasse durch.
  • Bei der Verwendung von Flex rufen Sie dies im initialize()-Event der Hauptklasse.
  • Wenn Sie unter Flash den Timeline-Code verwenden, führen Sie dies auf Frame 1 durch.
  1. Importieren Sie die API-Klassen:
    import com.vungle.extensions.*; 
    import com.vungle.extensions.events.*;
  2. <Initialisieren Sie die API durch Aufrufen von <code>create() und Hinzufügen eines Strings Ihrer Anwendungs-ID und eines Arrays, das die Referenz-ID der Platzierung von Ihrer Anwendung über das Vungle Dashboard. Wenn Sie sowohl iOS als auch Android im gleichen Projekt zum Ziel haben, stellen Sie die unterschiedliche Anwendungs-ID und ihr Platzierungs-Array über die Plattform zur create()-Methode hinzu.

    Wrappen Sie Ihren Call an Vungle.create() in einen Try/Catch, da Vungle während des Erstellungsvorgangs vielleicht einen Fehler ausgibt (die Erweiterung gibt z.B. einen Fehler aus, wenn sie auf dem Desktop läuft):
    try
    {
        // Initialisierung mit Ihrer App-ID
        Vungle.create("your_vungle_id", [“placement1”, “placement2”, “placement3”]);
     
    } catch (error:Error) {
        // Erweiterung konnte nicht erstellt werden. Läuft die Anwendung auf etwas außer iOS/Android?
    }

Laden einer Werbung

Zum Laden einer Platzierungswerbung müssen Sie eine Werbung für diese Platzierung laden. Beachten Sie, dass für Ihre automatisch gecachte Platzierung diese Methode nicht gerufen werden muss. Das SDK versucht weiterhin die automatisch gecachte Platzierung intern zu laden.

Vungle.vungle.loadAd(“non_auto_cached_placement”);

Abspielen einer Platzierungswerbung

Die Bereitschaft einer Werbung zum Abspielen wird über Event-Listener bekannt gegeben. Sobald eine Platzierung zum Abspielen verfügbar ist, können Sie eine Werbung abspielen.

If (Vungle.vungle.isAdAvailable(“placement_id”)) {
    Vungle.vungle.playAd(“placement_id”);
}

Event-Listener hinzufügen

Die Vungle Erweiterung verschickt diese vier Events: VungleEvent.AD_PLAYABLE, VungleEvent.AD_STARTED, VungleEvent.AD_FINISHED, VungleEvent.AD_FAILED, VungleEvent.AD_INIT und VungleEvent.AD_LOG.

  1. AD_PLAYABLE wird abgeschickt, wenn eine Werbung zum Abspielen bereit ist.
    Vungle.vungle.addEventListener(VungleEvent.AD_PLAYABLE, onAdPlayable);
    function onAdPlayable(e:VungleEvent):void
    {
        if (e.isAdPlayable) {
            trace(“ad is playable for placement: “ + e.placement);
            Vungle.vungle.playAd(e.placement);
        } else {
    	trace(“ad not playable for placement: “ + e.placement);
        }
    }
  2. Die Events AD_STARTED und AD_FINISHED werden abgeschickt, wenn eine Werbung angezeigt bzw. beendet wird:
    Vungle.vungle.addEventListener(VungleEvent.AD_STARTED, onAdStarted);
    Vungle.vungle.addEventListener(VungleEvent.AD_FINISHED, onAdFinished);
    
    function onAdStarted(e:VungleEvent):void
    {
        trace("ad displayed for placement: " + e.placement);
    }
    
    function onAdFinished(e:VungleEvent):void
    {
        trace("ad dismissed for placement: “ + e.placement + “, CTA = " + e.wasCallToActionClicked);
    
        if (e.wasSuccessfulView) {	
            trace("counts a completed view - present reward.");
        }
    }
  3. AD_INITwird verschickt, wenn das Vungle SDK die Initialisierung abgeschlossen hat.
    function onAdInit(e:VungleEvent):void
    {
        trace(“Vungle SDK is initialized: “ + e.isInitialized”);
    }
  4. AD_LOG wird abgeschickt, wenn ein Log-Nachricht vom Vungle-SDK gesendet wurde. Dies kann zum Debuggen verwendet werden. Das Loggen ist nur im Vungle SDK für iOS integriert; dieses Event ist also plattformspezifisch.
    Vungle.vungle.setLoggingEnabled(true);
    Vungle.vungle.addEventListener(VungleEvent.AD_LOG, onAdLog);
    
    private function onAdLog(e:VungleEvent):void
    {
        log("ad log: " + e.message);
    }

Weitere Optionen

Wie bereits vorher festgestellt wurde, kann ein Objekt mit Konfigurationsoptionen hinzugefügt werden, wenn die playAd()-Methode abgerufen wird. Dies sind die verfügbaren Eigenschaften in VungleAdConfig:

Option

Wert

Beschreibung

orientation

VungleOrientation

Android

●      VungleOrientation.AUTO_ROTATE

●      VungleOrientation.ANDROID_MATCH_VIDEO

iOS

●      VungleOrientation.IOS_LANDSCAPE

●      VungleOrientation.IOS_PORTRAIT

soundEnabled

Boolean

Bei true (standardmäßig) wird der Ton entsprechend der Sound-Einstellungen des Gerätes während des Werbevideos aktiviert. Bei false ist die Wiedergabe bei Beginn stummgeschaltet. Beachten Sie, dass der Nutzer den Ton während der Wiedergabe aktivieren oder deaktivieren kann.

backButtonImmediatelyEnabled

Boolean

Ausschließlich bei Android kann der Nutzer eine Werbung unmittelbar mit der Schaltfläche "Zurück" verlassen, wenn es auf true gesetzt wird. Bei false (Standard) kann der Nutzer die Werbung erst dann mit der Schaltfläche "Zurück" verlassen, wenn die Schaltfläche "Schließen" auf dem Bildschirm angezeigt wird.

immersiveMode

Boolean

Ausschließlich bei Android: Bei true wird der immsersive Modus auf KitKat+ Geräten aktiviert. Es ist standardmäßig auf false gestellt.

incentivizedUserId

String

Die einmalige Nutzer-ID können Sie Ihrer Anwendung übergeben, um zu überprüfen, dass dieser Nutzer für das Ansehen einer Werbung mit Anreiz belohnt werden soll.

incentivizedCancelDialogTitle

String

Sie können eine Nachricht zur Anzeige beim Nutzer anpassen, wenn diese versuchen, das Video vorm Abschluss zu schließen.

 

Hinweis: Diese Option trifft nur auf standardmäßige Vungle Werbungen zu und nicht auf dynamische Vorlagen-Werbungen. Die Option für dynamische Vorlagen-Werbungen kann über das Dashboard bestimmt werden und bietet die gleichen Optionen.

incentivizedCancelDialogBodyText

incentivizedCancelDialogCloseButtonText

incentivizedCancelDialogKeepWatchingButtonText

Beispielcode:

var adConfig:VungleAdConfig = new VungleAdConfig();
            
adConfig.orientation = VungleOrientation.ANDROID_MATCH_VIDEO | VungleOrientation.IOS_LANDSCAPE;
adConfig.soundEnabled = false;

android: {
    adConfig.backButtonImmediatelyEnabled = true;
    adConfig.immersiveMode = true;
};

adConfig.incentivizedUserId = "vungle_test_user";
adConfig.incentivizedCancelDialogBodyText = "body_text";
adConfig.incentivizedCancelDialogCloseButtonText = "close_button_text";
adConfig.incentivizedCancelDialogKeepWatchingButtonText = "continue_button_text";
adConfig.incentivizedCancelDialogTitle = "title_text";

Vungle.vungle.playAd(placement, adConfig);

Globale Vorgaben

Sie können globale Konfigurationsobjekte verwenden, um die Standard-Werte für diese Optionen einzustellen:

// set any configuration options you like
VungleAdConfig.globalConfig.orientation = VungleOrientation.ANDROID_MATCH_VIDEO;
VungleAdConfig.globalConfig.soundEnabled = false;

Dann wird jedes neue VungleAdConfig-Objekt mit diesen standardmäßig eingestellten Werten erstellt. playAd() ohne Optionen verwendet ebenso die globalen Einstellungen.

HINWEIS: Während Ihre App sich im Testmodus befindet, können Sie keine der beworbenen Apps herunterladen. Darüber hinaus wird das Dashboard die Anzahl der Impressionen nicht bekanntgeben. Das liegt daran, dass Testanzeigen nur zum Prüfen dienen, ob Sie das SDK korrekt integriert haben. Diese Funktionalität wird verfügbar, sobald Ihre App im aktiven Modus live ist.

Weitere Hinweise

Verwendung der VungleExample.as Dokumentenklasse in Animate oder Flash Professional CS6

  1. Erstellen Sie zunächst die Anwendung und fügen Sie die Erweiterung hinzu, indem Sie die Schritte 1 bis 3 dieses Integrationsartikels befolgen.
  2. Kopieren Sie und fügen Sie in den gleichen Ordner wie Ihre .fla ein. Fügen Sie die kopierten Inhalte nicht in die Zeitlinie ein.
  3. Ändern Sie die App- und Platzierungs-IDs auf Zeile 20, damit Sie Ihren Vungle App-IDs entsprechen.
  4. Geben Sie in den Flash-Eigenschaften unter Dokumentenklasse VungleExample ein und klicken Sie auf Sie OK.
  5. Die Anwendung bauen und installieren.

Installation einer neueren Version von AIR SDK (4.0 oder neuer) in Flash Professional CS6

Folgen Sie diesem Link zum Erhalt des aktuellsten AIR SDK. Wenn Sie AIR 4.0 oder neuer bereits installiert haben, kann dieser Schritt übersprungen werden. Ansonsten befolgen Sie die unten beschriebenen Anweisungen:

  1. Entpacken Sie das Paket von AIR 4.0 oder neuer in ein Verzeichnis auf Ihrer Festplatte.
  2. Starten Sie Flash Professional CS6.
  3. Wählen Sie Hilfe → AIR verwalten SDK...
  4. Drücken Sie die Plus-Taste + und navigieren Sie zu dem Verzeichnis, in dem AIR SDK entpackt wurde.
  5. Klicken Sie auf OK.
  6. Wählen Sie Datei → Veröffentlichungseinstellungen.
  7. Wählen Sie das aktuellste AIR SDK für iOS aus dem Ziel-Dropdownmenü.

Installation einer neueren Version von AIR SDK (4.0 oder neuer) in Flash Builder

Folgen Sie diesem Link zum Erhalt des aktuellsten AIR SDK. Wenn Sie AIR 4.0 oder neuer bereits installiert haben, kann dieser Schritt übersprungen werden. Sie können auch auf die aktuellen Anweisungen von Adobe zur Aktualisierung des Flash Builder AIR SDK zurückgreifen.

Den Fehler "Adobe Animate falsche Eingabe" beheben

Wenn Sie einen Fehler wie im Bild unten erhalten, schauen Sie sich diesen Artikel an.

image2.png

Haben Sie Fragen? Anfrage einreichen

Kommentare