Final

14
El primer paso consiste en crear un archivo .as el cual llamaremos con el nombre marca_multiple_Vid. Procedemos a crear un archivo .fla y lo asociamos con el archivo anteriormente creado. Llevamos a su escenario un componente de video, este lo encontramos en la ventana Componentes y lo nombramos con el nombre de instancia my_video en el panel propiedades.

Transcript of Final

Page 1: Final

El primer paso consiste en crear un archivo .as el cual llamaremos con el nombre marca_multiple_Vid.Procedemos a crear un archivo .fla y lo asociamos con el archivo anteriormente creado.Llevamos a su escenario un componente de video, este lo encontramos en la ventana Componentes y lo nombramos con el nombre de instancia my_video en el panel propiedades.

Page 2: Final

Líneas 3 - 10

Una vez generado el paquete que contendrá la clase procedemos a importar las clases que utilizaremos en nuestra programación para hacer posible la visualización de un video a través de Realidad Aumentada.

Estas clases son…

Page 3: Final

Líneas 3 – 4 No nativas3 FLARManagerEsta clase controla la cámara y la detección del marcador impreso por la misma, vincula un archivo .xml (flarConfigING.xml) que a su vez se encarga de comunicar los archivos de parámetros de cámara y de reconocimiento de marcador. (camera_para.dat y patron.pat)Si no importamos esta clase Flash no tendrá acceso a la cámara de nuestro computador.Se pueden configurar varios marcadores los cuales serán reconocidos por la aplicación.

4 FLARMarkerEventEsta clase reconoce y notifica los movimientos del marcador, de esta forma Flash podrá saber la posición exacta del mismo y ejecutará las acciones requeridas sobre el objeto que visualizamos como escalarlo y posicionarlo.

Page 4: Final

Líneas 7 – 10 Nativas

7 *displayLa lista de métodos y propiedades que harán visibles en la pantalla el contenido gráfico que queramos ver a través de Flash. Si no importamos esta lista el contenido será invisible.

8 Event:import flash.events.Event;La clase Event nos permitirá crear y manipular los sucesos que se ejecutarán en la aplicación y se transmitirán a los siguientes eventos:

Page 5: Final

• this.fm.addEventListener(Event.INIT, this.onFlarManagerInited);Cuando la aplicación comienza a ejecutarse.

• this.fm.addEventListener(FLARMarkerEvent.MARKER_ADDED, this.onMarkerAdded);Cuando el marcador es mostrado a la cámara y reconocido por Flash.

• this.fm.addEventListener(FLARMarkerEvent.MARKER_UPDATED, this.onMarkerUpdated);Cuando la posición del marcador cambia.

• this.fm.addEventListener(FLARMarkerEvent.MARKER_REMOVED, this.onMarkerRemoved);Cuando el marcador es retirado del rango de observación de la cámara.

Page 6: Final

9 NetConnectionEsta clase crea el canal por el cual se transmitirá el video el cual estará almacenado en una carpeta local. Dicho almacenamiento podría hacerse también en un servidor Web.

10 NetStreamEl uso de esta clase nos permite acceder al canal generado a través de NetConnection. Añadiendo métodos como play y pause podremos manipular el contenido almacenado en ella.

Page 7: Final

Líneas 13 - 28 Nativas

Declaramos las variable con las cuales almacenaremos los datos empleados.

17 fm: FLARManager

18 connection_nc: NetConnection;

19 stream_ns:NetStream

21 - 28 Constructor:El constructor nos permite pasar propiedades y métodos a los objetos que crearemos en nuestra clase.

Page 8: Final

Líneas 32 - 48 Iniciamos FLARManager

35 Vinculamos el archivo .xml39 Gracias al método addChildAt podremos tener sobre la imagen de video transmitida por la cámara, el objeto video.

41 - 45 Creamos los detectores de eventos:this.fm.addEventListener(FLARMarkerEvent.MARKER_ADDED, this.onMarkerAdded);this.fm.addEventListener(FLARMarkerEvent.MARKER_UPDATED, this.onMarkerUpdated);this.fm.addEventListener(FLARMarkerEvent.MARKER_REMOVED, this.onMarkerRemoved);this.fm.addEventListener(Event.INIT, this.onFlarManagerInited);

Page 9: Final

Líneas 32 - 48 Iniciamos FLARManager

35 Vinculamos el archivo .xml39 Gracias al método addChildAt podremos tener sobre la imagen de video transmitida por la cámara, el objeto video.

41 - 45 Creamos los detectores de eventos:this.fm.addEventListener(FLARMarkerEvent.MARKER_ADDED, this.onMarkerAdded);this.fm.addEventListener(FLARMarkerEvent.MARKER_UPDATED, this.onMarkerUpdated);this.fm.addEventListener(FLARMarkerEvent.MARKER_REMOVED, this.onMarkerRemoved);this.fm.addEventListener(Event.INIT, this.onFlarManagerInited);

Page 10: Final

Líneas 50 - 65 Función onFlarManagerInited

Con esta función controlaremos los sucesos que queremos se ejecuten al mostrar el marcador a la cámara, para eso haremos uso de la condicional switch.77 - 78 Posicionamos el video en los ejes de x y y con relación al marcador.80 Lo escalamos de acuerdo a la distancia en que se encuentre el marcador con relación a la cámara.81 Se produce la magia… hacemos visible el video con el método visible. 83 Con el método resume, hacemos que se reproduzca justo en el lugar donde fue pausado.

Page 11: Final

Líneas 69 – 94 Función onMarkerAdded

52 Removemos el detector de eventos de inicio.55 56 Generamos la conexión.58 Llevamos los datos almacenados en connection_nc a stream_ns.59 A través del método attachNetStream hacemos visible el contenido de stream_ns en la instancia My_ Video 60 Con el método play comenzamos la reproducción de video, es acá donde le decimos que video queremos que se reproduzca.61 Inmediatamente lo pausamos, esto con el fin de que aun no sea visible en pantalla.

Page 12: Final

Líneas 96 - 115 Función onMarkerUpdated

Esta es la función que controla los sucesos en el momento en que el marcador es movido. De nuevo empleamos la condicional switch.101 102 volvemos a posicionar el video en los ejes de x y y con relación al marcador.105 volvemos a escalar el video de acuerdo a la distancia en que se encuentre el marcador con relación a la cámara.

Page 13: Final

Líneas 117 - 132 Función onMarkerRemoved

Con esta última función controlamos los sucesos que se deben desarrollar cuando el marcador sea invisible a la cámara o como su nombre lo indica removido.Curiosamente hacemos uso de la condicional switch.

122 hacemos que el video sea invisible utilizando el valor false de la propiedad visible.123 Utilizamos el método pause para que el video suspenda su reproducción.

Page 14: Final

Función Gracias ;)

Por último concatemanos la variable ; y la variable ) para obtener:

;)Gracias