Suivez ces instructions pour intégrer notre plugin Vungle Adobe Air dans une application modèle standard. Le code source référencé ici est disponible sur notre dépôt public GitHub.

Contenu

• Avant de commencer
• Étape 1. Inclure la bibliothèque d'extension
• Étape 2. Mettre à jour votre descripteur d'application
• Étape 3. Intégrer votre API Vungle
• Remarques supplémentaires
  • Utilisation de la classe de document VungleExample.as dans Animate ou Flash Professional CS6
  • Installation d'une nouvelle version du SDK AIR (4.0 ou supérieur) sous Flash Professional CS6
  • Installation d'une nouvelle version du SDK AIR (4.0 ou supérieur) sous Flash Builder
  • Résolution de l'erreur d'entrée invalide Adobe Animate

Avant de commencer

• L'extension Vungle nécessite la version 4.0 du SDK Adobe AIR ou une version ultérieure. Pour obtenir des instructions expliquant comment mettre à jour le SDK AIR sous Flash Builder ou Flash Professional, consultez la section "Notes supplémentaires".
  
  
• Si vous travaillez sous Android, l'extension Vungle AIR nécessite d'installer JDK 6 ou JDK 7 (selon la version de Flash que vous utilisez) sur le système de développement. Android 3.0 (Honeycomb - version 11 de l'API) ou une version ultérieure est nécessaire pour l'exécution de l'application.
  
  
• Vous pouvez consulter la Documentation des classes d'ActionScript 3.
  
  
• Examinez example/VungleExample.as pour obtenir un exemple de classe d'application. (Si vous être un utilisateur Flash Professional et ne savez pas comment utiliser une classe de document, reportez-vous à la section " Utilisation de la classe de document VungleExample.as sous Animate ou Flash Professional CS6 ? " à la fin de cet article.)

Étape 1. Inclure la bibliothèque d'extension

Commencez par créer un nouvel AIR pour votre projet mobile et ajoutez l'extension native. Vous devrez ajouter deux ou trois fichiers .ane :

• com.vungle.extensions.Vungle.ane
• com.vungle.extensions.android.AndroidSupportLib.ane
• com.vungle.extensions.android.GooglePlayServices.ane (Si vous ciblez Android, vous serez peut-être obligé d'ajouter la bibliothèque des Services Google Play à votre projet, mais étant donné que de nombreuses autres extensions incluent déjà cette bibliothèque, elle est peut-être déjà présente.)

Pour Animate et Flash Professional CS6 ou supérieur

1. Créez un nouveau projet AIR pour Android ou projet AIR pour iOS.
2. Sélectionnez Fichier → Paramètres de publication
3. Sélectionnez l'icône de la clé à molette à côté de Script pour accéder aux paramètres ActionScript.
4. Dans l'onglet Chemin de la bibliothèque, cliquez sur Rechercher un fichier Native Extension (ANE) puis sélectionnez le fichier vungle.extensions.Vungle.ane. Cliquez sur OK.
5. Sélectionnez l'icône de la clé à molette à côté de Cible pour accéder aux paramètres du lecteur.
6. Si vous ciblez Android : dans l'onglet Autorisations, activez 'INTERNET', 'WRITE_EXTERNAL_STORAGE' et 'ACCESS_NETWORK_STATE'.
7. Sélectionnez l'option Gérer manuellement les permissions et les ajouts Manifest pour cette application et cliquez sur OK.
8. Répétez les étapes 1 à 7, en sélectionnant com.vungle.extensions.android.AndroidSupportLib.ane à l'étape 4.
9. Si vous ciblez Android et que cette bibliothèque n'est pas présente, répétez à nouveau ces étapes, en sélectionnant le fichier com.vungle.extensions.android.GooglePlayServices.ane à l'étape 4.

Sous Flash Builder 4.6 ou supérieur

1. Dans Propriétés du projet, sous Chemin de génération Actionscript, sélectionnez Extensions natives.
2. Choisissez Ajouter ANE… et naviguez jusqu'au fichier vungle.extensions.Vungle.ane.
3. Sélectionnez Mise en package de la génération Actionscript → Google Android.
4. Dans l'onglet Extensions natives, sélectionnez l'option Package à côté de l'extension.
5. Répétez les étapes 1 et 2, en sélectionnant com.vungle.extensions.android.AndroidSupportLib.ane à l'étape 2.
6. Si vous ciblez iOS, répétez les étapes 3 et 4 pour Apple iOS.

Étape 2. Mettre à jour votre descripteur d'application

Pour que Vungle fonctionne, des modifications doivent être apportées au fichier XML de votre application. Modifiez le fichier XML créé par votre IDE avec les modifications suivantes.

Remarque : si vous utilisez Flash Professional, veillez à suivre les étapes ci-dessus pour inclure la bibliothèque d'extension "pour Animate et Flash Professional CS6 ou supérieur" ; sinon, Flash pourrait annuler vos modifications juste après leur application.

1. Définissez votre SDK AIR sur 4.0 (ou version ultérieure) dans le fichier descripteur de l'application :
   

   <application xmlns="http://ns.adobe.com/air/application/4.0">

2. Incluez un lien à l'extension dans le descripteur :

   <extensions>
   <extensionID>com.vungle.extensions.Vungle</extensionID>
   <extensionID>com.vungle.extensions.android.AndroidSupportLib</extensionID>
   </extensions> 

3. Si vous ciblez Android : vous devez inclure l'extension des services Google Play. Ajoutez également son ID d'extension.

   <extensions>
   <extensionID>com.vungle.extensions.Vungle</extensionID>
   <extensionID>com.vungle.extensions.android.AndroidSupportLib</extensionID>
   <extensionID>com.vungle.extensions.android.GooglePlayServices</extensionID>
   </extensions> 

Pour les applications AIR qui ciblent Android

Si vous ciblez Android, mettez à jour vos ajouts Android Manifest dans l'élément XML pour :

• inclure les permissions INTERNET, WRITE_EXTERNAL_STORAGE et ACCESS_NETWORK_STATE
• ajouter les définitions d'activité VideoFullScreenAdActivity,définitions d'activitéMraidFullScreenAdActivity, et MraidFullScreenAdActivity
• ajouter la balise de métadonnées google-play-services version :
  

   <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>

Étape 3. Intégrer l'API Vungle

L'API Vungle peut être ajoutée à votre application en quelques lignes d'ActionScript.

Initialiser l'extension Vungle

Remarque : un placement par défaut est créé automatiquement pour chaque application. Vous devez fournir l'ID de référence de son placement lors de l'étape d'initialisation que vous envisagiez ou non de profiter de ses fonctions. Si vous créez plusieurs placements, fournissez tous les ID de référence.

Initialisez l'API lorsque votre application se lance.

• Si vous utilisez du pur ActionScript, exécutez cette action dans le constructeur de votre classe de document.
• Si vous utilisez Flex, faites l'appel dans l'événement initialize() de la classe principale.
• Si vous utilisez un code de la ligne de temps sous Flash, faites-le sur la 1ere image.

1. Importez les classes d'API :
   

   import com.vungle.extensions.*; import com.vungle.extensions.events.*;

2. Initialisez l'API en appelant create() et en faisant passer une chaîne de votre ID d'application et un tableau contenant l'ID de référence du placement de l'application depuis le tableau de bord Vungle. Si vous ciblez iOS et Android via le même projet, saisissez un ID d'application différent et son tableau de placement pour chaque plateforme selon la méthode create().
   
   Terminez votre appel à Vungle.create() dans une instruction try/catch, car Vungle peut renvoyer une erreur lors du processus de création (par exemple, l'extension renvoie une erreur si elle est exécutée sur le bureau) :
   

   try { // initialiser avec votre id d'application Vungle.create("your_vungle_id", [“placement1”, “placement2”, “placement3”]); } catch (error:Error) { // impossible de créer une extension. Exécutez-vous autre chose qu'iOS/Android ? }

Charger une publicité de placement

Pour jouer une publicité de placement, vous devez charger une publicité pour ce placement. Notez que votre placement mis en cache automatiquement n'exige pas que vous appeliez cette méthode. Le SDK essaiera de charger la publicité pour le placement mis en cache automatiquement en interne.

Vungle.vungle.loadAd(“non_auto_cached_placement”);

Diffuser une publicité de placement

Vous aurez lorsque la publicité est prête à être jouée via les écouteurs d'événements. Lorsqu'un placement est disponible pour jouer une publicité, vous pouvez la jouer.

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

Ajouter des écouteurs d'événements

L'extension Vungle envoie quatre événements : VungleEvent.AD_PLAYABLE, VungleEvent.AD_STARTED, VungleEvent.AD_FINISHED, VungleEvent.AD_FAILED, VungleEvent.AD_INIT et VungleEvent.AD_LOG.

1. L'événement AD_PLAYABLE est envoyé lorsqu'une publicité est prête à être diffusée.
   

   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. Les événements AD_STARTED et AD_FINISHED sont respectivement envoyés lorsqu'une publicité est affichée et masquée :
   

   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. L'événement AD_INIT est envoyé lorsque le SDK Vungle a fini son initialisation.
   

   function onAdInit(e:VungleEvent):void { trace(“Vungle SDK is initialized: “ + e.isInitialized”); }

4. L'événement AD_LOG est envoyé lorsqu'un message de journal est envoyé par le SDK Vungle. Vous pouvez l'utiliser pour le débogage. La consignation est uniquement implémentée dans la version iOS du SDK Vungle. Cet événement est donc spécifique à une plate-forme.
   

   Vungle.vungle.setLoggingEnabled(true); Vungle.vungle.addEventListener(VungleEvent.AD_LOG, onAdLog); private function onAdLog(e:VungleEvent):void { log("ad log: " + e.message); }

Plus d'options

Comme vous avez déjà pu le voir, vous pouvez transmettre un objet avec des options de configuration lorsque vous appelez la méthode playAd().

Remarque : Les publicités récompensées sont parfois nommées publicités répondant au mécanisme d'incitation ; les deux termes font toujours référence au même type de publicité. Dans le code SDK et dans notre API de création, nous utilisons le terme « répondant au mécanisme d'incitation ».

Voici les propriétés disponibles dans VungleAdConfig :

flexViewCloseTimeInSec

Exemple de code :

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

Valeurs globales par défaut

Vous pouvez utiliser l'objet de configuration globale pour définir des valeurs par défaut pour les options :

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

Ensuite, chaque nouvel objet VungleAdConfig est créé avec ces valeurs définies par défaut. playAd() sans option utilise également la configuration globale.

Remarque : quand votre application est en mode Test, vous ne serez pas en mesure de télécharger les applications présentées. En outre, le Tableau de bord n'affichera pas le nombre d'impressions. Ceci est dû au fait que les publicités de test sont uniquement destinées à vérifier si vous avez intégré le SDK correctement. Cette fonctionnalité devient disponible seulement après que votre application est activée.

Publicités Flex View

Pour fermer une publicité Flex View par la programmation, appelez la fonction closeFlexViewAd une fois que l'annonce a démarré :

Vungle.vungle.closeFlexViewAd(placement);

Cette fonction ne s'applique qu'aux publicités Flex View et uniquement sur le SDK iOS Vungle.

Remarques supplémentaires

Utilisation de la classe de document VungleExample.as dans Animate ou Flash Professional CS6

1. Tout d'abord, créez l'application et ajoutez l'extension en suivant les étapes 1 à 3 de cet article d'intégration.
2. Copiez-collez dans le même dossier que votre .fla. Ne copiez et ne collez pas son contenu dans la ligne de temps.
3. Modifiez les ID d'application et ID de placement sur la ligne 20 pour qu'ils deviennent vos propres ID Vungle.
4. Dans les propriétés Flash, sous Classe de document, saisissez VungleExample et cliquez sur OK.
5. Créez et installez l'application.

Installation d'une nouvelle version du SDK AIR (4.0 ou supérieur) sous Flash Professional CS6

Suivez ce lien pour trouver le dernier SDK AIR. Si vous avez déjà installé AIR 4.0 ou supérieur, vous pouvez ignorer cette étape. Sinon, suivez les instructions ci-dessous :

1. Dézippez le package SDK AIR 4.0 ou supérieur dans un emplacement sur votre disque dur.
2. Lancez Flash Professional CS6.
3. Sélectionnez Aide → Gérer AIR SDK...
4. Cliquez sur le + (plus) et naviguez jusqu'à l'emplacement du SDK AIR dézippé.
5. Cliquez sur OK.
6. Sélectionnez Fichier → Paramètres de publication.
7. Sélectionnez le dernier SDK AIR pour iOS dans le menu déroulant Cible.

Installation d'une nouvelle version du SDK AIR (4.0 ou supérieur) sous Flash Builder

Suivez ce lien pour trouver le dernier SDK AIR. Si vous avez déjà installé AIR 4.0 ou supérieur, vous pouvez ignorer cette étape. Vous pouvez également utiliser les dernière instructions Adobe pour mettre à jour les SDK AIR Flash Builder.

Résolution de l'erreur d'entrée invalide Adobe Animate

Si vous obtenez une erreur comme illustré dans l'image ci-dessous, reportez-vous à cet article.