Accessibilité

Didacticiels

Référence

Foundation Flash 8 Video
écrit par Tom Green et Jordan Chilcott

www.friendsofed.com

Couverture de livre

Ressources

Extrait de « Foundation Flash 8 Video » écrit par Tom Green et Jordan Chilcott
© 2006. Utilisé avec l’autorisation de
friends of ED, division d’Apress.
Pour acheter ce livre, rendez-vous sur le site
www.friendsofed.com.

Email to a friendEmail to a friend

Diffusion vidéo à l’aide de l’objet Camera de Flash

En premier lieu, il faut savoir que l’objet Camera de Flash® a principalement été conçu pour diffuser des flux vidéo entre une caméra et un fichier SWF de page Web, via Flash Media Server 2. Ainsi, si vous avez ouvert un compte Flash Media Server auprès de votre fournisseur d’accès à Internet, vous pourrez faire coucou à votre cousin d’Amérique sur votre ordinateur et vous le verrez s’il possède une webcam. Outre cette fonction première, vous pouvez aussi permettre à d’autres utilisateurs munis d’une webcam et qui utilisent uniquement le protocole HTTP pour leurs diffusions vidéo, de se voir et les mettre en situation plus ou moins saugrenue.

Si vous utilisez une webcam avec Flash Player, dès qu’un fichier SWF tente d’accéder à la caméra, une boîte de dialogue Privacy Settings (Paramètres de confidentialité) s’affiche pour permettre à l’utilisateur d’autoriser ou non l’accès à la caméra. Cette boîte de dialogue permet également de sélectionner une caméra. Nous y reviendrons dans une minute. Enfin, bien qu’il soit possible de connecter plusieurs caméras à l’ordinateur, l’objet Camera permet uniquement de les afficher une par une.

Commençons sans plus attendre.

Connectez votre webcam à l’ordinateur, nous allons apprendre à l’utiliser.

  1. Ouvrez un nouveau document Flash. Ouvrez la bibliothèque et créez un objet vidéo. Faites glisser l’objet vidéo de la bibliothèque vers la scène.
  2. Cliquez dessus une fois et donnez-lui le nom d’instance myVid. Définissez une taille de 320 pixels (largeur) sur 240 pixels (hauteur).
  3. Ajoutez un calque Actions au montage principal, ouvrez l’éditeur ActionScript, puis entrez les deux lignes de code suivantes dans le volet de script :
var myCamera:Camera = Camera.get();
myVid.attachVideo (myCamera);

La première ligne récupère l’objet Camera avec la méthode Camera.get() et nomme la caméra en l’affectant à myCamera. (Pour en savoir plus sur la classe Camera, consultez l’aide Flash.) La deuxième ligne permet simplement d’attacher le flux de la caméra à l’objet vidéo sur scène, comme le montre la figure 1. Voilà, c’est aussi simple que cela. Prochaine étape : test de la vidéo.

Astuce : bien que vous utilisiez ici un objet d’une taille de 320 × 240 pixels, la taille du flux vidéo n’a en fait aucune espèce d’importance. Par contre, n’oubliez pas qu’une fois la caméra détectée, la boîte de dialogue Privacy Settings (Paramètres de confidentialité) s’affiche sur le fichier SWF. Cela signifie que si vous placez sur la scène un objet vidéo de 160 × 120, la boîte de dialogue Privacy Settings (Paramètres de confidentialité) sera plus grande que la scène, d’où un problème pour l’utilisateur. Si vous utilisez une webcam, la taille minimum de la scène est de 215 × 138 pixels (taille minimum requise par Flash pour afficher la boîte de dialogue).

test de la vidéo

Figure 1 : Bonjour tout le monde.

Avez-vous remarqué que le paramètre de la méthode Camera.get() est vide ? Il indique à Flash d’utiliser la première caméra détectée, connectée à l’ordinateur. Si vous avez trois caméras, elles auront les valeurs 1, 2 et 3 dans l’index. Si vous choisissez d’utiliser la deuxième, la méthode est Camera.get(2);

Si vous n’avez pas réussi à connecter la caméra à l’objet vidéo, ne vous inquiétez pas. Si plusieurs pilotes de caméra sont installés, Flash n’a peut-être pas sélectionné celui qui convient. Pour le sélectionner, testez à nouveau la vidéo et procédez comme suit :

  1. Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl enfoncée (Mac) sur le fichier SWF pour ouvrir le menu contextuel. Choisissez Paramètres. La boîte de dialogue Paramètres Flash Player s’affiche.
  2. Quatre icônes se trouvent en bas. Les deux dernières représentent un microphone et une caméra. Cliquez sur l’icône de la caméra.
  3. C’est là que vous pouvez choisir votre caméra. Cliquez sur la liste déroulante. Une fois que vous avez trouvé votre caméra (voir figure 2), sélectionnez-la et cliquez sur le bouton Fermer.
Boîte de dialogue Paramètres SWF

Figure 2 : sélectionnez votre caméra via la boîte de dialogue Paramètres SWF.

Création d’un cube vidéo

Vous allez maintenant créer un cube vidéo.

  1. Ouvrez un nouveau fichier vidéo Flash et créez une vidéo appelée Vid. Ajoutez un objet vidéo à la bibliothèque et faites-le glisser sur la scène. Dans l’inspecteur des propriétés, définissez le nom de l’instance de l’objet vidéo sur myVid, ses dimensions sur 240 (largeur) × 180 (hauteur) et ses coordonnées X et Y sur 0 0.
  2. Ajoutez un calque au montage de la vidéo et appelez-le Actions. Sélectionnez la première image du calque Actions, ouvrez l’éditeur ActionScript et entrez les deux lignes de code suivantes :
var myCam: Camera = Camera.get(); myVid.attachVideo (myCam);

  1. Fermez l’éditeur ActionScript et cliquez sur le lien Scène 1 pour revenir au montage principal.
  2. Faites glisser deux copies de la vidéo Vid sur la scène et placez-les côte à côte. Sélectionnez les deux vidéos, ouvrez le panneau Transformation en sélectionnant Fenêtre > Transformation, puis définissez la largeur sur 130,0 %. Avant de procéder à la mise à l’échelle, vérifiez que l’option Contraindre n’est pas sélectionnée.
  3. Sélectionnez le fichier vidéo de gauche et définissez son inclinaison sur 45 % à l’aide du panneau Transformation. Procédez de la même façon avec le fichier vidéo de droite en définissant son inclinaison sur -45. Alignez le bord des vidéos comme le montre la figure 3.
panneau Transformation

Figure 3 : utilisez le panneau Transformation pour mettre à l’échelle et incliner votre cube.

  1. Verrouillez le Calque 1 et ajoutez un nouveau calque appelé Haut. Dessinez un rectangle dans ce calque et remplissez-le de la couleur de votre choix. Sélectionnez l’outil Transformation libre et placez le rectangle sur les deux vidéos. Une fois l’opération terminée, vous devez obtenir un cube. Déverrouillez les calques.
  2. Sélectionnez Edition > Sélectionner tout et convertissez la sélection en une vidéo appelée cube.
  3. Utilisez l’outil Transformation libre pour définir la taille du cube à mi-hauteur de la scène. Déplacez le cube vers la partie inférieure gauche de la scène comme le montre la figure 4.
premier cube

Figure 4 : premier cube en place.

  1. Maintenez les touches Alt + Maj (Windows) ou Option + Maj (Mac) enfoncées puis cliquez sur le cube, faites glisser une copie de la vidéo à droite et alignez-la sur le bord droit de l’autre vidéo. Faites une autre copie que vous ferez glisser au-dessus des deux cubes déjà présents sur la scène.
  2. Enregistrez et testez votre vidéo. C’est dans la boîte ! (voir la figure 5).

Remarque : vous pouvez vous amuser à placer plusieurs cubes sur la scène pour laisser l’utilisateur les empiler à sa guise à l’aide des méthodes startDrag () et stopDrag ().

c’est dans la boîte

Figure 5 : c’est dans la boîte !

Faire pivoter la vidéo

Comme vous avez pu le constater dans la section précédente, la vidéo ne se trouve pas toujours sur un plan plat. Dans cette section, vous allez conserver la vidéo sur ce plan pour obtenir au final une sorte d’effet kaléidoscopique. Pour ce faire, il suffit de « renverser » les vidéos contenant l’objet vidéo.

Pour continuer ce didacticiel, téléchargez le fichier compressé Flip.fla :

Télécharger (ZIP 5,71 Ko)

  1. Ouvrez le fichier Flip.fla. Tout est prêt pour l’exercice. Vous n’avez plus qu’à renverser les vidéos.
  2. Sélectionnez la vidéo dans Renverser horizontalement, puis sélectionnez Modification > Transformation > Renverser horizontalement (voir la figure 6). Si le point d’alignement de la vidéo se déplace du coin supérieur gauche de la vidéo vers le coin supérieur droit, c’est que la vidéo a basculé.
renverser horizontalement

Figure 6 : renverser horizontalement.

  1. Sélectionnez la vidéo dans Renverser verticalement et appliquez un renversement vertical à la sélection.
  2. Sélectionnez la dernière vidéo et renversez-la verticalement puis horizontalement.
  3. Enregistrez et testez votre vidéo. Comme le montre la figure 7, vous n’avez pas l’air tout à fait dans votre assiette.
test de la vidéo

Figure  7 : un véritable Palais des glaces !