Away3D : Flux vidéo sur les objets 3d.

Nous voici maintenant arrivé à un moment assez sympa de notre "formation", nous allons maintenant voir comment intégrer des flux vidéos sur nos objets 3D. Je prends l'exemple des flux vidéos, car pour beaucoup cela représente quelquechose de plutôt symbolique et complexe ;).

Le flux vidéo que nous allons utiliser ne sera autre que notre... WebCam !

I/ Intégration de notre flux vidéo sur une Plane

Je vais appliquer notre flux sur une Plane. Pour les autres objets 3D, rien ne change vu que le flux est lié à un materiel que l'on peut ajouter sur n'importe quel objet :).

Commencez par jetter un petit coup d'oeil par ici si vous ne savez pas comment intéragir avec une webcam.
Nous allons partir de notre exemple sur la création de Plane que nous avons vu dans un précédent tutoriel( Away3D : Premier Objets 3D simples (Plane, Triangle) ).

Code Source

package {
   import away3d.containers.Scene3D;
   import away3d.containers.View3D;
   import away3d.cameras.Camera3D;
   import away3d.primitives.Plane;
   //Ajout
   import away3d.materials.MovieMaterial;

   import flash.display.*;
   //Ajout
   import flash.events.*;
   import flash.media.Camera;
   import flash.media.Video;
 
   public class Main extends Sprite {
      private var scene:Scene3D;
      private var view:View3D;
      private var camera:Camera3D;
      private var plane:Plane;
      //Ajout
      private var mc_video: MovieClip;
      private var video:Video;
      private var webCam:Camera;
      private var movieMaterial:MovieMaterial;
    
      public function Main():void {
         initialisationList();
      }
    
      private function initialisationList():void {
         initA3D();
         //Ajout
         initVideo();
         initMaterials();
         initObjects();
         initListeners();
      }
    
      private function initA3D():void {
         scene = new Scene3D();
         camera = new Camera3D({zoom:10, focus:50, x:0, y:0, z:-300});
         view = new View3D({scene:scene, camera:camera, x:stage.stageWidth/2, y:stage.stageHeight/2});
         addChild( view );
      }

      private function render(e:Event):void{
         view.render();
      }

      private function initObjects():void{
           plane = new Plane({material:movieMaterial, width:320, height:240, segmentsW:8, segmentsH:8});
           plane.rotationX = 90;
           scene.addChild(plane);
      }
     
      //Ajout des 3 prochaines fonctions
      private function initVideo():void{
          mc_video = new MovieClip();
          webCam = Camera.getCamera();
          video = new Video(320, 240);
          video.attachCamera(webCam);
          mc_video.addChild(video);
      }
     
      private function initMaterials():void{
          movieMaterial = new MovieMaterial(mc_video);
         }
     
      private function initListeners():void{
          addEventListener(Event.ENTER_FRAME, render);
      }
   }
}

Résultat Obtenu

Explications

Nous avons introduit un nouveau type de matériel, le MovieMaterial(MovieClip), qui va nous permettre de texturer un objet avec un MovieClip. Pour afficher notre flux vidéo, nous créons un objet Vidéo que nous lions au flux de la WebCam via la méthode attachCamera().
La seule difficulté est de bien comprendre qu'il est nécessaire d'ajouter l'objet Vidéo à un MovieClip, puis d'ajouter notre MovieClip au MovieMaterial et le tour est joué!


Nous voici à la fin de ce tutoriel, la prochaine fois nous verrons l'import d'objets Collada avec Away3D.

Ce tutoriel vous a été utile? Abonnez-vous au fil RSS !

Cordialement, Romain Dedenis.