Juego detección de movimiento y realidad aumentada

hace algún tiempo hice este juego

Básicamente quería en ese momento mostrar lo facil que era realizar aplicaciones basadas en realidad aumentada, sobre todo utilizando la Librería de detección de movimeinto  Ostrich Flash Web Cam , pero por falta de tiempo no pude hacer un tutorial de ello. Pero como me sentía en deuda y debido a las peticiones que me hicieron llegar ustedes en este blog, he terminado ya el tutorial y se los dejo aquí

Si no quieren ver los 13 minutos de la construción del código, pues les detallo aquí de que va.

1- descargue la librería de realidad aumentada y detección de movimiento de la web del proyecto

2- miremos ahora un poco de código.

package samples {

import flash.display.MovieClip;
import flash.events.*;
import flash.display.Sprite;
import flash.utils.Timer;
import flash.events.TimerEvent;

//Importamos nuestra interface Ostrich

import com.danzen.interfaces.ostrich.*;

public class guitarHero extends MovieClip {

//Creamos nuestra variable bolaFuego
private var bolaFuego:fuego = new fuego();

//CReamos nuestra variable para la camara y el cursor

private var myCamera:OstrichCamera;
private var myCursor:OstrichCursor;

//Creamos nuestro timer para agregar al escenario bolas de fuego

var tiempo:Timer = new Timer(3000, 50);

public function guitarHero() {
// constructor code
myCamera = new OstrichCamera();
addChild(myCamera);
myCamera.alpha=.2;
iniciarFuego();
tiempo.start();
myCamera.addEventListener(OstrichCamera.READY, init);

}

//Referente a la librería que utilizaremos//

private function init(e:Event){
setChildIndex(objeto,numChildren-1);
myCursor= new OstrichCursor(myCamera);
addEventListener(Event.ENTER_FRAME, animarPuntero);
}

private function animarPuntero(e:Event){
if(objeto.hitTestObject(bolaFuego)){
bolaFuego.visible=false;
}
objeto.x = myCursor.x;
objeto.y = myCursor.y;

}

//Referentes a eventos en el escenario

private function iniciarFuego(){
addChild(bolaFuego);
bolaFuego.visible=true;
bolaFuego.x = Math.random() * 600;
bolaFuego.y= 0;
moverFuego();
tiempo.addEventListener(TimerEvent.TIMER, masFuego);

}
private function moverFuego(){
bolaFuego.addEventListener(Event.ENTER_FRAME, caeFuego);
}
private function caeFuego(event){
bolaFuego.y+=5;
}
private function masFuego(event:TimerEvent):void{
iniciarFuego();
}

}

}

 

La lógica en este código es que cada 3mil milisegundos se agregue al escenario bolas de fuego que caerán de manera aleatoria y que al colisionar con el objeto están desaparecerán , esto podemos verlo en las siguientes líneas de código.

Lo que hacemos es agregar al escenario una bola de fuego que sea visible y a su posición x le damos un valor aleatorio no mayor a 600 que es el área del escenario además ejecutamos nuestro timer y la función moverFuego


private function iniciarFuego(){
addChild(bolaFuego);
bolaFuego.visible=true;
bolaFuego.x = Math.random() * 600;
bolaFuego.y= 0;
moverFuego();
tiempo.addEventListener(TimerEvent.TIMER, masFuego);

}

La función moverFuego ejecuta un Enter Frame, este enterFrame ejecuta la función caeFuego, que lo que hace básicamente es dar el efecto de caida de la bola de fuego.


private function caeFuego(event){
bolaFuego.y+=5;
}

Cada 3mil mili-segundos durante 50 veces se ejecuta la función masFuego, que lo que hace es iniciar nuevamente la función iniciarFuego descrita anteriormente.

La función animarPuntero cumple 2 misiones , la primera es que sido colisiona el “objeto” con la “bolaFuego” se pone la visibilidad de bolaFuego en modo false. y la segunda es que “objecto” se mueva conforme al movimiento que nostros hacemos frente a nuestra camara.


private function animarPuntero(e:Event){
if(objeto.hitTestObject(bolaFuego)){
bolaFuego.visible=false;
}
objeto.x = myCursor.x;
objeto.y = myCursor.y;

}

Bien, espero haya sido de ayuda este vídeo tutorial y si aún no lograrón hacerlo pues quizas les sirva el archivo de ejemplo.

Anuncios

About Luis Rodriguez Martinez

Diseñador web w3c

4 responses to “Juego detección de movimiento y realidad aumentada”

  1. Rodrigo says :

    olá, sou do Brasil!
    sou estudante de design, sou
    apaixonado por Realidade aumentada,
    muito bom os teus tutoriais,não estou conseguindo
    abrir os exemplos do guitahero e da roupa,
    porque?uso flash cs4, actionscript 3sera que é isso?
    fico muito grato pela ajuda!
    obrigado

    Rodrigo

    • Luis Rodriguez Martinez says :

      Los ejemplos se encuentran en flash cs5, no creo que te sea dificil encontrar una versión cs5 en internet para que puedas ejecutar tus archivos. Gracias por visitar el blog y no dejes la pasion por la realidad aumentada

      • Rodrigo says :

        Luis,

        estou muito grato pela ajuda, espero que tenhas muito sucesso!!
        gostaria de saber se sabes como colocar objetos 3d usando
        o Ostrich? ou alguma fonte onde eu possa pesquisar?
        quero colocar objetos 3d exportado do 3dmax.

        muito obrigado desde já!

      • Luis Rodriguez Martinez says :

        Si quieres empezar a trabajar realidad aumentada con archivos 3d, debes investigar sobre flartoolkit o artoolkit y los archivos collada o .dae

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: