Sujets sur : ActionScript 3

Comment utiliser le microphone dans une application Flash et avec Adobe AIR pour Android ?

7 questions

Ecrit le 9 juillet par Matthieu
Publié dans le(s) sujet(s) ActionScript 3 |Android

Récemment, je discutais avec des amis musiciens qui me demandaient s’il était possible d’enregistrer du son directement à partir d’une application web ou depuis son téléphone portable.

Hors il s’avère que Flash possède des fonctionnalités très pratique pour l’enregistrement audio.

Avec plusieurs bibliothèques ActionScript, il est même possible de créer un véritable logiciel d’édition audio en ligne !

Pour continuer la suite de la série de tutoriels sur Adobe AIR et les applications flash pour Android, voici une formation flash sur l’utilisation du microphone avec Flash et Adobe AIR.

Voici ce que vous allez découvrir dans ce cours flash :

  • La solution pour activer et utiliser le microphone d’un ordinateur ou d’un smartphone.
  • Comment enregistrer un fichier audio à partir du micro.
  • La technique pour encoder votre fichier audio au format MP3.
  • Comment lancer la lecture du fichier audio juste après l’enregistrement.
  • Une astuce pour personnaliser les fameux Tags ID3 associés au fichier MP3.
  • Une technique pour proposer à l’utilisateur le téléchargement du fichier MP3 créé.

Cette formation flash vous apprend à enregistrer un fichier audio à partir du micro de l’utilisateur, puis à l’exporter au format MP3.

Microphone avec Flash et Adobe AIR pour Android

Version démonstration

Voici la version de l’application « Microphone » pour le Web.

La version Android est identique, il suffit juste de créer une application profil « Air – Android » dans FDT.

Télécharger le code source Microphone

Vous trouvez ci-dessous l’application Microphone pour le Flash Player.

Télécharger “Microphone avec Flash et Adobe AIR pour Android”

ex-microphone.zip – Téléchargé 943 fois – 391,25 Ko

Voici les différentes bibliothèques utilisées pour créer l’application Microphone :

  • as3wavsound pour lire des fichiers au format wav.
  • micrecorder pour utiliser simplement l’objet Microphone de Flash.
  • Shine MP3 Encoder pour encoder, directement depuis Flash, des fichiers audios au format MP3.

Avez-vous déjà créés des applications flash avec l’enregistrement du son ?

Vous avez peut être créé un éditeur de musique totalement en ligne comme celui ci ?

Ou utilisez-vous une technique, des bibliothèques différentes pour effectuer une gestion audio précise.

Dites-moi cela dans les commentaires ci-dessous.

La bibliothèque standingwave3 permet justement de manipuler les fichiers audios (ajout de filtres, génération de son…).

 

Comment arrondir un nombre en 2 lignes de code avec ActionScript / Flash ?

Commentaires fermés sur Comment arrondir un nombre en 2 lignes de code avec ActionScript / Flash ?

Ecrit le 1 juillet par Matthieu
Publié dans le(s) sujet(s) ActionScript 3 |Cours AS3

Pour continuer à répondre à vos nombreuses questions suite à la Formation AS3 Facile,

Voici une question qui revient très souvent de la part des Développeurs :

  • Comment arrondir des nombres en ActionScript / Flash ?
Il y a plusieurs solutions.
Je vous propose une fonction très simple et très rapide à utiliser dans vos applications flash.

Arrondir un Nombre

Nous allons tout simplement utiliser la fonction d’arrondi par défaut de la classe Math de Flash.

Et nous allons la combiner à l’utilisation des puissances de 10 pour obtenir le nombre de décimales souhaitées.

Tout se résumé à seulement 2 lignes de code ! (voir 1 seule)

[codesyntax lang= »actionscript3″ title= »Rounding » bookmarkname= »Rounding »]

[/codesyntax]

La 1ère ligne calcule la puissance de 10 nécessaire.

Sur la 2ème ligne, il y a plusieurs calculs à la suite :

  • Premièrement, le nombre est multiplié par la puissance de 10 pour décaler la virgule.
  • Deuxième le nombre est arrondi avec Math.round().
  • Dernièrement, la puissance de 10 divise le nombre pour mettre la virgule au bon endroit et afficher les décimales.

Démonstration Arrondir un Nombre

Appuyez sur le bouton « c’est parti » pour lancer l’arrondi de nombre aléatoire.

Télécharger le code source Arrondir un Nombre

L’application de démonstration « Arrondir un Nombre » met en pratique les cours ActionScript ci-dessous :

Posez vos questions ActionScript / Flash ?

Posez-moi dès maintenant vos questions ActionScript / Flash, et je vous répondrai dans les prochains tutoriels.

Comment communiquer entre Flash et javascript / Html avec ExternalInterface ?

Commentaires fermés sur Comment communiquer entre Flash et javascript / Html avec ExternalInterface ?

Ecrit le 17 juin par Matthieu
Publié dans le(s) sujet(s) ActionScript 3 |Cours AS3

Après avoir appris comment échanger des informations entre Flash et Php / MySQL, maintenant, vous allez apprendre une technique encore plus intéressante pour ajouter du dynamisme à vos applications :

  • L’échange de données entre Flash et javascript / Html via la classe ExternalInterface.

Il est possible de combiner une application flash qui interagit avec du contenu Html via du javascript.

En fonction des actions de l’utilisateur, vous pouvez d’un côté mettre à jour le contenu Flash ou le contenu Html !

Voici ce que vous allez apprendre dans ce tutoriel flash :

  • Comment mettre en oeuvre de la classe ExternalInterface pour activer la communication Flash / javascript.
  • La technique pour créer des fonctions javascript et ainsi modifier le contenu Html depuis Flash.
  • Comment à partir d‘un contenu Html dynamique, mettre à jour votre application Flash.

Cette formation flash vous permet d‘ajouter des possibilités supplémentaires dans vos applications en partageant des informations entre Flash – javascript et Html.

ExternalInterface – Flash / javascript / Html

Version démonstration

La version de démonstration pratique de l’application se situe juste à la fin de ce tutoriel flash.

Télécharger le code source du cours ActionScript

Et voici le code source de l’application Flash pour échanger des informations avec javascript / Html.

Télécharger “Communication Flash Javascript Html”

ex-communication-flash-javascript-html.zip – Téléchargé 757 fois – 92,44 Ko

Avez-vous déjà mis en œuvre cette technique dans vos applications flash ?

Par exemple, vous pouvez combiner dans une application (un site web ou autre) de l’Html 5 (via de l’Ajax) et du Flash pour créer une application Html 5 / Flash qui réunit le meilleur des 2 technologies.

Partagez vos questions / projets ci-dessous.

Créer des swf polices partagées – embed fonts en pure ActionScript

2 questions

Ecrit le 3 mai par Matthieu
Publié dans le(s) sujet(s) ActionScript 3 |Cours AS3

Le tutoriel flash de cette semaine vous propose une nouvelle méthode rapide pour créer des swf contenant des polices de caractères ou embed fonts.

C’est une solution qui utilise des outils entièrement gratuits comme FDT ou encore FlashDevelop.

Voici ce que vous allez apprendre dans ce tutoriel ActionScript :

  • La technique en pure ActionScript pour créer des swf contenant des polices de caractères.
  • Cette solution est compatible quelque soit l’éditeur ActionScript : Adobe CS5, FDT, FlashDevelop…
  • Comment créer des swf embed fonts ou polices partagées, directement à partir de fichiers ttf.
  • La méthode pour associer plusieurs styles (italique, gras, gras-italique) à la même police.
  • Une technique unique pour associer une police gras et une police italique à partir de fichiers ttf différents à une embed font identique dans flash !
  • La stratégie pas à pas pour le chargement dynamique du swf contenant les embed fonts – polices partagées.
  • Et surtout comment utiliser les embed fonts dans une application flash.

Cette formation AS3 vous permettra de créer des swf contenant des polices partagées, pour les charger dynamiquement et les utiliser dans votre application ou jeu flash.

Embed Fonts / Polices partagées

Version démonstration

Ci-dessous, un exemple d’application flash qui charge un swf « embed fonts » et les utilise pour afficher du texte.

Télécharger le code source complet

Télécharger “Embed Fonts pure AS3”

ex-embed-fonts.zip – Téléchargé 669 fois – 413,22 Ko

Consultez le tutoriel original sur le site scottgmorgan.com.

Consultez les méthodes embed fonts :

Quelle technique utilisez-vous pour créer vos swf embed fonts ?

Nous avons vu plusieurs tutoriels flash pour créer des swf embed fonts – polices partagées (swfmill, FDT, pure AS3, Adobe CS5).

Dites-moi votre solution préférée et pourquoi dans les commentaires ci-dessous !

Afterburner : jeux Flash avec Pixlib et Starling Framework partie 2

11 questions

Ecrit le 26 avril par Matthieu
Publié dans le(s) sujet(s) Jeux Flash |Pixlib

Et voici la suite du 1er tutoriel flash sur la création d’un jeu flash avec les Framework Pixlib et Starling !

Le thème de ce Cours ActionScript 3 aborde la création d’un jeu flash en utilisant l’API Starling combiner à la puissance du Framework Pixlib 😉

La 2ème partie de ce tutoriel flash est consacré à l’implémentation des différentes fonctionnalités de Starling Framework.

Voici ce que vous allez apprendre dans ce tutoriel flash :

  • Comment mettre en pratique les fonctionnalités principales de Pixlib 3.0.
  • Plusieurs techniques pour optimisation les performance d’un jeu flash avec stage3D via Starling Framework.
  • Une solution détaillée pour une détection précise des collisions avec Starling Framework.
  • Comment mettre en place les différentes vues Starling et utiliser la puissance de stage3D.
  • Les explications pratiques pour la création du défilement du décor, des nuages…
  • La gestion des données avec 3 Modèles différents : chargement des éléments, lecture des sons MP3, le moteur de détection des collisions.
  • La méthode pour utiliser des animations (les vaisseaux ennemis, les explosions, les tirs…) avec Starling.
  • L’utilisation des polices embed « bitmap font » au sein du jeu flash (à partir d’images png) !
  • La création des différentes classes Manager : les ennemis, les rockets / lazers, les explosions…
  • Des astuces pour conserver une fréquence de 60 FPS.

Cette formation vous permettra d’utiliser plusieurs fonctionnalités clés du Framework Pixlib et de le coupler avec Starling Framework !

Jeu Flash avec Pixlib et Starling Framework

Version démonstration

Ci-dessous un lien vers le jeu flash créé : Afterburner.

Essayez de battre le record !

Télécharger le code source du cours AS3

Et voici le code source de l’application créée avec Pixlib et Starling Framework.

Télécharger “Afterburner avec Pixbib et Starling”

src-afterburner-pixlib-starling.zip – Téléchargé 1580 fois – 4,48 Mo

Note : les graphismes et l’idée proviennent de Waste Invaders. J’ai entièrement recréé le moteur du jeu (le code AS3).

Le fichier zip contient également le code source complet du Framework Pixlib avec les différentes extensions utilisées (PixQuick, PixService, PixLogger…)

L’extension PixLogger est modifiée pour prendre en charge la dernière version de Monster Debugger.

Présentation de Starling Framework par Thibault Imbert.

Télécharger la dernière version de Starling Framework directement depuis le site officiel.

Télécharger le code source de Pixlib 3.0 directement depuis le site officiel.

Consultez des tutoriels supplémentaires sur le Starling Framework.

Avez-vous déjà développé des jeux flash ou Adobe AIR avec Starling Framework ?

Partagez vos réalisations dans les commentaires ci-dessous.

Dites-nous les gains de performances que vous avez réussi à obtenir.

Afterburner : jeux Flash avec Pixlib et Starling Framework partie 1

4 questions

Ecrit le 24 avril par Matthieu
Publié dans le(s) sujet(s) Jeux Flash |Pixlib

Comme vous le savez surement, la nouvelle API Stage 3D, sortie avec le Player Flash 11, apporte un gain de performances considérables !

Par défaut, vos applications Flash (en 2D) ne bénéficie pas de cette nouvelle technologie…

Sauf que le Framework Starling permet, grâce à des classes proches de celles natives de Flash, d’utiliser la puissance du GPU dans vos applications flash classiques en 2D.

Le thème de ce Cours ActionScript 3 aborde la création d’un jeu flash en utilisant l’API Starling combiner à la puissance du Framework Pixlib 😉

Dans la 1ère partie de ce tutoriel flash, nous allons démarrer tranquillement la création de notre jeu avec Pixlib 3.0.

Voici ce que vous allez apprendre dans ce Cours ActionScript :

  • Comment mettre en pratique les fonctionnalités principales de Pixlib 3.0.
  • Les techniques pour optimisation les performance d’un jeu flash avec stage3D via Starling Framework.
  • Et surtout comment architecturer votre jeu flash autour de Pixlib combiné à Starling Framework.
  • Différentes solutions pour obtenir une taille du swf inférieure à 150 Ko.
  • Comment mettre en place le chargement dynamique de toutes les ressources : images, xml, sons mp3, polices de caractères…
  • Des astuces pour conserver une fréquence de 60 FPS.
  • Tout ce qu’il faut pour utiliser le flash remoting via l’extension PixService et AMPHP 2.0.1.
  • La création de la structure MVC, l’organisation des Vues, les différents Modèles
  • La gestion des évènements et des commandes dans Pixlib avec l’extension PixQuick.

Cette formation vous permettra d’utiliser plusieurs fonctionnalités clés du Framework Pixlib et de le coupler avec Starling Framework !

Jeu Flash avec Pixlib et Starling Framework

Version démonstration

Ci-dessous un lien vers le jeu flash créé : Afterburner.

Essayez de battre le record !

Télécharger le code source du cours AS3

Et voici le code source de l’application créée avec Pixlib et Starling Framework.

Télécharger “Afterburner avec Pixbib et Starling”

src-afterburner-pixlib-starling.zip – Téléchargé 1580 fois – 4,48 Mo

Note : les graphismes et l’idée proviennent de Waste Invaders. J’ai entièrement recréé le moteur du jeu (le code AS3).

Le fichier zip contient également le code source complet du Framework Pixlib avec les différentes extensions utilisées (PixQuick, PixService, PixLogger…)

L’extension PixLogger est modifiée pour prendre en charge la dernière version de Monster Debugger.

Présentation de Starling Framework par Thibault Imbert.

Télécharger la dernière version de Starling Framework directement depuis le site officiel.

Télécharger le code source de Pixlib 3.0 directement depuis le site officiel.

Consultez des tutoriels supplémentaires sur le Starling Framework.

Avez-vous déjà développé des jeux flash ou AIR avec Starling Framework ?

Partagez vos réalisations dans les commentaires ci-dessous. Dites-nous les gains de performances que vous avez réussi à obtenir.

HitTest BitmapData : Détection précise des collisions

Commentaires fermés sur HitTest BitmapData : Détection précise des collisions

Ecrit le 19 avril par Matthieu
Publié dans le(s) sujet(s) ActionScript 3

Le cours AS3 de cette semaine vous propose d’améliorer la détection des collisions par défaut de Flash.

A savoir : le fameux HitTest !

2 Experts ActionScript proposent des classes de détections des collisions beaucoup plus précises et performantes.

La détection des collisions utilise des objets BitmapData.

Voici ce que vous allez apprendre dans ce Cours ActionScript :

  • Une méthode simple de détection des collisions.
  • Une méthode encore plus précise de détections des collisions.
  • Les inconvénients et les avantages des 2 méthodes.
  • Le chargement dynamiques de 2 images pour effectuer des tests de collisions.

Cette formation AS3 vous permettra d’utiliser une méthode de détection des collisions beaucoup plus précises et efficace dans vos jeux flash.

Détection des collisions

Version démonstration

Détection des collisions simple

Déplacez le robot pour tester la méthode de détection des collisions simple.

[codesyntax lang= »actionscript3″ title= »HitTestSimple www.mikechambers.com » bookmarkname= »HitTestSimple www.mikechambers.com »]

[/codesyntax]

Détection des collisions précise

Déplacez le robot pour tester la méthode de détection des collisions beaucoup plus précise.

[codesyntax lang= »actionscript3″ title= »Collision www.tink.ws » bookmarkname= »Collision www.tink.ws »]

[/codesyntax]

Télécharger le code source complet

Télécharger “Détection des collisions”

ex-detection-collisions.zip – Téléchargé 555 fois – 136,90 Ko

Consultez la méthode de détection des collisions simple sur le site de Mike Chambers.

Consultez la méthode de détection des collisions plus précise sur le site Tink.

Et vous, utilisez-vous d’autres techniques pour détecter les collisions ?

Il existe d’autres techniques pour détecter les collisions. Notamment avec des tests sur la position, hauteur, largeur de 2 movieclip.

C’est la solution souvent utilisé dans les jeux flash avec un moteur de tile.

Partagez vos techniques dans les commentaires ci-dessous !

AS3 Signals : passer des paramètres avec un Event

Commentaires fermés sur AS3 Signals : passer des paramètres avec un Event

Ecrit le 17 avril par Matthieu
Publié dans le(s) sujet(s) Framework AS3

L’utilisation des évènements est indispensable dans la création de vos applications flash.

Le système Event par défaut d’Adobe est très pratique. Cependant, il représente un défaut de taille :

Il n’est pas possible de transmettre des paramètres avec nos évènements !

Dans certaine situation, cela peut s’avérer très problématique… et vous causer beaucoup de nuits blanches en tant que développeur flash !

Heureusement, Robert Penner a eu l’ingénieuse idée de créer une librairie de diffusion d’évènements, prenant en charge le passage de paramètres 😉

Présentation AS3 Signals

AS3Signals est une librairie qui améliore et peut remplacer l’utilisation du système événementiel de Flash.

Cette librairie s’inspire du système événementiel de C# et signals/slots de QT.

Ces caractéristiques :

  • Un signal est un mini-dispatcher spécifique à un événement, avec son propre réseau d’écouteurs.
  • Un signal est un attribut concret de la classe qui émet celui-ci.
  • Les écouteurs souscrivent à un objet concret et non plus à un canal défini par une chaine de caractères.
  • Les constantes définissant un événement ne sont plus nécessaires.
Sa philosophie :
  • La Composition et les Interfaces sont favorisés par rapport à l’Héritage.
  • Les évènements dans une Interface sont une bonnes choses.
  • Les différents types d’évènements sont des classes et non des String.
  • Les classes évènements sont concentrées sur les données qu’elles contiennent et non sur celui qui les envoient.
  • Les classes évènements ne contiennent pas de constantes String autres que les classes qui les utilisent.
  • Jusqu’ici, pas de mot clé dans les sources.
  • Pas de Singleton.

AS3Signals est compatible avec les objets natifs d’AS3 émettant des événements (comme par exemple le clic de la souris).

Une fonctionnalité intéressante est la possibilité, pour un émetteur, de désinscrire la totalité des écouteurs grâce à l’appel d’une seule méthode.

Utilisation AS3 Signals

La mise en place d’AS3 Signals est relativement simple. Voici une mise en pratique pas à pas.

Etape 1 : la classe Event

Dans votre classe « Event », celle qui diffuse des évènements pour informer des écouteurs.

Vous devez ajouter un objet Signal ou NativeSignal selon l’utilisation à réaliser.

Avec AS3 Signals, il est possible de typer les paramètres à transmettre avec l’évènement (c’est génial 😉 ).

Un objet Signal prend comme paramètre, le type des paramètres transmis avec l’évènement.

Par exemple :

[codesyntax lang= »actionscript3″ title= »AS3 Signals » bookmarkname= »AS3 Signals »]

[/codesyntax]

Ensuite, lorsque la classe Event doit diffuser un évènements aux écouteurs, il faut procéder comme suit :

[codesyntax lang= »actionscript3″ title= »AS3 Signals » bookmarkname= »AS3 Signals »]

[/codesyntax]

Etape 2 : les écouteurs

Pour écouter les évènements diffuser par la classe « Event », il suffit de lui indiquer la fonction qui sera appelée. Cette fonction récupère en entrée les paramètres envoyé par l’objet Signal.

[codesyntax lang= »actionscript3″ title= »AS3 Signals » bookmarkname= »AS3 Signals »]

[/codesyntax]

Et puis c’est terminé !

Options supplémentaires

AS3 Signals peut même remplacer les évènements par défaut d’Adobe (MouseEvent…).

Il suffit d’utiliser l’objet NativeSignal et de lui transmettre le type d’évènement à capturer.

[codesyntax lang= »actionscript3″ title= »AS3 Signals » bookmarkname= »AS3 Signals »]

[/codesyntax]

Vous pouvez également simuler l’évènement AS3 Signals pour informer les écouteurs.

[codesyntax lang= »actionscript3″ title= »AS3 Signals » bookmarkname= »AS3 Signals »]

[/codesyntax]

Pour supprimer un écouteur :

[codesyntax lang= »actionscript3″ title= »AS3 Signals » bookmarkname= »AS3 Signals »]

[/codesyntax]

Pour supprimer tous les écouteurs d’un seul coup :

[codesyntax lang= »actionscript3″ title= »AS3 Signals » bookmarkname= »AS3 Signals »]

[/codesyntax]

Il est même possible d’ajouter des écouteurs qui seront appelés une seule fois puis supprimés automatiquement !

Cela peut être utile dans certains cas…

[codesyntax lang= »actionscript3″ title= »AS3 Signals » bookmarkname= »AS3 Signals »]

[/codesyntax]

Les performances

Le gain de performances est énorme du passage du système Event d’Adobe à AS3 Signals de Robert Penner.

Consultez le résultat des benchmarks.

Mise en pratique AS3 Signals

Ci-dessous une mise en pratique complète d’AS3 Signals.

Téléchargement

Téléchargez le code source complet et commenté de l’exemple pratique.

Télécharger “Exemple AS3 Signals”

ex-as3-signals.zip – Téléchargé 543 fois – 236,95 Ko

Téléchargement depuis le dépôt GitHub : https://github.com/robertpenner/as3-signals

Avez-vous l’intention d’utiliser AS3 Signals dans vos applications pour remplacer Event d’Adobe ?

Ou peut être préférez-vous rester avec le système évènementiel par défaut de Flash ?

Il vous convient parfaitement…