Le Blog

  • : Le blog de Romain Dedenis
  • : Un blog relatif à la programmation web, vous trouverez ici des tutoriels sur différents langages tel que le flash, le php... Ainsi que différentes astuces et articles. Bonne visite :)
  • Contact

Contacts

viadeo-icone-5757-48.png linkedin.png

Liens Utiles

 

Documentation Flash as 3.0 :

Flash as 3.0

 

Documentation moteurs 3D Flashs :


Documentation Utilitaires 3D Flashs :

Et bien sûr, le fil RSS du Blog ! rss

26 mars 2010 5 26 /03 /mars /2010 14:20
Nous voici arrivé à notre deuxième tutoriel, nous avons vu la dernière fois( Réalité Augmentée : La détection de mouvements. ) comment détecter de manière archaïque un mouvement en comparant 2 images consécutives.

Un petit aperçu d'une application de la R.A. avec cet exemple très épuré : Prestation : La Réalité Augmentée (Flash / Flex).

I/ Intéractions entre le mouvement et un objet.

Nous allons ici, récupérer le mouvement, puis lier celui-ci avec une action sur notre scène. bouton_1 est un MovieClip ajouté manuellement sur la scène.

Code Source

package{
    import flash.display.*;
    import flash.events.*;
    import flash.media.*;
    import flash.geom.*;
    import flash.utils.setInterval;
   
    public class Main extends Sprite{
        private var video:Video;
        private var camera:Camera;
       
        public function Main():void{
            init();
            initInterval();
        }
       
        private function init():void{
            camera = Camera.getCamera();
            camera.setMode(640,480,30); // setMode(largeur, hauteur, fps)
            video = new Video(640,480);
            video.attachCamera(camera);
            addChild(video);
            bouton_1.parent.setChildIndex(bouton_1, bouton_1.parent.numChildren - 1);
            now = new BitmapData(camera.width, camera.height);
            before = new BitmapData(camera.width, camera.height);
        }
       
        private function initInterval():void{
            setInterval(detect, 100);
        }
       
        private var now:BitmapData;
        private var before:BitmapData;
        private function detect(e:Event = null):void{
            if(!camera.muted){
                now.draw(video);
                now.draw(before, new Matrix(), new ColorTransform(), 'difference');
                now.threshold(now, now.rect, new Point(0,0), '>', 0xFF111111, 0xFFFFFFFF);
                before.draw(video);
                actions(now);
            }
        }
       
        private function actions(bmp:BitmapData):void{
            //voir explications
            var val = now.getPixel(bouton_1.x, bouton_1.y);
            if(val > 1000000){
                //ici vos actions pour ma part, je déplace aléatoirement le bouton
                bouton_1.alpha = 0.2;
                bouton_1.x = Math.floor(Math.random() * (530 - 50 + 1)) + 50;
                bouton_1.y = Math.floor(Math.random() * (430 - 50 + 1)) + 50;
            } else {
                bouton_1.alpha = 1;
            }
        }
    }
}

Résultat Obtenu



Explications

Nous avons vous dans le tutoriel précédent( La réalité augmentée ) que le mouvement se traduit par du blanc sur notre image. C'est donc ainsi que pour vérifier si notre objet est en "contact" avec le mouvement, il nous suffit de vérifier si le pixel étant aux coordonnées de notre objet est blanc ou non. La méthode est peu précise, mais il est aisé d'adapter le code pour le rendre plus fiable et précis ;).


Nous voici à la fin de ce deuxième tutoriel sur la détection de mouvements avec Flash.



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



Cordialement, Romain Dedenis.

Partager cet article
Repost0
29 janvier 2010 5 29 /01 /janvier /2010 15:15
Avant d'aborder à proprement parler la réalité augmentée, nous allons commencer par une notion essentielle, qui est la détection de mouvements.
img1

Un petit aperçu d'une application de la R.A. avec cet exemple très épuré : Prestation : La Réalité Augmentée (Flash / Flex).

I/ Le principe


Le principe de la détection de mouvements basique est basé sur l'analyse des différences entre 2 images consécutives.
Des fonctions existent en flash pour nous permettre de faire directement la différence entre ces deux images, nous nous appuyerons donc dessus pour ce tutoriel.


II/ Mise en application

Pour capturer les images qui vont être analysées, nous allons utiliser notre WebCam (tutoriel sur l'utilisation de WebCam).

Comme pour les tutoriels de PaperVision, je vais commencer par vous donner le code source que vous tenterez de comprendre par vous même, puis je passerais aux explications par la suite.

Code Source

package{
    import flash.display.*;
    import flash.events.*;
    import flash.geom.*;
    import flash.utils.*;
    import flash.media.Camera;
    import flash.media.Video;
       
    public class Main extends MovieClip{
        private var camera:Camera;
        private var video:Video;
       
        private var now:BitmapData;
        private var before:BitmapData;
        private var bmp:Bitmap;

        private var pt:Point;
       
        public function Main():void{
            init();
        }
       
        public function init():void{
            //initialisation de la caméra
            camera = Camera.getCamera();
            camera.setMode(640,480,15);
            camera.addEventListener(StatusEvent.STATUS, startRender);
            //initialisation de la video
            video = new Video(640,480);
            video.attachCamera(camera);
            //initialisation BitmapData
            now = new BitmapData(camera.width, camera.height);
            before = new BitmapData(camera.width, camera.height);
            bmp = new Bitmap();
            addChild(bmp);
            //initialisation des autres outils neccessaires
            pt = new Point(0, 0);
        }
       
        private function startRender(e:StatusEvent):void{
            if(e.code == "Camera.Unmuted"){
                setInterval(traceMotion, 200);
            }
        }
       
        public function traceMotion(e:Event=null):void{
            now.draw(video); // (1)
            now.draw(before, null, null, 'difference'); // (2)
            var sens = 0xff111111;
            now.threshold(now, now.rect, pt, ">", sens, 0xffffffff); // (3)
            before.draw(video); // (4)
           
            bmp.bitmapData = now; // on affiche le résultat à l'écran
        }
    }
}

Resultat Obtenu:

A chacun de vos mouvements devant la WebCam, celui-ci sera retransmis en blanc sur l'image.


Explications

(1) nous effectuons une capture d'image que nous stockons dans le BitmapData now.
(2) nous effectuons la difference entre l'image d'avant et celle que nous venons de capturer.
(3) la fonction threshold() est la clé du mécanisme car c'est elle qui va transformer la plage de couleur du mouvement en blanc (vous pouvez utiliser la couleur de votre choix).
(4) on met en mémoire l'image de comparaison.

Voilà pour notre premier tutoriel sur la réalité augmentée qui visait à vous familiarisez avec l'interaction de la webCam et la manipulation d'images avec l'AS 3.0. Je vous ai présenté une version 'primitive' de la detection de mouvement, mais le principe est là!



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



Cordialement, Romain Dedenis.
Partager cet article
Repost0