Manual de usuario
CreaTV Digital: Herramienta para la creación de aplicaciones NCL para el
middleware GINGA de Televisión ...
2
Contenido
1. Introducción..................................................................................................
3
9.1.1. Control remoto......................................................................................................
CreaTV Digital – Agosto 2011
4
1. Introducción
Este manual le permitirá aprender a utilizar todas las funcionalidades de C...
CreaTV Digital – Agosto 2011
5
3°) Seguimos desde la consola ubicados en la carpeta donde se encuentra el código fuente
(....
CreaTV Digital – Agosto 2011
6
3.1. Crear un proyecto nuevo
Para crear un proyecto nuevo podemos hacerlo presionando el íc...
CreaTV Digital – Agosto 2011
7
Abrir un proyecto
Área Espacial
4. Regiones
Una región representa un área de la pantalla de...
CreaTV Digital – Agosto 2011
8
4.1. Crear Regiones
Para crear una nueva región debemos seleccionar el ícono que se encuent...
CreaTV Digital – Agosto 2011
9
Redimensionar una región
Otra forma de modificar una región es a través de la tabla que con...
CreaTV Digital – Agosto 2011
10
4.3. Tips para crear o modificar regiones estéticamente “perfectas”
La región es un elemen...
CreaTV Digital – Agosto 2011
11
4.4. Eliminar Regiones
Para eliminar una región solo debemos posicionarnos con el puntero ...
CreaTV Digital – Agosto 2011
12
Árbol de regiones
La lectura de este árbol la podemos hacer de la siguiente forma:
 La re...
CreaTV Digital – Agosto 2011
13
5. Formato de la pantalla
Durante el desarrollo de un proyecto podemos elegir entre 4 form...
CreaTV Digital – Agosto 2011
14
Marca indicadora de formato de pantalla PALN – 720x576 px
5.2. Establecer relación entre l...
CreaTV Digital – Agosto 2011
15
HDTV 720p (1280x720 px) ya que en la segundo formato la región se verá mucho más ancha que...
CreaTV Digital – Agosto 2011
16
6.1. Importando Medias
Tenemos la opción de importar entre 6 grupos de medias que son imag...
CreaTV Digital – Agosto 2011
17
En la solapa Importar Medias hay 4 grupos de medias que son Videos, Sonidos, Imágenes y Te...
CreaTV Digital – Agosto 2011
18
Hay que tener en cuenta que todos los campos de esta ventana son obligatorios y cada Uri n...
CreaTV Digital – Agosto 2011
19
De cualquiera de las dos formas que elijamos, luego de realizar los pasos anteriormente
de...
CreaTV Digital – Agosto 2011
20
Área Temporal
7. Listas de medias
En el área temporal tenemos 2 listas de medias, una es l...
CreaTV Digital – Agosto 2011
21
La primer región contiene los medias “botonrojo.png” y botonverde.png
La segunda región co...
CreaTV Digital – Agosto 2011
22
En la lista “Medias Usados” podemos ver los medias de las dos regiones
7.2. Eliminar un me...
CreaTV Digital – Agosto 2011
23
8. Línea de tiempo
En el centro del área temporal está ubicada la línea de tiempo. Esta no...
CreaTV Digital – Agosto 2011
24
Elementos de la línea de tiempo
El media creatvdigital.mpeg es el video principal y es el ...
CreaTV Digital – Agosto 2011
25
del media, por lo tanto es también infinita. La interactividad tiene asociada el botón ver...
CreaTV Digital – Agosto 2011
26
Eliminar línea de tiempo de un media
Después de eliminar la línea de tiempo de vida de un ...
CreaTV Digital – Agosto 2011
27
Creando una interactividad – vista 1
Creando una interactividad – vista 2
Creando una inte...
CreaTV Digital – Agosto 2011
28
Creando una interactividad – vista 4 (interactividad finalizada)
Es importante aclara que ...
CreaTV Digital – Agosto 2011
29
9.2. Modificar una interactividad
Para modificar una interactividad debemos primero posici...
CreaTV Digital – Agosto 2011
30
Cambiar el botón de una interactividad – vista 1
Cambiar el botón de una interactividad – ...
CreaTV Digital – Agosto 2011
31
9.3. Eliminar una interactividad
Para eliminar una interactividad debemos primero posicion...
CreaTV Digital – Agosto 2011
32
de las acciones que seleccionemos debemos indicarle sobre qué media queremos ejecutársela....
CreaTV Digital – Agosto 2011
33
Asignar acciones al botón de una interactividad – vista 3 de 4
Es importante notar que cua...
CreaTV Digital – Agosto 2011
34
comienzo de reproducción del media mientras que si utilizamos la herramienta Setear se pue...
CreaTV Digital – Agosto 2011
35
Setear – vista 1
5° Seleccionar uno de los dos
medias a setear
6° Habilitar (con un clic) ...
CreaTV Digital – Agosto 2011
36
Setear – vista3
12. Tips para manejar la línea de tiempo de forma rápida y
cómoda
La línea...
CreaTV Digital – Agosto 2011
37
los costados de la línea de tiempo de los medias) que, si bien son de mucha utilidad, hay
...
CreaTV Digital – Agosto 2011
38
Extremos con marcas de acciones Madias a los que se le aplica las acciones
Línea de tiempo...
CreaTV Digital – Agosto 2011
39
Veremos un ejemplo con 4 regiones a las que asignaremos una imagen a cada región, luego a ...
CreaTV Digital – Agosto 2011
40
Ejemplo – vista 3 (Creación de la navegación desde el
media “paisaje1.jpg” hacia el media ...
CreaTV Digital – Agosto 2011
41
Ejemplo – vista 4 (Fin de la asignación de navegación al media “pasisaje1.jpg”)
En esta im...
CreaTV Digital – Agosto 2011
42
Ejemplo – vista 5 (Fin de la asignación de navegación al media “pasisaje2.jpg”)
En esta im...
CreaTV Digital – Agosto 2011
43
Ejemplo – vista 6 y 7 (Fin de la asignación de navegación al media “pasisaje3.jpg” y “pais...
CreaTV Digital – Agosto 2011
44
14. Generar el código NCL y Correr la aplicación en ginga
Una vez que terminamos el proyec...
Próxima SlideShare
Cargando en…5
×

Manual de usuario (crea tv)

190 visualizaciones

Publicado el

0 comentarios
0 recomendaciones
Estadísticas
Notas
  • Sé el primero en comentar

  • Sé el primero en recomendar esto

Sin descargas
Visualizaciones
Visualizaciones totales
190
En SlideShare
0
De insertados
0
Número de insertados
2
Acciones
Compartido
0
Descargas
2
Comentarios
0
Recomendaciones
0
Insertados 0
No insertados

No hay notas en la diapositiva.

Manual de usuario (crea tv)

  1. 1. Manual de usuario CreaTV Digital: Herramienta para la creación de aplicaciones NCL para el middleware GINGA de Televisión Digital Terrestre “CreaTV Digital” es una herramienta de fácil manejo destinada a desarrolladores de contenidos con una interface orientada a la producción de contenidos interactivos de Televisión Digital (TVD) de manera gráfica, sin la necesidad de conocimientos detallados de los lenguajes NCL y Lua. La herramienta permite al usuario, por medio de una interfaz gráfica e intuitiva, realizar el contenido (programa/película junto con su aplicación interactiva) y generar automáticamente el código NCL correspondiente para poder ser ejecutado en el middleware Ginga. La herramienta ha sido desarrollada en el lenguaje C++ bajo la biblioteca multiplataforma Qt. Autores: Cardozo, Sergio Alejandro (yojajo@gmail.com) Schwartz, Sebastián Martin (seba.schwartz@gmail.com) Director: Lic. Marcelo Arroyo Co-Directora: Lic. María Laura Tardivo Agosto de 2011
  2. 2. 2 Contenido 1. Introducción................................................................................................................................ 4 2. Instalación ................................................................................................................................... 4 3. Inicio del programa ..................................................................................................................... 5 3.1. Crear un proyecto nuevo .................................................................................................... 6 3.2. Abrir un proyecto ya creado ............................................................................................... 6 Área Espacial 4. Regiones...................................................................................................................................... 7 4.1. Crear Regiones .................................................................................................................... 8 4.2. Modificar Regiones.............................................................................................................. 8 4.3. Tips para crear o modificar regiones estéticamente “perfectas” ..................................... 10 4.4. Eliminar Regiones.............................................................................................................. 11 4.5. Visualizar Regiones............................................................................................................ 11 4.6. Zoom ................................................................................................................................. 12 5. Formato de la pantalla .............................................................................................................. 13 5.1. Marcar formatos de pantalla en la sección de dibujo de regiones................................... 13 5.2. Establecer relación entre las regiones y el formato de pantalla....................................... 14 6. Medias....................................................................................................................................... 15 6.1. Importando Medias........................................................................................................... 16 6.2. Asignar Medias a una región............................................................................................. 18 6.3. Eliminar Medias................................................................................................................. 19 Área Temporal 7. Listas de medias ........................................................................................................................ 20 7.1. Funciones de las listas de medias ..................................................................................... 20 7.2. Eliminar un media ............................................................................................................. 22 8. Línea de tiempo......................................................................................................................... 23 8.1. Elementos de la línea de tiempo....................................................................................... 23 8.2. Arrastrar medias a la línea de tiempo............................................................................... 25 8.3. Eliminar un media de la línea de tiempo .......................................................................... 25 9. Interactividad ............................................................................................................................ 26 9.1. Crear interactividad........................................................................................................... 26
  3. 3. 3 9.1.1. Control remoto........................................................................................................ 28 9.2. Modificar una interactividad............................................................................................. 29 9.2.1. Modificar el botón del control remoto asignado a la interactividad ............................ 29 9.3. Eliminar una interactividad ............................................................................................... 31 10. Asignar acciones a un media................................................................................................. 31 11. Asignar propiedades a los medias......................................................................................... 33 11.1. Asignar propiedades usando la cabeza de la línea de tiempo ...................................... 34 11.2. Asignar propiedades a un media a través de la acción setear...................................... 34 12. Tips para manejar la línea de tiempo de forma rápida y cómoda ........................................ 36 13. Navegación por flechas......................................................................................................... 38 14. Generar el código NCL y Correr la aplicación en ginga ......................................................... 44
  4. 4. CreaTV Digital – Agosto 2011 4 1. Introducción Este manual le permitirá aprender a utilizar todas las funcionalidades de CreaTV Digital. Si usted quiere observar algunos ejemplos de la aplicación para tener una idea general de cómo funciona y comprenderla mejor, mire los videos que se encuentran en http://code.google.com/p/creatvdigital/ donde también podrá descargar ejemplos de proyectos creados con esta herramienta para que los pueda abrir y practicar modificándolos. 2. Instalación CreaTV Digital se ha desarrollado sobre el Sistema Operativo Ubuntu 10.10 y fue testeado sobre las distintas versiones de Ubuntu y KUbuntu. Para la ejecución del código fuente1 del programa es necesario realizar los siguientes pasos: 1°) Lo primero que tenemos que hacer es descargar e instalar las librerías necesarias para un correcto funcionamiento de la herramienta CreaTv Digital. A continuación listaremos las bibliotecas que hay que instalar y la forma de hacerlo desde una terminal:  Librerias Qt para desarrollo - sudo apt-get install libqt4-dev  Librerias C++ - sudo apt-get install g++  Librerias Phonon (para tratamiento de archivos multimedia) - sudo apt-get install libphonon-dev  Librerias para tratamiento de archivos de video - sudo apt-get install libxine1-ffmpeg - sudo apt-get install ffmpeg 2°) Luego de instalar las librerías realizaremos los siguientes 3 pasos para compilar el código fuente y luego ejecutarlo. Para ello debemos primero ubicarnos(a través de una consola) en la carpeta donde se encuentra el código fuente (..../CreaTVDigital/) y luego generar el Makefile ejecutando el siguiente comando: - qmake 1 Para descargar el código fuente ingresar a http://code.google.com/p/creatvdigital/downloads/
  5. 5. CreaTV Digital – Agosto 2011 5 3°) Seguimos desde la consola ubicados en la carpeta donde se encuentra el código fuente (..../CreaTVDigital/) pero en este caso vamos a compilar CreaTV Digital ejecutando el comando: - make 4°) Por último (desde la misma carpeta donde se encuentra el codigo fuente (..../CreaTVDigital/)) ejecutamos el comando: - ./CreaTVDigital Es importante aclarar que una vez que se hayan hecho estos pasos, para ejecutar nuevamente la aplicación no es necesario volver a hacer todos los pasos nuevamente sino que solo basta con hacer el paso 4°. 3. Inicio del programa Al ejecutar CreaTV Digital se abre la ventana principal del programa permitiéndonos solo realizar dos acciones: la de crear un proyecto nuevo o la de abrir un proyecto ya creado. Luego de seleccionar alguna de estas dos acciones se habilitan todas opciones del programa. La pantalla principal del programa está dividida en dos secciones importantes. Una de ellas es el área espacial y la otra es el área temporal. Área Temporal Secciones principales de la herramienta Área Espacial
  6. 6. CreaTV Digital – Agosto 2011 6 3.1. Crear un proyecto nuevo Para crear un proyecto nuevo podemos hacerlo presionando el ícono o a través del menú Archivo/Nuevo. De esta manera se abrirá una nueva ventana donde podemos ingresar los datos del proyecto nuevo. Crear Nuevo Proyecto Es importante destacar que los datos del formato de la pantalla pueden ser modificados durante el desarrollo del proyecto. De esta forma, al comenzar con un nuevo proyecto puede seleccionar la opción no especificar y luego durante el desarrollo del proyecto tenemos la opción de seleccionar alguna. 3.2. Abrir un proyecto ya creado Para abrir un proyecto podemos hacerlo presionando el ícono o a través del menú Archivo/Abrir. De esta manera se abrirá una nueva ventana donde podemos buscar el proyecto (con extensión .ctv que son las letras de CreaTV) que ya ha sido creado con anterioridad. Una vez encontrado hacer un clic en el botón abrir, de esta forma se cargan todos los datos del proyecto para que pueda ser modificado, generar el código fuente o solo ejecutarlo en ginga. Nombre del proyecto – Este campo es obligatorio Descripción – Aquí tenemos la opción de ingresar una breve descripción del proyecto Indicamos la posible resolución del dispositivo en la que será mostrada la aplicación
  7. 7. CreaTV Digital – Agosto 2011 7 Abrir un proyecto Área Espacial 4. Regiones Una región representa un área de la pantalla de un dispositivo donde los medias serán visualizados. Región Abrir proyecto Proyecto seleccionado para ser abierto
  8. 8. CreaTV Digital – Agosto 2011 8 4.1. Crear Regiones Para crear una nueva región debemos seleccionar el ícono que se encuentra en la barra de herramientas del área espacial, y luego en el área de dibujo hacemos un clic para crear la región y (sin soltar el botón del mouse) lo arrastramos para dar el tamaño deseado. Crear región 4.2. Modificar Regiones Una forma de modificar una región es seleccionando el ícono que se encuentra en la barra de herramientas del área espacial y luego si lo que queremos modificar es el tamaño, seleccionamos la región que deseamos modificar para posteriormente posicionarnos sobre alguno de sus vértices (notar que cuando estemos sobre algún sector de la región que nos permite modificarla, el puntero del mouse cambiará indicándonos hacia qué dirección podemos desplazarnos para cambiar su tamaño) y manteniendo el botón izquierdo del mouse presionado arrastrar el borde de la región ampliando o reduciendo su tamaño. Si lo que queremos modificar es la posición, seleccionar la región y manteniendo el botón izquierdo del mouse presionado arrastrarla hacia la posición que deseamos. 1° Seleccionar botón Crear Regiones 2° Crear la región dándole un tamaño y una posición con el mouse
  9. 9. CreaTV Digital – Agosto 2011 9 Redimensionar una región Otra forma de modificar una región es a través de la tabla que contiene las propiedades de cada región. Esta tabla está formada por tres columnas: nombre de la propiedad, el valor y tipo de valor. El tipo de valor nos permite indicar cómo esta expresado el valor de la propiedad, es decir, si el valor esta en pixeles o en porcentaje. Tabla de propiedades de una región 1° Seleccionamos el ícono en formato de flecha 2° Posicionados sobre alguno de los sectores que nos permite modificar la región, el cursor se transformará indicando el sentido que podemos redimensionarla. 3° por último redimensionamos la región
  10. 10. CreaTV Digital – Agosto 2011 10 4.3. Tips para crear o modificar regiones estéticamente “perfectas” La región es un elemento fundamental del programa y está asociado directamente con el aspecto estético que tendrá una aplicación al ejecutarse en ginga. Por lo tanto debemos ser cuidadosos al momento de crear o manipular una región. Es por esto que es importante tener en cuenta los siguientes tips:  Usar las reglas (tanto la regla vertical como la horizontal) que posee la interface de CreaTV Digital para ubicarnos de forma precisa en el espacio.  Tomar como punto de referencia los cuadrados blancos y grises que se encuentran como fondo del área crear regiones.  Usar las líneas azules que aparecen en las reglas que nos indican los bordes de la región.  Usar las marcas rojas que aparecen en las reglas y que “siguen” el puntero del mouse en cada movimiento. Esto se puede usar para tomar medidas en el área espacial usando el puntero del mouse y observando la marca en la regla.  Cuando se necesite ingresar algún valor concreto de una propiedad de una región usar la “tabla de propiedades” que nos permite definir regiones de forma más específica.  Utilizar la herramienta de zoom para obtener diversas vistas de las regiones y así poder ubicarlas en el pixel exacto. Tips Para crear o modificar Regiones Línea azul indicando el borde de la región Línea roja indicando la posición del puntero del mouse Regla horizontal Regla vertical Puntero del mouse
  11. 11. CreaTV Digital – Agosto 2011 11 4.4. Eliminar Regiones Para eliminar una región solo debemos posicionarnos con el puntero del mouse sobre la región que deseamos eliminar y luego hacemos un clic derecho y seleccionamos la opción eliminar. Tener en cuenta que si eliminamos una región padre, también se eliminan todas sus regiones hijas. Eliminar una región 4.5. Visualizar Regiones La solapa “regiones” nos muestra un árbol con todas las regiones creadas. Podemos usar este árbol para saber cuáles regiones son hijas de otra y para indicar si queremos que una región sea visible o no (si tildamos la región -con un clic-, esta será visible. Si destildamos la región, esta no será visible). Esto nos sirve para, por ejemplo, poder trabajar más cómodos con regiones que quedan debajo de otras (de esta forma ocultando la región que tapa a otra, podemos trabajar sobre la región que estaba debajo y luego volver a convertir en visible la región superpuesta). 1° Seleccionamos el ícono en forma de flecha. 2° En la región que queremos eliminar hacemos un clic derecho y seleccionamos Eliminar.
  12. 12. CreaTV Digital – Agosto 2011 12 Árbol de regiones La lectura de este árbol la podemos hacer de la siguiente forma:  La región “0” es la primer región que se creó y no posee padre ni hijos. También podemos decir que al tener una tilde (junto al nombre) esta región esta visible en el área de dibujo de regiones.  La región “1” posee 2 hijos que son la región “2” y la “3”.  Las regiones “1” y “2” son visibles pero la “3” no es visible en este instante ya que no está marcada.  La región “4” posee un hijo que es la región “5” y, a su vez, la región “5” posee un hijo que es la región “6”, todas ellas están visibles. Es importante marcar que si eliminamos la región “5” también se elimina la región ”6” por ser hijo de la región eliminada, al igual que si eliminamos la región “4” ocurre una eliminación en cadena de las regiones “5” y “6” 4.6. Zoom La herramienta zoom permite obtener distintas vistas de las regiones, gracias a esto podemos trabajar de forma más específica con las ellas. Herramientas de zoom Reestablecer Zoom Aumentar Zoom Disminuir Zoom Nivel de Zoom
  13. 13. CreaTV Digital – Agosto 2011 13 5. Formato de la pantalla Durante el desarrollo de un proyecto podemos elegir entre 4 formatos de pantallas que son PAL N (720x576 px), PAL Ancho (1024x576 px), HDTV 720p (1280x720 px), HDTV 1080i (1920x1080 px). Existen dos objetivos para seleccionar un formato, una es para marcar el formato elegido en la sección de dibujo de regiones (de esta forma nos guiamos con esta marca para crear o modificar regiones) y el otro objetivo es establecer una relación entre las regiones y el formato de pantalla. 5.1. Marcar formatos de pantalla en la sección de dibujo de regiones Para marcar formatos de pantalla en la sección de dibujo de regiones debemos elegir una o más de las siguientes opciones: Estas opciones se encuentran en la barra de herramientas generales o también pueden seleccionarse desde el menú ver (Ver/Marca de pantalla PALN, Ver/Marca de pantalla PAL Ancho, Ver/Marca de pantalla HDTV 720p y Ver/Marca de pantalla HDTV 1080i). Cada formato que seleccionemos crea una marca en la sección de dibujo del área temporal para que podamos ubicarnos en la pantalla según el/los formato/s elegido/s. De esta forma podemos crear y manipular regiones guiándonos por estas marcas. En la siguiente imagen podemos observar la marca con una línea puntuada azul que nos indica el formato de pantalla PALN – 720x576 px
  14. 14. CreaTV Digital – Agosto 2011 14 Marca indicadora de formato de pantalla PALN – 720x576 px 5.2. Establecer relación entre las regiones y el formato de pantalla Para establecer relación entre las regiones y el formato de pantalla debemos elegir una de las siguientes opciones: Estas opciones se encuentran en la barra de herramientas generales o también pueden seleccionarse desde el menú ver (Ver/Relación Región PALN, Ver/Relación Región PAL Ancho, Ver/Relación Región HDTV 720p, Ver/Relación Región HDTV 1080i). Es importante tener en cuenta que solo las regiones que posean algunos de los valores de sus atributos expresados en porcentaje pueden establecer esta relación con el formato de la pantalla. Esto se debe a que si las propiedades (Eje x, Eje y, Ancho, Alto) de una región están expresadas en pixel estamos especificando el lugar que queremos que se muestre esa región sin importar en que formato de pantalla será exhibida. En cambio, si especificamos alguno o todos los atributos de una región con porcentaje estamos indicando que según el formato de pantalla que elijamos será representado el porcentaje ingresado. Por ejemplo, no es lo mismo definir una región con ancho = 50% del formato de pantalla PAL N (720x576 px) que el ancho = 50% del formato de pantalla de
  15. 15. CreaTV Digital – Agosto 2011 15 HDTV 720p (1280x720 px) ya que en la segundo formato la región se verá mucho más ancha que en el primer formato. Para ver más claro este concepto mostramos a continuación 2 figuras donde la primera esta seleccionado el botón y en la segunda el botón Región de ancho =50% con relación al formato de pantalla PALN (720x576 px) Región de ancho =50% con relación al formato de pantalla HDTV 720p (1280x720 px) Con estas dos imágenes podemos observar claramente que una misma región con el valor de de sus atributos expresados en porcentaje (como en este caso el atributo ancho = 50%) se verán de forma distinta según la relación “región/Formato de pantalla” que elijamos. 6. Medias Los medias son elementos de contenido multimedial. Es decir son los objetos que vamos a asignar a alguna región para que luego cuando se ejecute la aplicación en ginga se muestren por pantalla.
  16. 16. CreaTV Digital – Agosto 2011 16 6.1. Importando Medias Tenemos la opción de importar entre 6 grupos de medias que son imagen, video, audio, texto, lua y url. Luego de seleccionar un tipo de media presionamos el botón importar y buscamos el media deseado. Cada grupo de media está representado por imágenes. Medias Imagen que representa al media Imagen La imagen en sí. Video Alguno de los frames del video. audio Según su tipo por alguna de estas 7 imágenes: texto Según su tipo por alguna de estas 5 imágenes: lua url Representación de los objetos medias Solapa Importar Medias Solapa Importar otros
  17. 17. CreaTV Digital – Agosto 2011 17 En la solapa Importar Medias hay 4 grupos de medias que son Videos, Sonidos, Imágenes y Texto, mientras que en la solapa Importar Otros están los dos grupos de medias faltantes: Lua y Uri. La razón de separarlos así es para dividir los medias en dos grupos según su utilidad y relación, como así también para dar una mayor comodidad al usuario ya que generalmente se usaran más los medias de la solapa Importar Medias. Para importar un objeto Lua se hace de igual forma que importar Videos, Sonidos, Imágenes o Texto. Cuando presionamos el botón Importar se abre la siguiente ventana: Importar Media de tipo Imagen. En el caso de importar un Uri se debe proceder de otra forma. Cuando queremos importar un Uri nos posicionamos sobre la pestaña Uri, luego seleccionamos importar para que se abra la siguiente ventana donde completaremos los datos y por último, presionamos el botón Aceptar. Importar Uri 1° Asignamos un nombre al Uri 2° Ingresamos la dirección Uri3° Asignamos un tipo 4° Presionamos botón “Aceptar”
  18. 18. CreaTV Digital – Agosto 2011 18 Hay que tener en cuenta que todos los campos de esta ventana son obligatorios y cada Uri nuevo que se agregue debe tener un nombre distinto a los anteriores. El tipo del Uri es importante porque la aplicación se basa en ese tipo para manipularlo y asignarle propiedades relacionadas con el tipo de media elegido. 6.2. Asignar Medias a una región Una vez importado el media debemos asignarlo a alguna región. Hay dos formas de hacerlo:  Una forma es seleccionar el media y arrastrarlo hacia la región que deseamos.  La otra forma es seleccionando el media y la región que deseamos y por ultimo presionar el botón . Arrastrar el media hacia una región Asignar un media a una región usando el botón “Asignar media” 1° Seleccionar el media2° Arrastrarlo hacia una región 1° Seleccionamos una región 2° Seleccionamos un media 3° Presionamos el botón para asignar medias
  19. 19. CreaTV Digital – Agosto 2011 19 De cualquiera de las dos formas que elijamos, luego de realizar los pasos anteriormente descriptos, aparecerá una nueva ventana que nos permite cambiar el nombre del media que va a ser usado en el área temporal. Nombre para el botón rojo Nombre para el botón verde En caso que se quiera asignar más de una vez un media a una región, se debe cambiar el identificador del media por cada vez que se asigna a una región. 6.3. Eliminar Medias Para eliminar un media debemos primero seleccionar el media que queremos eliminar y luego presionar el botón . Eliminar Medias 1° Seleccionar el media que queremos eliminar 2° presionar el botón “Eliminar”
  20. 20. CreaTV Digital – Agosto 2011 20 Área Temporal 7. Listas de medias En el área temporal tenemos 2 listas de medias, una es la lista “Medias Región” que hace referencia a la lista de medias que posee una región en particular y la otra es la lista “Medias Usados” que contiene todos los medias que fueron asignados a alguna región. Lista de medias región Lista de medias usados 7.1. Funciones de las listas de medias Las dos listas de medias del área temporal poseen diversas funciones como ser:  Cuando en el área espacial seleccionamos alguna región, en la lista “Medias Región” se muestran todos los medias que pertenecen a esa región. Esto nos permite llevar un control de los medias que serán exhibido en cada región.  La lista “Medias Usados” nos permite conocer todos los medias que hemos asignados a por lo menos una región. De esta forma podemos llevar un control de todos los medias que podemos usar en la línea de tiempo.  Desde cualquiera de estas dos listas podemos arrastrar medias a la línea de tiempo para indicarle en qué momento debe ser exhibido.  Las listas poseen un campo llamado “usado” que nos permite saber si el media ya fue asignado a la línea de tiempo o no. A continuación mostramos un ejemplo de utilización de las dos listas. En este caso hay dos regiones creadas donde cada región tiene asignada una lista de medias. Al hacer un clic sobre una región, en la lista “Medias Región” nos mostrará todos los medias que posee esa región.
  21. 21. CreaTV Digital – Agosto 2011 21 La primer región contiene los medias “botonrojo.png” y botonverde.png La segunda región contiene los medias “paisaje1.jpg”, “paisaje2.jpg” y “paisaje3.jpg” Al seleccionar una región, se muestra la lista de medias que posee en la lista “Medias Región” Al seleccionar una región, se muestra la lista de medias que posee en la lista “Medias Región”
  22. 22. CreaTV Digital – Agosto 2011 22 En la lista “Medias Usados” podemos ver los medias de las dos regiones 7.2. Eliminar un media Para eliminar un media se siguen los mismos pasos en cualquiera de las dos listas. Lo primero que debemos hacer es seleccionar el media que queremos eliminar y después presionar el ícono . Eliminar Media Notar que cuando eliminamos un media de una lista también se elimina automáticamente de la otra lista. También es importante resaltar la restricción de que no podemos eliminar un media que se está usando en el área de dibujo de la línea de tiempo, es decir, no se pueden eliminar los medias de la lista que posean una tilde en el campo “usado”. Para eliminar un media que se está usando en la línea de tiempo, debemos primero eliminarlo de la línea de tiempo y luego eliminarlo desde alguna de las dos listas. 2° Seleccionamos botón Eliminar. 1° Seleccionamos un media de una de las listas.
  23. 23. CreaTV Digital – Agosto 2011 23 8. Línea de tiempo En el centro del área temporal está ubicada la línea de tiempo. Esta no es una línea de tiempo convencional sino que posee otras características que hacen que se la pueda usar para modelado de aplicaciones para la TV Digital. Es muy importante comprender el funcionamiento de esta línea de tiempo para lograr desarrollar aplicaciones NCL de baja y alta complejidad. La línea de tiempo que posee CreaTV Digital es una implementación del “Modelo de Línea de Tiempo”2 que tuvimos que crear para cumplir con uno de nuestros principales objetivos que fue el de crear una herramienta de fácil utilización para generar aplicaciones NCL. La línea de tiempo está compuesta de dos partes, una es la cabeza y la otra es el cuerpo de la línea de tiempo. Sus funcionalidades son distintas ya que en el cuerpo están las líneas de tiempo de cada media indicando el tiempo de vida del media, mientras que en la cabeza se encuentra la imagen y nombre que representan al media. A lo largo de esta sección veremos con mayor detalle sus funcionalidades. Cabeza y cuerpo de la línea de tiempo 8.1. Elementos de la línea de tiempo En la línea de tiempo cada media ocupa una fila y cada fila contiene hasta 4 elementos que son la imagen que representa al media, el nombre, la línea de tiempo de vida del media y posible interactividad, de las cuales las tres primera siempre están presentes y la última (interactividad) es opcional (es decir, puede o no estar presente dependiendo de nuestras necesidades). 2 Para más información sobre el modelo, dirigirse al informe de la herramienta “CreaTV Digital” a la sección de diseño Cabeza Cuerpo
  24. 24. CreaTV Digital – Agosto 2011 24 Elementos de la línea de tiempo El media creatvdigital.mpeg es el video principal y es el primer media que se soltó en la línea de tiempo. Este media posee una línea de tiempo simple que indica su tiempo de vida, es decir, desde qué momento comienza y cuándo termina (estos dos extremos están indicados con una barra vertical) y también posee una línea vertical que lo conecta con el video principal indicando una relación entre ellos. El media botonrojo.png posee puntos suspensivos indicando que la presentación de esta imagen no tiene fin. En la primer mitad del tiempo de vida de este media se ha creado una interactividad que tiene asociado el botón rojo del control remoto. El media paisaje1.jpg está relacionado con la interactividad creada en el paso anterior, esto significa que cuando ejecutemos esta aplicación en ginga, al presionarse el botón rojo del control remoto en alguna parte del trecho de tiempo de la interactividad se inicia la presentación de este media. Notamos también que a los costados de la línea de tiempo del media hay líneas punteadas que terminan en un rombo, estas se llaman margen de interactividad. Estas líneas nos indican el rango de variabilidad de tiempo posible en el cual el media puede iniciar y terminar, es decir, indica el menor tiempo en el que el media pueda empezar y el máximo tiempo que el media pueda terminar (según la intervención del usuario presionando una tecla del control remoto)3 . La última combinación que podemos realizar en la línea de tiempo es una línea de tiempo de vida del media que es infinita y asociada a ella una interactividad que ocupa toda la línea de vida 3 Para más detalles ver “Modelo de Línea de Tiempo” del capítulo diseño del informe de CreaTVDigital. 1 2 3 4 5 6 1 2 3 4 5 6
  25. 25. CreaTV Digital – Agosto 2011 25 del media, por lo tanto es también infinita. La interactividad tiene asociada el botón verde del control remoto 8.2. Arrastrar medias a la línea de tiempo Para indicar en qué momento debe exhibirse un media se lo arrastra desde alguna de las dos listas de medias, “Medias Región” o “Medias Usados”, hacia el área de dibujo de la línea de tiempo, de esta forma le indicamos el momento en el que queremos que el media sea presentado. Es importante tener en cuenta que el media que ubiquemos como primer lugar en la línea de tiempo será el media principal (en NCL se dice que este media es el principal y tiene un port). Arrastrar un media a la línea de tiempo Luego de soltar el media 8.3. Eliminar un media de la línea de tiempo Para eliminar un media de la cabeza y cuerpo de la línea de tiempo, debemos hacerlo con la herramienta goma. Lo primero que debemos hacer es seleccionar el ícono y luego posicionarnos con el puntero del mouse sobre la “fila” o línea donde se encuentra la línea de tiempo de vida del media a eliminar y luego hacer un clic. Notar que cuando nos desplazamos con el puntero del mouse entre las distintas líneas de tiempo de vida de los medias, se sobresalta el posible media (junto con su línea de vida) a ser eliminado. 1° Seleccionar un media2° Arrastrar el media hasta el lugar deseado 3° Soltar el media (notaremos que aparece una nueva línea vertical)
  26. 26. CreaTV Digital – Agosto 2011 26 Eliminar línea de tiempo de un media Después de eliminar la línea de tiempo de vida de un media Es importante tener en cuenta que cuando vamos a eliminar una línea de tiempo de un media también se eliminaran todas las líneas te tiempo de todos los medias que estén relacionados con la línea de tiempo a eliminar. La forma de proceder es similar a la de un árbol, es decir, cuando se elimina un padre también se eliminan sus hijos. 9. Interactividad A toda línea de tiempo de vida de los medias se le puede agregar interactividad. Esto significa que cada vez que un media es reproducido en ginga, este media está predispuesto a la realización de alguna actividad al ser seleccionado por el usuario mediante algún botón del control remoto. 9.1. Crear interactividad Para crear una interactividad primero debemos seleccionar el icono , luego debajo de la línea de tiempo de vida del media que deseamos asignarle interactividad, hacemos un clic y manteniendo presionado el botón izquierdo del mouse extendemos la interactividad al tiempo deseado. Una vez que tenemos la longitud deseada soltamos el botón del mouse y se abrirá una nueva ventana con forma de control remoto para que podamos seleccionar un botón del mismo para la interactividad. 3° hacer un clic, esto hace que se elimine la línea y los medias que están por debajo suben una posición 2° Desplazarnos con el puntero del mouse hasta la fila donde se encuentra la línea de vida del media 1° Seleccionar el botón “Goma”
  27. 27. CreaTV Digital – Agosto 2011 27 Creando una interactividad – vista 1 Creando una interactividad – vista 2 Creando una interactividad – vista 3 3° Hacer un clic (izquierdo) y mantenerlo presionado hasta darle la longitud deseada. 2° Ubicar el puntero del mouse debajo de la línea de tiempo a la que le vamos a asignar una interactividad. 1° Seleccionar el botón de interactividad. 4° Seleccionar un botón (el rojo en este caso) y luego presionar Aceptar
  28. 28. CreaTV Digital – Agosto 2011 28 Creando una interactividad – vista 4 (interactividad finalizada) Es importante aclara que se pueden crear más de una interactividad en cada media Múltiples interactividades 9.1.1. Control remoto La ventana que simula a un control remoto nos permite seleccionar cualquier botón del control remoto para asignarlo a una interactividad. Control remoto general control remoto mostrando las letras
  29. 29. CreaTV Digital – Agosto 2011 29 9.2. Modificar una interactividad Para modificar una interactividad debemos primero posicionarnos con el puntero del mouse sobre alguna de sus dos barras verticales que marcan los extremos de la interactividad, luego arrastrarla (con el botón izquierdo del mouse presionado) hacia uno de los costados aumentando o reduciendo la longitud de la línea de interactividad. Cuando queremos que la longitud de la línea de una interactividad sea de igual tamaño que la línea de vida del media a la cual esta asignada, tenemos la opción de hacerlo arrastrando sus extremos como explicamos anteriormente o posicionándonos sobre algunas de sus dos barras verticales que delimitan la interactividad, hacer un clic derecho para posteriormente seleccionar (del menú desplegable) la opción “Adaptar al Media”. Asignar a una interactividad la longitud de la línea de vida del media Luego de seleccionar “Adaptar al Media” Hay que tener en cuenta que la línea de la interactividad no puede ser más grande que la línea de vida del media al cual ha sido asignada. 9.2.1. Modificar el botón del control remoto asignado a la interactividad Para modificar el botón del control remoto asignado a una interactividad debemos primero posicionarnos con el puntero del mouse sobre alguna de sus dos barras verticales que marcan los extremos de la interactividad, luego hacer un clic derecho y posteriormente seleccionar (del menú desplegable) la opción “Editar botón“. Una vez hecho esto se abrirá la ventana del control remoto para que podamos seleccionar un nuevo botón para la interactividad.
  30. 30. CreaTV Digital – Agosto 2011 30 Cambiar el botón de una interactividad – vista 1 Cambiar el botón de una interactividad – vista 2 Cambiar el botón de una interactividad – vista 3 (el botón amarillo cambia por el nuevo (rojo)) 1° hacer un clic derecho sobre uno de los extremos de la interactividad y luego seleccionar “Editar boton” 2° Seleccionar un botón del control remoto (en este caso el botón rojo) y luego presionar “Aceptar”
  31. 31. CreaTV Digital – Agosto 2011 31 9.3. Eliminar una interactividad Para eliminar una interactividad debemos primero posicionarnos con el puntero del mouse sobre alguna de sus dos barras verticales que marcan sus extremos, luego hacer un clic derecho y posteriormente seleccionar (del menú desplegable) la opción “Eliminar Interactividad“. Al eliminar una interactividad también se eliminan todas las líneas de tiempo de todos los medias que están relacionados con la interactividad eliminada (es decir todos los medias que fueron asignados a esa interactividad). Eliminar Interactividad Luego de eliminar la interactividad Es importante tener en cuenta que también podemos eliminar una interactividad utilizando la herramienta “goma” que está representada con el icono . Con esta herramienta eliminamos la línea de tiempo de vida del media al cual fue asignada la interactividad, de esta forma se elimina también la interactividad asociada. 10. Asignar acciones a un media Existen tres elementos de un media a los que se les pueden asignar acciones. Uno es cuando comienza el media (en la barra vertical que inicia la línea de vida del media) otro es cuando termina (en la barra vertical que termina la línea de vida del media) y el último es en el botón de una interactividad. Si queremos asignar acciones en cualquiera de las dos barras verticales de los extremos del media, debemos hacerle un clic derecho y luego seleccionar (del menú desplegable) la opción “Acciones”, esto hace que se habrá una nueva ventana que muestra todas las acciones que podemos asignarle al media (comenzar, parar, pausar, reanudar, abortar y setear). Cualquiera
  32. 32. CreaTV Digital – Agosto 2011 32 de las acciones que seleccionemos debemos indicarle sobre qué media queremos ejecutársela. Se pueden asignar múltiples acciones en los distintos elementos de los medias, todas ellas se ejecutarán en paralelo. La acción setear es un poco más compleja por lo que la explicaremos más adelante en otro apartado. Por otro lado, si lo que queremos es asignar acciones a un botón de una interactividad entonces hay que presionarlo (hacerle un clic) para que se abra la ventana de acciones y luego proceder como explicamos anteriormente. Asignar acciones al botón de una interactividad – vista 1 de 4 Asignar acciones al botón de una interactividad – vista 2 de 4 (los pasos 2°, 3° y 4° se pueden repetir para asignar más acciones y/o medias) 1° Hacer un clic sobre el botón de la interactividad 2° Seleccionar una acción 3° Seleccionar un media 4° Presionar botón “agregar media”
  33. 33. CreaTV Digital – Agosto 2011 33 Asignar acciones al botón de una interactividad – vista 3 de 4 Es importante notar que cuando terminemos de asignar acciones aparecerán, al costado del elemento al que se las asignamos, figuras que nos indican qué acciones realiza el elemento (comenzar , parar , pausar , reanudar , abortar y setear ) Asignar acciones al botón de una interactividad – vista 4 de 4 Las figuras que aparecen a la orilla del elemento nos ayuda a tener una visión general de la línea de tiempo, y así evitar analizar cada evento (comienzo y fin de línea, botón de interactividad), si queremos saber más detalles sobre a qué medias se les aplican la acción debemos pasar el mouse sobre el elemento y se desplegara esta información. Si aún deseamos más información, presionamos nuevamente el clic derecho sobre el elemento deseado y seleccionamos “Acciones” para visualizar las acciones que hemos asignado hasta el momento 11. Asignar propiedades a los medias Existen dos formas de asignar propiedades a un media, una es utilizando la cabeza de la línea de tiempo y la otra es utilizando la herramienta Setear que se encuentra entre las acciones a asignar a un media. La diferencia entre estas dos es que utilizando la cabeza de la línea de tiempo se pueden cambiar solo las propiedades del media seleccionado y los cambios tienen efecto desde el 5° Presionar “Aceptar” Figura indicando que el botón rojo de la interactividad realiza la acción “parar”
  34. 34. CreaTV Digital – Agosto 2011 34 comienzo de reproducción del media mientras que si utilizamos la herramienta Setear se pueden asignar propiedades a otros medias (también al media seleccionado) y estos cambios en las propiedades tienen efecto (según el lugar desde donde se lo asignemos) al iniciar o finalizar un media o también al presionar un botón del control remoto. 11.1. Asignar propiedades usando la cabeza de la línea de tiempo Para asignar propiedades a un media debemos hacer un clic en la cabeza de la línea de tiempo, en la línea (o fila) donde se encuentra el media. Esto hace que se abra una nueva ventana que varía según el tipo del media, es decir, la ventana mostrara las propiedades que se le puede asignar al media según su tipo (Imagen, video, texto, audio, lua, uri). Asignar propiedades a un media. 11.2. Asignar propiedades a un media a través de la acción setear Para asignar propiedades a un media a través de la herramienta setear, debemos comenzar con los mismos pasos que realizamos en el capítulo 9 “Asignar acciones a un media” seleccionando setear entre las acciones disponibles, una vez hecho esto (al presionar aceptar) se mostrará una nueva ventana donde podremos setear los distintos atributos de los medias seleccionados. Para poder entender mejor realizaremos un ejemplo donde, en el botón de interactividad de un media , seteamos las propiedades alto y ancho de una imagen, y el tamaño y color de un texto. 1° Posicionarnos con el puntero del mouse en línea donde se encuentra el media en la cabeza de la línea de tiempo y luego hacer un clic. 2° en la ventana que se abre asignar los valores que deseamos y por ultimo presionar “Aceptar”.
  35. 35. CreaTV Digital – Agosto 2011 35 Setear – vista 1 5° Seleccionar uno de los dos medias a setear 6° Habilitar (con un clic) las propiedades a asignar algún valor (en este caso alto y ancho) 7° Ingresar valor Setear – vista 2 1° hacer un clic en el botón de interactividad 2° Seleccionar la acción “Setear” 3° Asignar a la acción seleccionada los medias “paisaje1.jpg” y “casa.txt” 4° Presionar “Aceptar”
  36. 36. CreaTV Digital – Agosto 2011 36 Setear – vista3 12. Tips para manejar la línea de tiempo de forma rápida y cómoda La línea de tiempo es una de las claves de la performance de esta herramienta, por lo tanto es importante conocerla bien para desarrollar aplicaciones de forma rápida y fácil. Por ello vamos a ver algunos tips que nos van a ser de mucha utilidad:  Al momento de intentar arrastrar un media de la lista “Medias Región” o “Medias Usados” chequear en la tabla que el campo “usado” que le corresponde a ese media, no tenga una tilde, ya que si la tiene este media ya se encuentra en la línea de tiempo. De esta forma evitamos perder el tiempo de querer ubicarlo en algún sector de la línea de tiempo.  Cuando vamos a insertar un nuevo media en la línea de tiempo, lo arrastramos de una de las dos listas y lo llevamos a la línea de tiempo (como ya hemos mencionado), en este instante es importante que nos guiemos con el tiempo que nos indica arriba de la línea roja que aparece antes de soltar el media en la línea de tiempo.  Cuando la línea de tiempo contiene varios medias e interactividad, aparecen los márgenes de interactividad (que son las líneas punteadas que terminan en un rombo que se ubican a 8° Seleccionar el otro media 9° como en los pasos 6° y 7° habilitar propiedades y asignar valores 10° Por último presionar Aceptar
  37. 37. CreaTV Digital – Agosto 2011 37 los costados de la línea de tiempo de los medias) que, si bien son de mucha utilidad, hay veces que es necesario hacerlos desaparecer para ubicarnos en la línea de tiempo, para ello presionamos el botón .  Tener en cuenta, como referencia rápida, las marcas de comenzar , parar , pausar , reanudar , abortar y setear que aparecen en la línea de tiempo y en caso de necesitar mayores datos posicionarnos sobre el elemento que contiene esas marcas de esta forma aparece más información en un menú emergente y no necesitamos perder el tiempo abriendo la ventana de acciones.  Cuando arrastramos un media desde una de las listas “Medias Región” o “Medias Usados” hacia la línea de tiempo, notaremos que se marca en azul la línea de tiempo de vida a la cual el media que estamos arrastrando creara la relación cuando lo soltemos. Es importante guiarnos con esta marca ya que nos va a ser de mucha utilidad cuando en la línea de tiempo haya muchos medias con sus respectivas líneas de vida. A continuación mostramos algunos consejos útiles para conocer mejor la línea de tiempo: Boton de interactividad con 4 marcas de acciones Madias a los que se le aplica las acciones Este menú se despliega al posicionar el puntero del mouse sobre el botón Chequear que el media no posea una tilde Notar que se pone en azul la línea de vida del media al cual le vamos a soltar el nuevo media Indica el tiempo teniendo en cuenta el inicio del media que se pone en azul Marcas que nos ayudan a soltar el media en el lugar exacto donde queremos
  38. 38. CreaTV Digital – Agosto 2011 38 Extremos con marcas de acciones Madias a los que se le aplica las acciones Línea de tiempo con los márgenes de interactividad visibles. Línea de tiempo con los márgenes de interactividad ocultos. 13. Navegación por flechas Una vez que en el área espacial tenemos asignado los medias a las regiones y en el área temporal tenemos los medias asignado a la línea de tiempo, podemos crear la navegación por flechas entre algunos o todos estos medias. Para realizar esto debemos presionar el icono y luego en la ventana que se abre vamos a seleccionar un media para indicarle hacia que otros medias queremos que navegue. Presionar este botón para ocultar los márgenes de interactividad (o para volverlos a visualizar)
  39. 39. CreaTV Digital – Agosto 2011 39 Veremos un ejemplo con 4 regiones a las que asignaremos una imagen a cada región, luego a los 4 medias los vamos a asignar a la línea de tiempo de tal forma que comiencen todos al inicio. Ejemplo – vista 1 (Área espacial y temporal del ejemplo a desarrollar) 1° Seleccionar botón “navegación por flechas” 2° Seleccionar un media Ejemplo – vista 2 (Selección del primer media para la navegación por flechas)
  40. 40. CreaTV Digital – Agosto 2011 40 Ejemplo – vista 3 (Creación de la navegación desde el media “paisaje1.jpg” hacia el media “paisaje2.jpg”) 3° Seleccionar navegación hacia la derecha 4° Seleccionar el media hacia donde se va a navegar 5° Presionar botón “Seleccionar”
  41. 41. CreaTV Digital – Agosto 2011 41 Ejemplo – vista 4 (Fin de la asignación de navegación al media “pasisaje1.jpg”) En esta imagen volvimos a repetir los pasos 3°, 4° y 5° de tal forma que el paso 3° seleccionamos navegación hacia abajo, en el paso 4° seleccionamos el media “paiseja4.jpg” quedando el resultado como la imagen presentada. El icono que aparece al lado de cada flecha nos indica que podemos eliminar el media que asignamos a la navegación. Debemos tener en cuenta que se puede asignar un foco, esto es asignar propiedades a la navegación tales como el color de posicionamiento (que es el rectángulo que enmarca la imagen a la que se le asigno un foco), color de selección (este es el rectángulo que aparece al seleccionar la figura que tiene el foco), espesor (de los bordes del rectángulo), transparencia, media de posicionamiento y media de selección.
  42. 42. CreaTV Digital – Agosto 2011 42 Ejemplo – vista 5 (Fin de la asignación de navegación al media “pasisaje2.jpg”) En esta imagen volvimos a repetir los pasos 2°, 3°, 4° y 5° de tal forma que en el paso 2° seleccionamos el media “paisaje2.jpg” como la imagen de partida para asignarle la navegación, en este caso en el paso 3° seleccionamos navegación hacia izquierda, en el paso 4° seleccionamos el media “paiseja1.jpg” . Lo siguiente que hicimos fue volver a repetir los pasos 3°, 4° y 5° de tal forma que el paso 3° seleccionamos navegación hacia abajo, en el paso 4° seleccionamos el media “paiseja3.jpg” quedando el resultado como la imagen presentada. De esta forma podemos ver el funcionamiento de la navegación por flechas y entender que la forma de proceder, para crear cualquier navegación por flechas, es similar en todos los casos y que solo es cuestión de práctica. A continuación mostraremos las dos imágenes restantes para terminar de completar este ejemplo, los pasos realizados fueron similares a los ya mencionados.
  43. 43. CreaTV Digital – Agosto 2011 43 Ejemplo – vista 6 y 7 (Fin de la asignación de navegación al media “pasisaje3.jpg” y “paisaje4.jpg”) De esta forma podemos decir que la visión global de la navegación por flechas de este ejemplo sería la siguiente: “paisaje1.jpg” “paisaje2.jpg” “paisaje4.jpg” “paisaje3.jpg”
  44. 44. CreaTV Digital – Agosto 2011 44 14. Generar el código NCL y Correr la aplicación en ginga Una vez que terminamos el proyecto podemos generar el código NCL presionando el icono . De esta manera se abrirá una nueva ventana donde seleccionaremos la ubicación y el nombre que le queremos dar al código NCL a generar. Una vez hecho esto se genera el archivo con el código NCL y con extensión “.ncl”. Generar archivo NCL Luego de generar el código NCL podemos correr la aplicación en ginga presionando el botón . De esta manera se abrirá una nueva ventana de ginga mostrando nuestra aplicación, para ello es necesario tener instalado ginga en nuestra PC. Es importante aclarar que de no tener ginga instalado en la máquina se puede solo generar el archivo ncl, luego podemos correrlo en cualquier computadora que posea ginga o directamente en un set-top-box. 2° Ingresar nombre del archivo NCL a crear1° Seleccionar la ubicación del archivo a crear 3° Por ultimo presionar “Guardar”

×