Dans ce tuto Flash ActionScript de plus de 2 heures, nous allons développer une application nous permettant de capturer l'image d'une webcam, cette image sera ensuite convertie au format JPEG et ceci grâce à la classe JPEGEncoder de Thibault Imbert. Une fois convertie, l'image pourra être ensuite enregistrée.
Cette application Flash comporte aussi un système d'info-bulle assez complet, utilisé pour guider l'utilisateur pendant la lecture de l'application.
Voici la liste des classes utilisées pour le développement de cette application:
- Pour la vidéo : Video, Camera
- Pour l'image : ByteArray, Bitmap et BitmapData
- La liaison php : URLRequest, navigateToURL, FileReference, URLRequestHeader,URLRequestMethod
- Les classes de bases : Loader, MovieClip, StageAlign, StageScaleMode, MouseEvent, Event
- Les classes annexes : JPEGEncoder de Thibault imbert (dispo ICI ) et TweenMax de greensock (dispo ICI ) tuto gratuit pour l'install et l'utilisation : ICI )
Voici l'ensemble des éléments présent dans cette application :
- Écrans de captures : pour la webCam et pour la copie Bitmap
- Deux boutons pour la copie et l'enregistrement de l'image (+ effets lumineux )
- Info-bulle dynamique (apparition et mouvements gérés via la classe TweenMax)
- Encodage de l'image au niveau du bit (rapidité et légerté)
Voici ce que nous passerons en revue dans cette formation:
I) Mise en place de l'application
- Création des éléments de base (background, etc)
- Création des écrans de controls (webcam et image)
- Création des boutons, mise en place des effets lumineux (masques), ajout de filtres.
- Mise en place des finissions: reflet, cadre, copyright.
II)Mise en place de la classe Capture.as
- Ajout de l'ensemble des import du projet (classe par classe)
- Regroupement et déclaration des variables et constantes du projet
- Initialisation de l'application :
- __________ • initialisation de la caméra
- __________ • mise en place du Bitmap
- __________ • création et mise en place de l'info-bulle
- Mise en place des écouteurs liés au MouseEvent
- Regroupement des actions lié au curseur dans une fonction
- Gestion de la sortie de l'info-bulle (animé via TweenMax)
- Gestion du mouvement & des titres de l'info-bulle (en fonction de l'objet survolé)
- Gestion de la capture (copie de la vidéo, récupération des bitmapData)
- Mise en place de la fonction d'enregistrement de l'image :
- __________ • Mise en place de l'encodage (via JPEGEncoder)
- __________ • Récupération des données depuis un bytesArray
- __________ • Gestion php (header, transfère de bytes, méthode et data)
- __________ • Gestion de la prondeur de l'info-bulle
III)Autre:
- Nous passerons brièvement en revue le contenu du fichier encode.php
- Pour la classe JPEGEncoder, nous verrons où trouver les bons fichiers et comment les utiliser, puis nous y ferons quelques modifications.
VI) Les fichiers sources:
Jettez un oeil à ces autres tuto Flash CS4, ActionScript 3
Gérer un modèle 3D dans…
Dans ce tuto Flash CS4 et ActionScript 3 vous apprendrez à…
Jeu Merlin FLash 3D
Ce tuto ActionScript 3 en vidéo, d'un niveau intermédiaire,…
Champ de vidéos 3D
Dans ce tuto Actionscript 3 en vidéo, vous allez apprendre…
Répertoire téléphonique…
Dans ce tuto Flash en vidéo, vous allez apprendre à développer…
Créez un site flash de type…
Apprenez dans cette formation à réaliser un site complet en…
Website xml avec utilisation…
Dans ce tutoriel, nous allons créer un website dynamique qui…
Débutez facilement avec Flash…
Cette vidéo de découverte va vous permettre de découvrir…
Créer un website avec gestion…
Dans ce tutoriel nous allons créer ensemble un mini site internet…
Pour vous faire un avis, voici un extrait de quelques secondes. La version complète et téléchargeable de ce tuto Flash CS4, ActionScript 3 de 2 heures 21 minutes est proposée dans une résolution plus grande que l’extrait suivant :
artkabis
, formateur certifié
Passionné par le webdesign, j'aime acquérir de nouvelles connaissances en ratissant la toile.
Au fil du temps j'ai su mettre à profit mes compétences de webdesigner pour mélanger interactivité,
design et animation. Curieux, j'aime être au courant des dernières nouveautés en matière
d'applications internet riches (RIA). Autodidacte, je sais m'adapter aux différents outils de création web.
J'utilise au quotidien une multitude de logiciels pour parfaire ma soif de création.
En savoir plus sur artkabis
Témoignage des clients de artkabis
![]()
En un mot...stupéfiant ! Merci beaucoup :)
![]()
Supers tuto, plein de bonnes astuces, merci :)
![]()
Artkabis, vraiment toi tu déchires grave... J'aime vraiment tes tuto et on voit de suite ta passion pour le flash, j'aimerai vraiment avoir 5% de tes connaissances... Bonne continuation à toi...
![]()
Merci beaucoup pour ce tuto vraiment bien réalisé !
![]()
Super formateur et des tuto très bien expliqués !
Lire les autres témoignages
D'autres tuto de artkabis
Lecteur mp3 xml
Dans ce tuto de plus de 3 HEURES nous allons créer un lecteur mp3 de A à Z, ce lecteur…
Créer un colorPicker personnalisé
Voici un tutorial vidéo consacré à la réalisation d'une application avec Adobe AIR.…
Galerie 3d interactive avec Flash
Dans ce tutorial Flash ActionScript de près d'une heure, nous allons apprendre à créer…
Mini Portfolio en Flash
Dans ce tutoriel Flash / ActionScript de près de deux heures, nous allons créer une…
Notes attribuées par les utilisateurs (1 vote)
Les avis / Questions des utilisateurs (5)
Donnez votre avis ou posez une question au formateur.
Vous souhaitez commenter ce tuto vidéo ? Créez un compte gratuit. Déjà membre ? Identifiez-vous
Ce tuto en résumé ...
Ce tuto Flash CS4, ActionScript 3 d’une durée de 2 heures 21 minutes a été acheté 19 fois et a reçu une note moyenne de 5/5.
Ce tuto a été publié le 22 janvier 2010 par artkabis, formateur certifié par Tuto.com, ayant reçu une note moyenne de 3,9/5 pour l’ensemble de ses vidéos, dans la catégorie Tuto Flash video.
Tous les fichiers sources sont fournis avec cette formation. Ces derniers vous permettront de reproduire les manipulations expliquées dans cette formation.
Ce tuto video vous expliquera étape par étape, toutes les manipulations présentées par le formateur.
Toutes nos vidéos sont visionnées par notre équipe, avant d’être mises en ligne, garantissant ainsi la qualité des produits téléchargés.














(a acheté ce tuto - 28 avril 2011)
" Bonjour
J'ai un soucis , lorsque je modifie le fichier fla, et que je veux le publier, j'ai les erreurs suivantes :
Tuto_capturCam/fr/Capture.as, ligne 107 1120 : Accès à la propriété non définie TweenMax.
Tuto_capturCam/fr/Capture.as, ligne 111 1120 : Accès à la propriété non définie TweenMax.
Tuto_capturCam/fr/Capture.as, ligne 23 1172 : La définition com.greensock:TweenMax est introuvable.
du coup mon fichier swif ne marche pas
As tu une solution pour corriger ces erreurs
Merci d'avance
"
(a acheté ce tuto - 20 avril 2011)
" Bonjour artkabis
Je trouve ton tuto super et il m'a rendu un grand service!!!
Mais pour que mon projet soit totalement terminé J'ai plusieurs questions.
Comment dois je procéder pour habiller ma webcam?
Je m'explique, je veux faire la même chose que sur le site suivant : http://www.cameroid.com/snap.php ou l'utilisateur aura le choix entre 4 fonds.
Comment dois je faire pour intégrer le menu avec mes 4 images de fond et que lorsque l'utilisateur clique sur l'une d'elle, le fond se mette en place?
Ma deuxième question est la suivante : comment obtenir un masque qui n'affiche que le visage de mon internaute et pas le reste?
En gros je souhaite faire la même chose que sur le site http://www.cameroid.com/snap.php
Ensuite je souhaite qu'une fois que l'internaute a pris la photo qu'il puisse la partager sur facebook avec un bouton (j'ai vue que c'était possible sur http://www.laphotocabine.com)
Voila c'est tout est c'est déjà pas mal :)
j'espère que tu pourra m'aiguiller un peu
Cordialement
Maxime
"
(a acheté ce tuto - 19 juin 2010)
" Salut Artkabis,
On se complète plutôt bien alors, le php c'est ce que je maitrise ;)
Sinon oui, j'ai réussi le concours et je vais intégrer l'école à la rentrée prochaine (sous réserve de trouver une entreprise pour l'alternance).
J'ai utilisé ton appli pour un "générateur de cartes de visite" : je me sers de ton appli pour prendre une photo avec la webcam, et avec une petite retouche dans ton code, je la stocke sur le serveur au lieu de donner le choix de la télécharger.
Ensuite, il y a un formulaire pour entrer ses nom, prénom, mail et job, et lors de l'envoi du formulaire je récupère les infos et des éléments graphiques (png et jpeg) dans un dossier de "thème", et en utilisant la librairie GD avec php, je créé une carte de visite en fusionnant le tout.
Un ptit truc bien sympa, surtout pour apprendre les interactions entre php et AS3 ! ;) "
(auteur de ce tuto - 09 mai 2010)
" Salut alors déjà merci pour le post, c'est sympa, concernant le fichier php, hélas je t'avoue que ce langage est loin d'être celui que je maîtrise le plus. D'ailleurs si tu arrive à améliorer cette petite application, ou du moins la partie lié à la gestion php, il pourrait être sympa de voir jusqu'à ou tu as put aller. Voilà, alors merci d'avoir choisie mes tutos et n'hésites pas à revenir nous dire si tu as réussi ton concours au gobelins. "
(a acheté ce tuto - 08 mai 2010)
" Bonjour artkabis,
Merci pour ce tuto original qui je trouve est très bon !!
Ce n'est pas le premier que je regarde venant de toi, et j'apprécie la bonne humeur que tu propages tout au long de ceux-ci !
Juste une petite chose qui cloche : dans encode.php, tu captes bien un flux binaire JPEG, mais tu lui indique le dénominateur PNG avec imagepng($im) ... Ce qui fait que des logiciels de retouche ne voudront pas forcément éditer l'image.
Je vais le personnaliser et l'intégrer dans un petit projet que je me suis fixé, espérons que le tout (+ mes autres projets) soient suffisamment probants pour la finale d'un concours qui m'attend (Gobelins) ...
@+ sur un autre de tes tutos ! "