Cours et tutoriaux Photoshop, Flash, Fireworks, Paintshop et sur le développement de sites Web XHTML, PHP, MySQL...

Tutorial Flash : Vidéo embarquée

  • Introductions

  • Informations

  • Résultat

Apercu du tutorial video-embarquee

Ce tutorial présente une méthode pour intégrer une vidéo dans Flash.
Cela peut-être utilisé pour de courtes vidéo qui de préférence ne possèdent pas de bande sonore.


Avatar de netger

Auteur : WebmasterNetger

Difficulté : Facile
Création : 01/03/2007
Mise à jour : 05/12/2007

Nombre de visites : 2405


1. Créer un nouveau document flashIcone remonter en haut de page

Créer un nouveau document flash ou utilisez un document existant.

Vous devez également disposer d'une vidéo dans l'un des formats suivants :
.mov, .avi, .mpeg, .dvi, .wmv ou .flv

2. Importer la vidéoIcone remonter en haut de page

Nous allons importer la vidéo dans la scène : cliquez sur "Fichier", "Importer" puis "Importer de la vidéo...".

Cliquez sur "Parcourir" puis sélectionnez votre fichier vidéo et cliquez ensuite sur "Suivant".

3. Le déploiement, incorporation et codageIcone remonter en haut de page

Il existe 4 types de déploiement des vidéo sous Flash (5 si l'on compte QuickTime).
Voici un résumé de leurs principales caractéristiques :

- Téléchargement progressif à partir d'un server web
Cette option permet de convertir la vidéo en .flv et de la placer sur la scène.
La vidéo pourra être parcouru en fonction des données chargées dans l'ordinateur du client.

- Diffusion en continu avec le service de Flash
Cette option prépare la vidéo au format .flv et la munie d'une enveloppe avec les fonction traditionnelles (lecture, arrêt, pause, ...).
A la différence du progressive download la vidéo sera lue en streaming : la vidéo pourra être parcourue à loisir puisque le flux sera lu à la demande.

- Diffusion en continu à partir de Flash Communication Server
Idem que la précédente mais avec un server local.

- Incorporer la vidéo dans le SWF et la diffuser dans le scénario
Cela permet d'inclure la vidéo dans le fichier .swf final.
C'est donc le procédé le plus simple mais il possède de nombreux désavantages...
Toutefois il peut largement être utilisé pour de très courtes vidéo.


Pour ce tutorial sur la vidéo embarquée nous allons nous intéresser au dernier type de déploiement.
Certes il ne permet d'utiliser que de petits fichiers vidéo et risque fort d'entrainer des décalages avec le son (si votre vidéo en contient).
De plus cette méthode à le désavantage gonfler le .swf puisqu'il contient l'intégralité de la vidéo.

Cependant cette méthode peut toujours s'avérer utile et ce tutorial servira de base à d'autres tutoriaux sur l'intégration de vidéo dans flash.

Choisissez donc le déploiement "Incorporer la vidéo dans le SWF et la diffuser dans le scénario".
Cliquez sur "Suivant" et déterminez la méthode d'incorporation de la vidéo.

Cliquez encore sur "Suivant" et enfin déterminez la qualité de codage de votre vidéo.
Bien sur plus la qualité sera élevée et plus le fichier .swf sera lourd...


Encore quelques clics sur "Suivant" et votre vidéo sera prête #B5

Remarque :
Le codage de la vidéo n'est réalisé que si votre vidéo n'est pas déjà au format .flv

4. Quelques fonctionnalités ?Icone remonter en haut de page

Au besoin vous pouvez agrémenter votre clip vidéo de quelques fonctionnalités habituelles : nous allons ici nous limiter aux boutons Play et Stop.

Ouvrez le panneau "Composants", sélectionnez FLV Playback Custom UI et placez sur la scène un bouton "Play" et un bouton "Stop".


Nous allons maintenant définir les actions de ces boutons.

Ouvrez le panneau "Comportements" puis sélectionnez le bouton "Play".
Cliquez ensuite sur le symbole + dans le panneau "Comportements" et choisissez "vidéo intégrée" puis "lire".
Une nouvelle fenêtre "Lire une vidéo" apparait : sélectionnez le fichier vidéo que vous souhaitez contrôler avec ce bouton.


Procédez de la même manière pour le bouton "Stop".


Utilisez FireFoxW3C XHTML 1.0W3C CSS 2.1