Manual de MACROMEDIA DIRECTOR.-

ANEXO – Manual de Macromedia Director.
Manual de MACROMEDIA DIRECTOR.-
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 1/37
ANEXO – Manual de Macromedia Director.
Índice
ÍNDICE........................................................................................................................................................................ 2
MANUAL DE MACROMEDIA DIRECTOR. ........................................................................................................ 3
1.
COMPONENTES DE DIRECTOR. ................................................................................................................. 3
1.1.
1.2.
1.3.
1.4.
1.5.
2.
INCORPORAR GRÁFICOS EN LA PELÍCULA........................................................................................... 6
2.1.
2.2.
2.3.
3.
INTRODUCCIÓN. ........................................................................................................................................... 11
IMPORTAR VÍDEOS (MENÚ –> FILE -> IMPORT). .......................................................................................... 11
TRABAJAR EN EL SCORE. .......................................................................................................................... 13
5.1.
5.2.
6.
INTRODUCCIÓN. ........................................................................................................................................... 10
IMPORTAR SONIDOS (MENÚ –> FILE -> IMPORT). ........................................................................................ 10
INCORPORAR VÍDEOS EN LA PELÍCULA. ............................................................................................. 11
4.1.
4.2.
5.
INTRODUCCIÓN. ............................................................................................................................................. 6
IMPORTAR GRÁFICOS (MENÚ -> FILE -> IMPORT). ......................................................................................... 7
TRANSFORMACIÓN DE BITMAPS (MENÚ -> MODIFY -> TRANSFORM BITMAP). .............................................. 9
INCORPORAR SONIDOS EN LA PELÍCULA............................................................................................ 10
3.1.
3.2.
4.
LA VENTANA CAST (MENU -> WINDOWS -> CAST)....................................................................................... 3
LA VENTANA TOOL PALETTE (MENU WINDOW -> TOOL PALETTE)............................................................. 4
INSPECTOR DE TEXTO (MENU WINDOW -> INSPECTOR -> TEXT). ................................................................ 5
LA VENTANA BEHAVIOUR (MENU WINDOW -> INSPECTOR -> BEHAVIOUR)................................................. 5
LA VENTANA SCORE (MENU WINDOW -> SCORE)......................................................................................... 6
DEFINICIÓN DE LAS PROPIEDADES DE NUESTRA PELÍCULA. .......................................................................... 13
INCORPORACIÓN DE LOS MIEMBROS DEL REPARTO EN EL STORE. ................................................................ 14
PRIMERAS ANIMACIONES EN DIRECTOR. ........................................................................................... 15
6.1.
6.2.
6.3.
CREACIÓN DE UNA ANIMACIÓN SIMPLE........................................................................................................ 16
ASIGNAR EL TIEMPO DE REPRODUCCIÓN A LA PELÍCULA.............................................................................. 18
FILMLOOPS. ................................................................................................................................................. 19
7.
SPRITES............................................................................................................................................................ 21
8.
INTRODUCCIÓN A LINGO. ......................................................................................................................... 21
8.1. VARIABLES. ................................................................................................................................................. 23
8.1.1.
Ámbito de las variables (locales y globales)....................................................................................... 24
8.2. OPERADORES. .............................................................................................................................................. 26
8.3. ESTRUCTURAS DE CONTROL......................................................................................................................... 28
8.3.1.
Estructuras if....................................................................................................................................... 28
8.3.2.
Declaraciones case. ............................................................................................................................ 28
8.3.3.
Iteraciones........................................................................................................................................... 30
8.4. EVENTOS Y MANEJADORES DE EVENTOS (HANDLERS).................................................................................. 32
8.4.1.
Eventos de teclado. ............................................................................................................................. 32
8.4.2.
Eventos de ratón.................................................................................................................................. 34
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 2/37
ANEXO – Manual de Macromedia Director.
Manual de Macromedia Director.
1. Componentes de Director.
1.1. La ventana Cast (Menu -> Windows -> Cast).
En esta ventana es donde almacenamos los elementos importados o creados en el mismo
Director, que formarán parte de la pelicula. Este es el "almacén" de nuestro proyecto.
Figura 1.- Ventana de Cast.
Los diferentes elementos que podemos encontrar en esta ventana son:
•
Navegación por el Cast: Nos permite avanzar y retroceder a través de los
miembros del reparto.
•
Utilidad para mover los miembros del reparto: Esta es una herramienta muy
útil cuando tenemos un gran número de elementos en el cast y queremos mover
alguno a otra posicion no visible. Para hacerlo, seleccionamos el miembro del cast
que queremos mover y luego arrastramos el cuadradito hacia el lugar del Cast a
donde queremos mover este miembro seleccionado. Al soltar sobre la casilla que
queramos, veremos que el miembro que teniamos seleccionado se coloca en esa
casilla.
•
Script e Info del miembro de reparto: Estos son dos botones fundamentales
para trabajar en el Cast.
9 En el primero (script) podemos asignar un Script al miembro seleccionado. De
esta forma este miembro, al ser colocado en el escenario se comportará tal y
como se le haya asignado en el script de Cast, independientemente de donde
este colocado. Por ejemplo, si a un miembro le asignamos el script:
on mouseDown
beep
end
este personaje siempre reproducirá un sonido de alerta del sistema cada vez que
se haga clic sobre él.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 3/37
ANEXO – Manual de Macromedia Director.
9 El segundo botón (info) nos sirve para asignar propiedades particulares al miembro
del reparto. Más adelante veremos ejemplos en donde utilizaremos estas dos
herramientas.
1.2. La ventana Tool Palette (Menu Window -> Tool Palette).
Esta es la paleta de herramientas de Director. Las diferentes herramientas que nos
encontramos en ella son:
•
La primera herramienta es el puntero. Sirve para seleccionar y mover objetos por el
Stage (escenario).
•
La segunta es la herramienta de giro. Sirve para girar de forma libre los sprites
que hemos colocado en el escenario.
•
Luego tenemos las figuras con relleno y sin relleno. Estas figuras tiene la
particularidad de ocupar muy poca memoria, lo que agilizará nuestra pelicula si se
reproduce en internet, por ejemplo, en donde la velocidad de ejecución en un punto
crítico.
•
Los botones de selección y radio, son los tipicos botones que encontramos en
aplicaciones y páginas web. Mas adelante veremos como utilizarlos para recoger
información a través de Lingo.
•
Las herramienta siguiente nos sirve para asignar un color de fondo y frontal a
nuestras figuras, campos de texto, etc..
•
Las últimas herramientas son las de color y grosor de linea.
Figura 2.- Ventana Tool Palette.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 4/37
ANEXO – Manual de Macromedia Director.
1.3. Inspector de texto (Menu Window -> Inspector -> Text).
Aqui asignamos tipos de letra, alineación, espacio entre lineas, etc, para los textos y
campos de texto.
Figura 3.- Ventana de Inspector de Texto.
1.4. La ventana Behaviour (Menu Window -> Inspector -> Behaviour).
Es un pequeño asistente que nos permite asignar Scripts de Lingo, sin necesidad de
escribir el código, sino seleccionando los handlers y las acciones que queramos ejecutar. Mas
adelante veremos los conceptos de handler y script con mucho más detalle.
Utilizar la ventana Behavior no es la forma más limpia de programar en Director, y
siempre que podamos, debemos escribir el código nosotros mismos. Esto no es una simple
cuestión de estilo, sino que el abuso de los scripts generados en la ventana behavior puede
llegar a saturar proyectos medianamente grandes, provocando comportamientos inesperados.
Las indicaciones del gráfico, de momento, son lo suficientemente explicativas. Cuando
entremos en temas de Lingo, aprenderemos a utilizar los scripts de forma extensa y
pormenorizada.
Figura 4.- Ventana Behaviour.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 5/37
ANEXO – Manual de Macromedia Director.
1.5. La ventana Score (Menu Window -> Score).
El Score, es sin duda, la ventana que más intimida a los principiantes que se acercan a
Director. Sin embargo, una vez que comprendemos sus funciones, y empezamos a hacer
nuestros primeros juegos en ella, se va transformando simplemente en una herramienta
poderosa y versátil.
Debemos entender el Score, como un secuenciador, o una partitura, en donde
colocamos todos los elementos de nuestra pelicula.
Cuando la cabeza de reproducción comienza, va leyendo todo lo que encuentra, a la
velocidad que le hayamos asignado, interpretando y obedeciendo a los scripts que hayamos
puesto en su camino y moviendo o mostrando los sprites que hayamos colocado en los
canales.
En el gráfico inferior vemos las partes principales de la ventana score.
Figura 5.- Ventana Score.
2. Incorporar gráficos en la película.
2.1. Introducción.
En este apartado vamos a ver como se importan bitmaps de Photoshop o cualquier otro
editor de imagenes en Director. También veremos algunas propiedades de los bitmaps.
En la versión 7 de Director podemos importar una serie muy amplia de formatos gráficos,
como por ejemplo, GIF, JPEG, PNG, BMP, PICT, etc.
A la hora de importar imágenes en Director es muy importante pensar para qué las vamos
utilizar, para decidir el formato correcto. Una pantalla de ordenador funcionando a 256 colores
corresponde a 8 bits de profundidad de color, una pantalla a miles de colores corresponde a
16 bits, y una pantalla a millones de colores corresponde a 24-32 bits.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 6/37
ANEXO – Manual de Macromedia Director.
Si queremos mostrar fotografías de gran calidad podemos optar por 16, 24 ó 32 bits, pero
si lo que importamos son imágenes para animación será suficiente importarlas a 8 bits de
profundidad de color, de este modo nuestra película ocupará menos memoria y funcionará
más rápido.
No tiene en absoluto ningún sentido que realicemos una animación con imágenes a 32
bits, porque por un lado nuestra película ocupará demasiado y se arrastrará muy lentamente
en un CD-ROM de 4X velocidad, e incluso en CD-ROM de mayor velocidad. Por eso es
conveniente probar las películas directamente en CD antes de distribuirlas para evitarnos
sorpresas.
2.2. Importar gráficos (Menú -> File -> Import).
Supongamos que tenemos los gráficos que vamos a introducir en nuestra película
preparados en su carpeta o directorio correspondiente. Seleccionamos la opción del menú File
-> Import, y obtendremos una ventana similar a la mostrada en la figura siguiente:
Figura 6.- Ventana de Menú File -> Import.
En el ejemplo vemos una película QuickTime, un gráfico en formato PICT, una película de
Director 7, y un archivo de sonido en formato AIF.
Si queremos importar un solo archivo, seleccionamos en la parte superior el archivo y
pulsamos "IMPORT", de este modo pasaremos a la pantalla siguiente en función del tipo de
archivo que hayamos importado.
Si queremos importar más de un archivo a la vez, vamos seleccionando los archivos y
pulsando el botón "ADD", de este modo los archivos que serán importados se van alineando
en la parte inferior, y al pulsar "IMPORT", se importarán todos los archivos que hayan sido
pasados a la ventana inferior.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 7/37
ANEXO – Manual de Macromedia Director.
Si queremos eliminar algún archivo de la selección, lo seleccionamos en la parte inferior y
pulsamos "REMOVE".
Una vez le hemos dado al botón "IMPORT" y le hemos expresado nuestra conformidad a
Director, nos aparece una ventana similar a la siguiente en donde podemos fijar algunos
ajustes.
Figura 7.- Ventana de ajustes de la importación del gráfico.
Como podemos ver, en esta ventana podemos ajustar la profundidad de color (en el
ejemplo 8 bits - 256 colores) y podemos asignarle una paleta de color.
Lo más usual para empezar es asignarle la paleta de color de nuestro sistema, bien sea
Macintosh ó PC y activar la opción "Dither" para que los degradados de color de la imagen
sean lo más suaves posible.
También podemos hacer que el resto de imágenes que importamos mantengan las
propiedades definidas para esta.
Una vez le damos a n el proceso de importar se ha terminado y el gráfico pasa a ser parte
de la ventana Cast.
El gráfico se colocará por defecto en la primera casilla libre que encuentre el la ventana
Cast, o bien, si teníamos seleccionada una casilla concreta antes de importar, el gráfico se
colocará en esta casilla.
Figura 8.- Imagen importada como miembro del Cast.
Una vez que hemos importado la imagen en el Cast, podemos ajustar alguna de sus
propiedades. Para ello, seleccionamos el miembro del Cast que contiene la imagen y pulsamos
sobre el botón con el símbolo
seleccionado en la ventana Cast.
. Con esto accedemos a las propiedades del miembro
Conviene recordar que estos ajustes son distintos según que tipo de miembro tengamos
en el Cast.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 8/37
ANEXO – Manual de Macromedia Director.
La ventana que se muestra a continuación es la que nos aparece para los miembros de
reparto gráficos.
Figura 9.- Propiedades de los miembros de reparto gráficos.
En primer lugar vemos, que tanto en la ventana Cast como aquí, Director ha recordado el
nombre original del gráfico, pero siempre podemos cambiarlo en esta ventana o directamente
en la ventana Cast.
•
•
•
•
La Opción "Highlight When Clicked", hará que nuestro grafico se ilumine,
invirtiendo sus colores al hacer clic sobre él, cuando sea colocado en el escenario.
La opción "Dither" aplica el efecto "Dithering" (Suavizado) a los gráficos.
Luego tenemos los ajustes de transparencia Alpha para los gráficos de 32 bits.
Por último tenemos las preferencias de descarga en memoria “Unload” de ese
miembro cuando sea utilizado.
2.3. Transformación de bitmaps (Menú -> Modify -> Transform bitmap).
En esta ventana siempre podemos cambiar en última instancia, las particularidades del
gráfico. Esta opción del menú "Modify" se encuentra desactivada, si no está seleccionado un
gráfico en la ventana Cast. La forma que presenta esta ventana la podemos ver en el gráfico
siguiente:
Figura10.- Ventana de Menú Modify -> Transform bitmap.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 9/37
ANEXO – Manual de Macromedia Director.
3. Incorporar sonidos en la película.
3.1. Introducción.
El sonido apenas tiene particularidades a la hora de importarlo dentro de nuestra película,
pero debemos tener muy en cuenta el tamaño del archivo de sonido que importamos. Por lo
general, en un editor de sonido podemos ajustar la resolución del sonido de igual modo que
hacemos con los gráficos en un editor de imágenes. Los principales parámetros que podemos
configurar en un sonido son:
• Frecuencia de muestreo (Khz).
• Número de bits utilizado para codificar cada muestra (resolución).
• Mono o estéreo.
En Macintosh podemos importar básicamente sonidos AIFF o System 7 Sound, y en la
versión 7 de Director también en Formato Sun .au, que es el formato de sonido utilizado por
las applets Java.
Para ambas plataformas Macintosh y PC el formato de sonido recomendado es AIFF. Así
mantendremos la máxima compatibilidad entre las dos plataformas.
La frecuencia de muestreo recomendada para el sonido (a ajustar en nuestro editor de
sonido preferido), es de 22,050 Khz ó 11,025 Khz. Los sonidos con frecuencia superior a
esta, pueden bloquear una película ya que hay que tener en cuenta que por lo general cuando
ponemos en una película una animación gráfica y un sonido, estamos obligando al procesador
a realizar dos operaciones, una actualizar el gráfico y otra leer y reproducir el archivo de
sonido.
Cuando desarrollamos una producción multimedia, tenemos que tener en cuenta que este
material debe poder reproducirse en sistemas inferiores a aquellos con los que estamos
desarrollando la aplicación, como PC´s con procesadores más lentos, menor capacidad de
memoria, lector de CD/DVD de menor velocidad, etc.
3.2. Importar sonidos (Menú –> File -> Import).
El proceso de importar sonido es exactamente el mismo que a la hora de importar un
gráfico, pero el sonido tiene menos peculiaridades en este proceso que los gráficos.
Figura 11.- Ventana de Cast con un sonido importado.
En la ventana de Cast, vemos ahora, al lado del gráfico, nuestro primer sonido importado.
Los iconos de ambos son diferentes , y esto nos ayuda a identificar los miembros de reparto
en el Cast de forma rápida.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 10/37
ANEXO – Manual de Macromedia Director.
Si hacemos clic sobre el botón
, con el miembro sonido seleccionado en el Cast,
veremos que nos aparece la ventana de propiedades del sonido.
Figura 12.- Propiedades de los miembros de reparto sonidos.
La ventana de propiedades del sonido es más simple que la de los gráficos. Prácticamente
tenemos sólo la opción de "Loop", que hace que nuestro sonido se reproduzca de forma
repetitiva, y la opción "Unload" que de forma similar al caso de los gráficos regula la
prioridad en la descarga de memoria de miembros del reparto que no son utilizados en un
momento dado.
4. Incorporar vídeos en la película.
4.1. Introducción.
El vídeo es el componente multimedia de más peso en una producción, es decir, a
cualquier ordenador le cuesta mucho esfuerzo reproducir video. Con el video digital debemos
tener aún más cuidado que con el sonido, ya que aparte de que un vídeo de unos pocos
segundos a 320 X 240 pixels ocupa varios megas en el disco duro, la reproducción de este en
pantalla es una tarea pesada para cualquier tipo de ordenador.
Si el vídeo además tiene sonido, debemos vigilar que el formato del sonido también sea el
adecuado, si no queremos que nuestro video vaya a saltos y pierda fotogramas intentando
sincronizar la imagen con el sonido.
Sobra decir que es tarea imposible intentar reproducir a la vez dos videos con sonido en
pantalla a un tiempo y esperar un resultado lejanamente aceptable.
Aunque podemos hacer video digital al tamaño que queramos en un programa editor de
video, como Adobe Premiere, hay algunos formatos estándares que nos convendrá usar, como
el estándar QuickTime (320 X 240 pixels). Este formato es el más grande recomendable a la
hora de insertar video en nuestra aplicación multimedia.
4.2. Importar vídeos (Menú –> File -> Import).
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 11/37
ANEXO – Manual de Macromedia Director.
El proceso de importar video es el mismo que el de importar sonido e imágenes, pero
disponemos de muchas opciones de variarlo, modificar y dirigir su reproducción en Lingo, y
ajustar sus propiedades en la ventana Cast.
Abordaremos las capacidades del lenguaje Lingo para controlar el video, más adelante,
cuando estemos aprendiendo Lingo, ahora vamos a ver que propiedades del video podemos
ajustar en el Cast una vez importado.
Figura 13.- Ventana de Cast con un vídeo importado.
Como vemos, el video se ajusta como otro miembro del reparto más, disponible desde
ahora en nuestra pelicula.
del cast, obtendremos la ventana siguiente y podemos
Si pulsamos el botón info
modificar alguna de sus propiedades:
Figura 14.- Propiedades de los miembros de reparto vídeos.
Aqui vemos las propiedades del video a las que podemos acceder en la ventana Cast:
•
Playback: Este es el principal control de la reproducción de vídeo en Director. Sus
diferentes opciones son:
o Video: Indicamos si queremos que se vea el vídeo en el escenario, o bien
sea invisible, pero conservando las propiedades del sonido.
o Sound: Indicamos si nuestro vídeo tendrá sonido o no. Es conveniente
desactivar esta opción si el vídeo que hemos importado no tiene sonido, así
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 12/37
ANEXO – Manual de Macromedia Director.
o
o
QuickTime no intentará ajustar la imagen a un sonido hipotético, y el vídeo
funcionará más fluidamente.
Paused: Con esta opción definimos si el video, por defecto comienza en
pausa. Siempre podemos arrancarlo luego con Lingo.
Loop: Con esta propiedad activada el vídeo se reproducirá de forma
continua, volviendo al principio cada vez que haya terminado, a no ser que
eliminemos esta caracteristica desde Lingo, o volvamos a la ventana Cast
para desactivarla.
•
Options:
o Direct To Stage: Es una propiedad por defecto del video. Normalmente el
video nunca deja que otro elemento se ponga sobre él, bien sea texto, un
gráfico, etc. Si un gráfico pasa por delante del video, el video se pondrá
sobre él de forma que no podremos verlo mientras se encuentre en el
ámbito del video. Si desactivamos esta opción, el vídeo dejará pasar sobre
él a los demás miembros de la película pero, en contrapartida, funcionará a
saltos y de forma poco fluida, por lo que no conviene desactivar esta
opción.
o Show Controler: Nos mostrará la barra de progreso de la película
QuickTime, mientras funciona en el escenario.
•
Video: En este menu tenemos dos opciones:
o Sync to Soundtrack, habilita que QuickTime ajuste el sonido a la imagen,
de forma que una no vaya más rápido que la otra.
o Play Every Frame (No Sound), elimina el sonido del video, caso de
tenerlo, e inhabilita el intento de QuickTIme por sincronizar imagen y
sonido, con lo que el video irá más fluido en pantalla.
Las Opciones Enable Preload y Unload, son para la gestión de la carga y descarga en
memoria del video.
5. Trabajar en el Score.
5.1. Definición de las propiedades de nuestra película.
Ya hemos visto todo el proceso de importar los diferentes componentes multimedia para
nuestra producción. El siguiente paso consiste en colocar los diferentes actores en el Score y
en el escenario. Supongamos que nuestra producción dispone de los tres miembros del Cast
que se muestran en la figura siguiente.
Figura 15.- Miembros del reparto de nuestra producción.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 13/37
ANEXO – Manual de Macromedia Director.
Veamos como colocar nuestros personajes (miembros del reparto) en el escenario de la
pelicula:
•
Para empezar vamos a definir las propiedades principales de nuestra película o
producción seleccionando la opción del menú: Modify -> Movie -> Properties.
Las propiedades principales de esta ventana que se muestra en el gráfico siguiente
se describen a continuación:
Figura 16.- Ventana de propiedades de la película.
o
o
o
o
Stage Size: En este apartado podemos modificar el tamaño del escenario
de la pelicula. El tamaño por defecto es 640 X 480 pixels, que corresponde
a un monitor de 15 pulgadas, pero podemos ajustar el tamaño según se
acomode mejor a nuestras necesidades.
Stage Location: Aqui ajustamos la colocación del escenario con respecto
a la pantalla.
Stage Color: En este menu podemos variar el color de fondo del
escenario.
Default Palette: Esta es la paleta de color de sistema por defecto de la
pelicula.
5.2. Incorporación de los miembros del reparto en el Store.
Una vez que tenemos todos los miembros del reparto de nuestra producción en el Cast,
podemos incorporarlos en la película arrastrando el miembro del reparto desde la ventana del
Cast sobre la ventana Score o sobre el escenario directamente. De esta forma tan simple ya
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 14/37
ANEXO – Manual de Macromedia Director.
habremos colocado el miembro en el escenario, por lo que a partir de ahora cuando nos
refiramos a este personaje, colocado en el Score le llamaremos "Sprite".
Figura 17.- Colocación de un miembro del Cast en el escenario (Stage) y en el Score.
Como vemos en el ejemplo, se ha colocado el sprite en el cuadro 5 y se extiende en el
tiempo tres cuadros hasta el cuadro 7. Los puntos blancos señalan una posición del sprite y
los cuadros blancos del final, señalan el punto final del sprite. Si quisiéramos estirar en el
tiempo (hasta el cuadro 20 por ejemplo) la presencia del Sprite, simplemente debemos coger
el Sprite por su punto final y arrastrarlo hasta el cuadro 20, de forma que, durante la película,
este sprite ahora será visible desde el cuadro 5 hasta el cuadro 20.
Figura 18.- Ampliación de la duración de un sprite.
Colocar sonido es similar a colocar un gráfico pero solamente podemos arrastrarlo sobre
alguno de los dos canales de sonido del Score. Para prolongarlo en el tiempo procederemos
de la misma manera que con los sprites gráficos del ejemplo anterior.
Figura 19.- Incorporar un sonido en el Score.
En Director tenemos dos canales para el sonido, que podemos usar al mismo tiempo.
Ambos canales sonarán juntos si tienen ambos sonido en una misma porción de tiempo.
6. Primeras animaciones en Director.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 15/37
ANEXO – Manual de Macromedia Director.
6.1. Creación de una animación simple.
En este apartado vamos a ver como se crean animaciones elementales en Macromedia
Director. Para ello vamos a importar un gráfico de un ciclista en formato pict como se muestra
en la figura siguiente y lo vamos a poner a correr por el escenario.
Para conseguir esto, podemos arrastrar el ciclista desde la ventana Cast hasta el
escenario o hasta la ventana Score. De forma que pasara a ocupar uno o varios cuadros por
defecto en el score, apareciendo tambien en el escenario.
Esta animación queremos que comienze en el cuadro 5 y vamos a extender la animación
hasta el cuadro 15.
Para esto cogemos el sprite por su punto final en el Score y lo encogemos para que solo
ocupe de principio un cuadro, que será el punto de partida de la animación.
Figura 20.- Una pequeña animación.
Para dar una sensación de continuidad entre la imagen y el fondo del escenario, vamos a
definir un color para el fondo de la película (Modify -> Movie -> Properties) y vamos a
asignar fondo transparente al sprite del ciclista (Background Transparent), para que sus
partes blancas pasen a ser transparentes.
Ahora que tenemos un único cuadro de partida de la animación seleccionado en el score,
colocamos en el escenario el ciclista en el punto de partida de la animación, en este caso
entrando por la parte izquierda del escenario.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 16/37
ANEXO – Manual de Macromedia Director.
Figura 21.- Colocación del sprite en el punto de partida de la animación.
Una vez colocado el cuadro 5 en su punto de partida vamos a asignar un punto
intermedio en la animación en el cuadro 10, en donde el ciclista ya se encontrará en el centro
del escenario, a medio camino de su animación completa.
Para esto, pulsando la tecla "ALT" y arrastramos el sprite hasta el cuadro 10. Vemos
como no movemos el cuadro 5 hasta la posicion 10 sino que nos llevamos una copia del sprite
hasta esta posición. Si no hubiéramos pulsado la tecla "ALT" simplemente habríamos movido
el cuadro 5 hasta la posición 10.
Con esto estamos asignando un nuevo tiempo en la pelicula, en el que nuestro actor
estará en otra posición.
Figura 22.- Alargamos la duración del sprite al instante 10.
Con el sprite seleccionado en el cuadro 10, vamos de nuevo al escenario y colocamos el
ciclista en otra posición del escenario. En la figura siguiente se muestra la posición que
ocupará el ciclista en el escenario en el instante 10.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 17/37
ANEXO – Manual de Macromedia Director.
Figura 23.- Ubicación del ciclista en el escenario en el instante 10.
Como vemos Director ha creado una línea de animación, desde el punto inicial, hasta la
nueva posición en el cuadro 10, generando todos los pasos intermedios. Ahora vamos a hacer
la misma operación pero estirando el sprite hasta la posición 15, en donde el ciclista ya
desaparecerá del escenario por la parte derecha.
Para esto hacemos lo mismo que en el caso anterior: estiramos una copia del sprite con la
tecla "ALT” pulsada hasta la posición 15, y en esa posición colocamos el sprite en el
escenario, desapareciendo ya por la parte derecha de la pantalla.
Figura 24.- Alargar la duración del sprite y cambio de posición.
Con esto tenemos una primera animación básica. Si vamos al menú "Control > Play"
veremos como el ciclista recorre el escenario de izquierda a derecha. Si queremos ajustar la
trayectoria de movimiento, podemos recurrir al menú "Modify > Sprite > Tweening", para
definir la trayectoria del sprite como mejor nos convenga.
6.2. Asignar el tiempo de reproducción a la película.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 18/37
ANEXO – Manual de Macromedia Director.
En primer lugar, la ventana "Control Panel" no la debemos usar para asignar tiempo a
la película, porque lo hará de forma virtual, no real. La película solo responde y conserva los
controles de velocidad asignados en el score o con Lingo.
Para ajustar la velocidad de reproducción, seleccionamos un cuadro en el canal de tiempo
del score, en el principio de la animación del ciclista (cuadro 5).
Figura 25.- Selección de un cuadro del canal del tiempo en el score.
Con este cuadro seleccionado vamos al menú "Modify > Frame > Tempo", en donde
nos sale esta siguiente ventana en donde podemos asignar el tiempo, en el ejemplo 5 fps
(frames per second). Debemos cuidar que la velocidad de la película no sea excesiva, para
que no sobrepase la capacidad de un procesador poco potente, más aún cuando está
corriendo sobre un CD.
Figura 26.- Ventana de Frame -> Tempo.
Para prolongar el área de tiempo especificado en la película, simplemente seleccionamos
el canal de tiempo, y con la tecla "ALT" pulsada, arrastramos el sprite, estirándolo, por
ejemplo, hasta el cuadro 15, en donde termina la animación de ciclista. Así podemos
asignar diferentes velocidades a diferentes partes de la película.
Conviene probar uno mismo a hacer animaciones, metiendo gráficos de fondo y
superponiendo personajes. Conviene recordar que conforme ponéis sprites en el escenario, el
sprite del cuadro 2 estará por delante del sprite del cuadro 1 y así sucesivamente.
6.3. Filmloops.
Hasta ahora hemos visto como crear animaciones sencillas a partir de una imagen
estática. Si queremos reproducir una animación más compleja, como una persona o un perro
caminando, necesitamos combinar varias imágenes estáticas para conseguir sensación de
movimiento. Por ejemplo, en el caso de de un muñeco, debe ir moviendo los brazos y las
piernas mientras avanza hacia delante, con lo cual en cada paso tenemos cuatro movimientos
para los brazos y piernas, a la vez tendremos que hacer avanzar el muñeco hacia delante con
todos sus movimientos de andar. Para conseguir estas animaciones podemos usar los
FilmLoops.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 19/37
ANEXO – Manual de Macromedia Director.
Los Filmloops son animaciones creadas mediante la composición de imágenes individuales
que, utilizadas de forma conjunta, nos dan sensación de movimiento. Para ello hacemos lo
siguiente:
1. Incorporamos como miembros del reparto individuales las diferentes imágenes
que van a formar parte del Filmloop. En los ejemplos siguientes vemos el caso de
una animación que refleja el movimiento de un gato.
Figura 27.- Incorporación de las imágenes individuales en el Cast.
2. Colocamos todos los elementos del Cast (imágenes individuales) en el Score uno
a continuación de otro con una duración de 1 frame.
Figura 28.- Colocación de las imágenes individuales en el Score.
3. Seleccionamos todos los sprites consecutivos que hemos insertado en el Score
(pulsando la tecla MAYUS) y seleccionamos la opción del menú: Insert -> Film
Loop. Nos aparecerá un prompt en el que nos preguntará el nombre que
queremos darle al FilmLoop y lo incorporará como un nuevo miembro del Cast. A
partir de este momento, este nuevo elemento del Cast es una pequeña animación
formada por la composición de las imágenes individuales anteriores.
Figura 29.- FilmLoop en el Cast.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 20/37
ANEXO – Manual de Macromedia Director.
7. Sprites.
Una vez que colocamos los actores del Cast (reparto) sobre un canal del Stage
(escenario), se convierten en sprites (actores con guión). Los sprites tienen una serie de
propiedades que podemos consultar y modificar en la película en tiempo real.
Los sprites también presentan dos eventos: comienzo y final del sprite, que los
capturamos mediante on beginSprite y on endSprite respectivamente. Dentro de estos
eventos podemos programas las acciones que se llevarán a cabo al comienzo y final del sprite.
La forma de referirnos a las propiedades de un sprite es:
Sprite(numero).NombrePropiedad, donde
•
•
Numero: número del canal que ocupa el sprite.
NombrePropiedad: propiedad del sprite.
Las propiedades más significativas de los sorites son las siguientes:
•
•
•
•
•
loch: Nos proporciona la coordenada horizontal del sprite en el stage.
locv: Nos proporciona la coordenada vertical del sprite en el stage.
height: Nos proporciona la anchura del sprite del stage.
width: Nos proporciona la altura del sprite en el stage.
memberNum: Indica el índice u orden que ocupa en el Cast el actor que
representa este sprite.
Podemos modificar el miembro del reparto Cast que forma parte de un determinado sprite
en un momento determinado. Para ello utilizamos la propiedad memberNum con el valor del
índice del Cast que ocupa el actor que queremos incorporar en el sprite.
Tenemos varias formas de cambiar el valor asignado a una propiedad de un sprite. Por
ejemplo, si queremos cambiar el valor de la propiedad loch del sprite 2 lo podemos hacer de
las dos formas siguientes:
• sprite(2).loch = 10.
• Set the loch of sprite 2 to 10.
Cada vez que realizamos una modificación sobre propiedades de los actores en el stage,
tenemos que actualizar el contenido del mismo por medio del comando updatestage. En
caso contrario, los sprites contendrían los nuevos valores pero no se verían reflejados en el
escenario.
8. Interacciones
La verdadera potencia de MacroMedia Director consiste en la posibilidad de interactuar
nosotros mismos con la película; esto es, que llegados a un momento dado nos presente una
serie de opciones que nosotros podamos elegir para "ver" el trozo de película que nos interesa
(en una película convencional, esto no es posible: nos sentamos en la butaca del cine y vemos
toda la película de un tirón, sin posibilidad de ver primero el final, luego el beso de mitad de
película, luego nuevamente el final y después los títulos del principio).
Para realizar esto con Director necesitamos "parar" la película en determinados momentos.
Esto se realiza de muy diversas maneras:
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 21/37
ANEXO – Manual de Macromedia Director.
•
•
La forma más sencilla es a través de la opción "Wait for a Mouse Click or Key"("Espera
hasta que se haga click con el ratón o se pulse una tecla") que se encuentra en la
opción "Set Tempo" (en la ventana del Score, arriba del todo, en el icono del reloj). Esta
instrucción paraliza la aplicación hasta que el usuario final pulsa el botón del ratón o
cualquier tecla del teclado. Pero aquí acaba la posibilidad de interactuar con esta opción.
Suele utilizarse para menús o pantallas de ayuda o de presentación que requieren la
conformidad del usuario para avanzar (son las típicas, p.e., en que aparece el mensaje
"Clic para continuar").
-La otra forma de paralizar el desarrollo secuencial de la película es mediante scripts
(pequeños programas en Lingo) en los frames: Haciendo doble click en la celda del
frame que nos interesa, nos aparece una ventana en la que vamos a escribir el script
correspondiente para que la acción se pare en ese frame. Existen varios para hacer eso.
Los más usados son, básicamente:
on exitFrame
pause
end
y
on exitFrame
go to the frame
end
Una vez escrito uno u otro, pusamos la tecla Enter (la del teclado numérico) para que Director
compruebe si hemos metido la pata a la hora de escribirlo o no, y se cierre la ventana,
añadiendo el script al cast. En el primer caso, la acción simplemente se detiene ("pause", como
en el aparato de vídeo). En el segundo caso, la acción no se detiene: abandona ese frame y
vuelve a él (digamos que ejecuta un Loop en ese frame). Ahora que ya tenemos detenida la
acción en el frame que nos interesa, vamos a poner cosas en esa pantalla que añadan
interactividad a nuestra aplicación. La forma más elemental de hacerlo es poniendo botones
que luego "programaremos" para que hagan una cosa u otra.Sin embargo, MacroMedia Director
permite la programación orientada a objetos al 100%; esto es, cualquier elemento de la
pantalla es susceptible de ser programado (esto no sucede con otras aplicaciones de pseudoprogramación orientada a objetos, como HyperCard, en la que las imágenes no se pueden
programar). Como podemos programar cualquier cosa que pongamos en esa pantalla (en ese
frame), lo más normal es poner imágenes (copiando/pegando o importándolas en la ventana
del Cast) y programar estas imágenes para que actúen como si fuesen botones.
En una aplicación genérica como la que estamos describiendo, lo que nos va a interesar
principalmente es que al hacer click en ese botón/imagen "saltemos" a una secuencia
determinada de la movie, que no tiene por qué ser el frame inmediatamente siguiente. Esto se
puede hacer básicamente de dos formas:
-Programando el botón para que mande la aplicación a un frame determinado, por ejemplo al
13. Esto se haría poniendo el siguiente script en el botón (para que aparezca la ventana de
script para el botón, lo seleccionamos en la ventana del Cast y pulsamos en el icono de "script"
que hay en ella.
script:
on mouseUp
go to frame 13
end
En castellano, esto querría decir: "Cuando levantes el dedo del ratón -después de pulsar, se
entiende-, ves al frame 13". También podemos hacer que se salte 3 frames, por ejemplo, y que
luego continúe normalmente la movie. En este caso, el script sería:
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 22/37
ANEXO – Manual de Macromedia Director.
on mouseUp
go to (the frame + 3)
end
Esta solución no siempre es buena; si por cualquier razón se han borrado o añadido frames
antes del 13 (en el primer caso) o entre el frame en el que estamos y los tres siguientes (en el
segundo caso), la secuencia que teníamos prevista ya no empieza en ese frame y se nos
desbarata la aplicación. Para evitar estos problemas, tenemos la otra solución:
-Usando "Markers" ("marcadores"). Un "Marker" es, igual que en un aparato de vídeo
convencional, una señal que ponemos nosotros para indicar que en ese frame pasa algo
"especial" (por lo general, va a indicar el comienzo de una secuencia). Para crear un "marker"
basta con pulsar en el pequeño triángulo negro colocado entre el menú de scripts y los canales,
y arrastrarlo hasta el frame deseado. Una vez hecho esto, aparece un cursor parpadeante a su
derecha. En este lugar, escribimos el nombre que se le quiera dar. Como se puede escribir
cualquier nombre, lo más lógico será poner uno que resulte de fácil y rápida identificación. Otra
forma de realizar esto es posicionarnos en el frame que queremos que tenga un marker y
seleccionar el ítem "Markers" del menú "Window". Entonces escribimos el nombre que le vamos
a dar y pulsamos "Enter" (teclado numérico). Esta otra opción nos permite, además, añadir
algún comentario al marker (escribimos el nombre, pulsamos Return - teclado de letras- y
escribimos el comentario.
A efectos prácticos, ambas soluciones son idénticas. A partir de este momento, cada vez que
nos refiramos a este frame le llamaremos "curriculum". De este modo, si se quiere enviar la
aplicación a este frame el script del botón correspondiente sería:
on mouseUp
go to frame "curriculum"
end
Con esto, ya hemos visto las opciones que nos van a permitir parar la secuencia de una movie,
hacer botones y cómo programarlos para que "salten" por la aplicación. A continuación veremos
algunos scripts muy usados en la programación de interactivos. Para terminar, decir que es
buena idea que la paleta de control ("Control Panel", en el menú "Window") esté con el botón
de Loop no pulsado (esto es, que, en principio, la movie no vuelva al principio después de llegar
al final).
9. Introducción a Lingo.
A continuación vamos a ver los fundamentos de programación del lenguaje proporcionado
por Macromedia Director llamado Lingo.
9.1. Variables.
Una variable es una forma de guardar datos. Es un almacén de datos que se nos
permite recuperar y actualizar su contenido. Las variables se componen de dos partes:
nombre y valor.
Para trabajar con variables vamos a utilizar la ventana Message (CTRL + M). Por medio
del comando put podemos mostrar información del valor de una variable en un momento
determinado en esta ventana. Por medio del comando set podemos asignar valores a las
variables. Por ejemplo, podemos definir la variable miNumero a la que damos el valor 10.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 23/37
ANEXO – Manual de Macromedia Director.
Posteriormente escribimos su contenido en pantalla por medio del comando put. En el gráfico
siguiente podemos ver esta secuencia de acciones.
Figura 30.- Asignación y visualización de valores de las variables.
Las principales características que deben tener los nombres de las variables son:
•
•
•
El nombre de una variable puede tener hasta 256 caracteres de longitud (aunque
nunca es recomendable tener un nombre tan largo).
Han de empezar con una letra (a-z) o con guión bajo y pueden tener mayúsculas
o minúsculas. A continuación se pueden escribir números
Los nombres de las variables únicamente tienen una palabra, es decir, no se
pueden utilizar espacios en blanco.
Conviene asignar a las variables nombres que tengan algún significado, como: Nombre,
Edad, Fecha_Nacimiento, etc.
Lingo no diferencia entre mayúsculas y minúsculas, por lo que las variables Nombre,
nombre y NOMBRE son la misma.
Los tipos de datos de las variables pueden ser: Integer (entero), Float (decimal con
coma flotante), String (cadena), Lista. En la figura siguiente podemos ver la forma que
presentan las listas y como podemos referenciar sus datos de manera individual.
Figura 31.- Variables de tipo lista.
9.1.1.
Ámbito de las variables (locales y globales).
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 24/37
ANEXO – Manual de Macromedia Director.
Entendemos por variables locales aquellas que son accesibles únicamente en la función o
procedimiento donde se han definido. Estas variables no pueden perdurar o no son accesibles
fuera de ese procedimiento o función.
Por ejemplo, si declaramos una variable dentro de un Handler mouseDown como se
muestra en el ejemplo siguiente:
on mouseDown
set pulsacion = pulsacion + 1
end
Esta variable no perdurará fuera de este handler. Podemos realizar operaciones con ella
en el ámbito del handler mouseDown pero no podemos usarla en otra parte del programa.
Si utilizáramos la variable pulsacion en otra parte del programa no conservaría los
valores asignados a la misma en el handler donde se ha inicializado.
Para tener variables perdurables en memoria durante todo el programa, usamos las
variables globales.
global pulsacion
set pulsacion = 0
Esta variable la hemos declarado como global, por lo tanto permanecerá en memoria
hasta la finalización del programa. Si por ejemplo queremos llevar la cuenta de los clicks que
hace el usuario con el ratón, podemos crear un Handler donde inicializar la variable global,
como por ejemplo al comenzar la ejecución:
on startMovie
global numClics
set numClics = 0
end
Y establecer la cuenta de esta variable en otro handler mouseDown:
on mouseDown
global numClics
set numClics = numClics + 1
end
Así podemos incluir en el handler una sentencia de comprobación para saber si el usuario
ha pulsado el botón del ratón diez veces:
on mouseDown
global numClics
set numClics = numClics + 1
if ( numClics = 10 ) then
alert "has pulsado el ratón 10 veces"
end if
end
O llamar a esta variable desde otra parte del programa u otro Handler.
on exitFrame
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 25/37
ANEXO – Manual de Macromedia Director.
global numClics
if ( numClics = 10 ) then
alert "has pulsado el ratón 10 veces"
end if
end
Para destruir de la memoria las variables globales, por ejemplo al cerrar el programa,
para liberar la memoria del ordenador, utilizamos la sentencia clearGlobals.
9.2. Operadores.
Un operador es un símbolo o una palabra que actúa sobre uno o más elementos. Los
operadores son parte de Lingo y se utilizan para efectuar cálculos, asignaciones y
comparaciones. Los diferentes tipos de operadores que nos podemos encontrar en Lingo son:
•
Operador de asignación: El signo igual (=) hace las funciones de operador de
asignación. Cuando queremos asignar un valor a una variable, podemos hacerlo
de varias formas diferentes:
o
o
o
o
o
o
•
set miNumero to 10.
set miNumero = 10.
put 10 into miNumero.
miNumero = 10.
miNumero = 2 + 2. Cuando hay operaciones a la derecha del operador de
asignación, se resolverán antes de asignar ningún valor a la variable.
Si asignamos valores de tipo cadena en lugar de numéricos, tenemos que
encerrar estos valores entre comillas, como por ejemplo: nombre= “Jesús
Valverde”.
Operadores aritméticos: Se utilizan para realizar cálculos sencillos con los
datos. Los operadores aritméticos son: suma (+), resta (-), multiplicación
(*), división (/) y resto o módulo (mod). Las operaciones aritméticas tienen
un orden de preferencia similar al álgebra. Podemos modificar la preferencia
mediante paréntesis. En la figura siguiente podemos ver varios ejemplos de estas
operaciones:
Figura 32.- Operadores aritméticos.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 26/37
ANEXO – Manual de Macromedia Director.
•
Operadores de comparación: Son operadores que pueden dar dos valores:
verdadero (true o 1) y falso (false o 0). En la tabla siguiente podemos ver los
diferentes operaciones de comparación que podemos usar con Lingo. En el gráfico
siguiente podemos ver varios ejemplos de estas operaciones:
Operador
Nombre
=
>
<
>=
<=
<>
Igual
Mayor que
Menor que
Mayor o igual que
Menor o igual que
Distinto de
Figura 33.- Operadores de comparación.
•
Operadores lógicos: Los operadores lógicos son aquellos cuyos operandos y
resultados son valores booléanos (true-verdadero y false-falso).
Operador
AND
Nombre
•
•
OR
•
•
NOT
•
Devuelve un valor true-verdadero si
ambos operandos son ciertos.
Devuelve un valor false-falso si alguno
de los operandos es falso.
Devuelve un valor true-verdadero si
cualquiera de los operandos es
verdadero.
Devuelve un valor false-falso si ambos
operandos son falsos.
Nos devuelve el valor contrario (true o
false) al proporcionado.
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 27/37
ANEXO – Manual de Macromedia Director.
Figura 34.- Operadores lógicos.
9.3. Estructuras de control.
El control de las estructuras nos permite modificar el flujo de un programa. Hasta ahora,
el flujo de un programa empezaba en la parte superior del mismo y avanzaba linealmente
hasta la inferior. Por medio de estructuras de control podemos modificar este flujo de
ejecución.
9.3.1.
Estructuras if.
Por medio de estas estructuras podemos modificar el flujo de ejecución basándonos en
una serie de condiciones. Las diferentes formas que puede presentar son las siguientes:
If condicion then
sentencias
end if
If condicion then
sentencias
else
sentencias
end if
If condicion then
sentencias
else if condicion then
sentencias
end if
9.3.2.
Declaraciones case.
Al igual que las sentencias if .. else, nos permite tomar decisiones lógicas mientras
ejecutamos una serie de condiciones. La sintaxis de este tipo de declaración es la que se
muestra a continuación:
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 28/37
ANEXO – Manual de Macromedia Director.
case (expression) of
valor_expresion1:
sentencias1
valor_expresion2:
sentencias2
............
valor_expresionn:
sentenciasn
end case
case (expression) of
valor_expresion1:
sentencias1
valor_expresion2:
sentencias2
............
valor_expresionn:
sentenciasn
otherwise
sentencias
end case
Vamos a ver un ejemplo: Supongamos que queremos mover la imagen que aparece en la
figura siguiente mediante la pulsación de las teclas siguientes: J (izquierda), K (derecha),
U (arriba) y N (abajo).
Figura 35.- Imagen estática del balón.
Para ello utilizamos el evento KeyDown que se dispara cada vez que pulsamos una tecla.
La solución utilizando estructuras if podría ser la siguiente:
if the key = "J" then
set h = the locH of sprite 1
set the locH of sprite 1 to H -10
updatestage
else if the key = "K" then
set h = the locH of sprite 1
set the locH of sprite 1 to H +10
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 29/37
ANEXO – Manual de Macromedia Director.
updatestage
else if the key = "U" then
set V = the locV of sprite 1
set the locV of sprite 1 to V -10
updatestage
else if the key = "N" then
set V = the locV of sprite 1
set the locV of sprite 1 to V +10
updatestage
end if
La solución utilizando estructuras case podría ser la siguiente:
case the key of
"J":
set h = the locH of sprite 1
set the locH of sprite 1 to H -10
updatestage
"K":
set h = the locH of sprite 1
set the locH of sprite 1 to H +10
updatestage
"U":
set V = the locV of sprite 1
set the locV of sprite 1 to V -10
updatestage
"N":
set V = the locV of sprite 1
set the locV of sprite 1 to V +10
updatestage
otherwise:
put “No has pulsado una tecla correcta) into mensaje
updatestage
end case
9.3.3.
Iteraciones.
Los bucles o iteraciones se usan en programación para conseguir que un programa repita
una serie de pasos o acciones hasta alcanzar un objetivo. Básicamente un bucle es una tarea
organizada, un fragmento de código que se encarga de gestionar una tarea repetitiva.
Por ejemplo, si necesitamos declarar como "puppet" todos los sprites del score desde el 1
hasta el 45, un mal programador escribiría:
set the puppet
set the puppet
set the puppet
...........
set the puppet
of sprite 1 to true
of sprite 2 to true
of sprite 3 to true
of sprite 45 to true
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 30/37
ANEXO – Manual de Macromedia Director.
Y así hasta que se le durmieran los dedos. Para evitar esto debemos usar bucles. Así por
ejemplo para el caso anterior, el problema estaría resuelto con el bucle siguiente:
repeat with x = 1 to 45
set the puppet of sprite x to true
end repeat
A continuación se describen los dos tipos de bucles que nos podemos encontrar en Lingo.
•
El bucle "repeat while": Este es un bucle que ejecuta su código mientras se cumpla
una expresión de control. Esta expresión puede ser cualquier variable o expresión que
se pueda evaluar como verdadera (TRUE) o falsa (FALSE). El formato de este bucle es el
siguiente:
repeat while condición
sentencias
end repeat
Por ejemplo:
repeat while the mouseH > 40
-- acciones-end repeat
repeat while not terminado
-- acciones --end repeat
En el bucle que se muestra a continuación se detiene la película durante cinco segundos.
startTimer
repeat while the timer < 5 * 60
put "Esperando cinco segundos"
end repeat
Hay que tener cuidado con los bucles repeat while, ya que mientras están funcionando,
absorverán toda la atención del programa por lo que, las pulsaciones del ratón, las
animaciones y el resto de acciones de la película se detendrán.
•
El bucle "repeat with": Este es un "bucle contador". Realiza una serie de acciones
hasta que un contador alcanza un número predefinido por el programador. El formato
de este bucle es el siguiente:
repeat with variable=inicio to final
sentencias
end repeat
Por ejemplo:
repeat with x = 1 to the number of words in field "textos"
if word x of field "textos" = "lingo" then alert "Has escrito Lingo"
end repeat
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 31/37
ANEXO – Manual de Macromedia Director.
Este bucle repite la acción de búsqueda desde 1 hasta el numero de palabras que hay
en el campo "textos".
El bucle siguiente simplemente realiza una cuenta de 1 a 260, contando de uno e uno, y
la imprime en un campo de texto.
repeat with cuenta = 1 to 260
set cuenta = cuenta + 1
put cuenta into field "msg"
end repeat
Este otro, realiza la misma cuenta de 1 a 260, pero contado de dos en dos, ya que el
valor de la variable "cuenta" es aumentada en 2 en cada iteración del bucle.
repeat with cuenta = 1 to 260
set cuenta = cuenta + 2
put cuenta into field "msg"
end repeat
Es fácil imaginarse cientos de utilidades para los bucles, desde una simple cuenta, hasta
la programación de la trayectoria de una pelota de fútbol o un proyectil en un juego. Siempre
que queramos realizar acciones repetitivas en un programa debemos recurrir a los bucles, ya
que estos forman parte de cualquier estructura de código en cualquier lenguaje de
programación.
9.4. Eventos y manejadores de eventos (handlers).
Entendemos por eventos aquellas acciones que pueden ocurrir en nuestra película y que
podemos capturar y manipular por medio de un manejador de eventos o handler. Algunos
ejemplos de eventos son: pulsación de una tecla del teclado, pulsar sobre alguno de los
botones del ratón, comenzar la película, etc.
Cada vez que ocurre alguno de estos eventos, son capturados por medio de un handler o
manejador que nos permite programar el conjunto de acciones que queremos que se
ejecuten. Algunos ejemplos de manejadores de eventos son: on KeyDown, on KeyUp, on
MouseDown, on MouseUp, on exitframe, etc.
A continuación vamos a describir alguno de los eventos más significativos que podemos
manejar en Lingo.
9.4.1.
Comandos generales
Play y Play done:
En la mayoría de las ocasiones, la aplicación interactiva va a consistir en un menú principal con
diversas opciones que nos van a llevar a una secuencia u otra de la movie, y por lo general
desearemos que una vez vista esa secuencia (o en cualquier parte de ella) podamos volver al
menú principal. Por ejemplo: Supongamos que en nuestra aplicación tenemos una secuencia
que consiste en una pantalla de información acerca del autor de la aplicación. Lógicamente,
desearemos que mientras se está desarrollando la aplicación, si el usuario pulsa en el botón de
"información", nos muestre la pantalla de Información. Asimismo, cuando el usuario ya haya
leído la pantalla, querrá volver a donde estaba. En estas situaciones se usa el comando "play"
en vez del comando "go".
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 32/37
ANEXO – Manual de Macromedia Director.
Así, el script del botón de información será:
on mouseUp
play "información"
end
"información" será el nombre del marker que tengamos en el frame de información. En el botón
de "volver" que tendremos en la pantalla de información pondremos este script:
on mouseUp
play done
end
El comando "play" es similar al comando "go", pero con la particularidad de que cuando la
secuencia a la que saltamos se termina de ejecutar, automáticamente volvemos al frame donde
estábamos antes de ejecutar el "salto". La secuencia se termina de ejecutar cuando se ejecute
el comando "play done" ("play" hecho), en este caso al hacer un "mouseUp" sobre el botón
"volver". Uno de los usos más importantes de los comandos "play" y "play done" es en la
elaboración de interactivos que, por su extensión, conviene hacerlos en varios documentos
distintos de Director. Me explico: Supongamos que tenemos que hacer un interactivo en el que
hay una pantalla de menú con 10 opciones para 10 apartados distintos. Si metiéramos todos los
apartados dentro del mismo ejecutable, posiblemente crearíamos una aplicación muy, muy
grande en tamaño, lo cual no es muy práctico a efectos de rapidez de ejecución. Lo que se
suele hacer en estos casos es crear un documento en Director que contenga únicamente el
menú principal, con sus diez opciones, y otros diez documentos, uno por cada apartado (p.e.
APDO1, APDO2, etc.). Los script de los botones del menú principal serán del tipo:
on mouseUp
play "inicio" of movie "APDO1"
end
Al pulsar en el botón del apartado 1, carga el documento "APDO1" y comienza a ejecutar la
movie a partir del marker "inicio". Para volver al menú principal, en cada uno de los
documentos de los apartados habrá un botón con el script
on mouseUp
play done
end
que descargará el documento en cuestión y volverá al programa principal.
9.4.2.
•
Eventos de teclado.
on keyDown:
o Sintaxis:
ƒ
o
On KeyDown
Sentencias
End
Descripción:
Es el manejador usado por Director cuando se pulsa una tecla.
Si queremos aplicar este handler a un sprite que sea un campo editable,
debemos poner el handler en un script de sprite.
Si queremos aplicar este handler a un miembro del reparto que sea un campo
editable, debemos poner el handler en un script del miembro del cast.
Si queremos aplicar este handler a un todo un frame, debemos poner el handler
en un frame script.
Si queremos aplicar este handler a toda la película, debemos poner el handler en
un movie script.
o
Ejemplo:
on keyDown
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 33/37
ANEXO – Manual de Macromedia Director.
if the key = RETURN then go to frame 5
end keyDown
Comprueba si la tecla que se ha pulsado es la tecla de retorno y en caso de ser
así, salta al frame 5.
•
on keyUp:
o Sintaxis:
ƒ
o
On KeyUp
Sentencias
End
Descripción:
Es el manejador usado por Director cuando soltamos una tecla pulsada.
Si queremos aplicar este handler a un sprite que sea un campo editable,
debemos poner el handler en un script de sprite.
Si queremos aplicar este handler a un miembro del reparto que sea un campo
editable, debemos poner el handler en un script del miembro del cast.
Si queremos aplicar este handler a un todo un frame, debemos poner el handler
en un frame script.
Si queremos aplicar este handler a toda la película, debemos poner el handler en
un movie script.
o
Ejemplo:
on keyUp
if the key = RETURN then go to frame 5
end keyUp
Comprueba si la tecla que se ha soltado es la tecla de retorno y en caso de ser
así, salta al frame 5.
9.4.3.
•
Eventos de ratón.
on MouseDown:
o Sintaxis:
ƒ
o
On MouseDown
Sentencias
End
Descripción:
Es el manejador usado por Director cuando pulsamos un botón del ratón.
•
on MouseEnter:
o Sintaxis:
ƒ
o
On MouseEnter
Sentencias
End
Descripción:
Es el manejador usado por Director cuando el puntero del ratón entra en el área
activa de un sprite, aun cuando no pulsemos ningún botón del mismo.
•
on MouseLeave:
o Sintaxis:
ƒ
On MouseLeave
Sentencias
End
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 34/37
ANEXO – Manual de Macromedia Director.
o
Descripción:
Es el manejador usado por Director cuando el puntero del ratón sale del área
activa de un sprite.
•
on MouseWithin:
o Sintaxis:
ƒ
o
On MouseWithin
Sentencias
End
Descripción:
Es el manejador usado por Director cuando el puntero del ratón se encuentra
dentro del área activa de un sprite.
•
on rightMouseDown:
o Sintaxis:
ƒ
o
On rightMouseDown
Sentencias
End
Descripción:
Es el manejador usado por Director cuando pulsamos sobre el botón derecho del
ratón.
•
on rightMouseUp:
o Sintaxis:
ƒ
o
On rightMouseUp
Sentencias
End
Descripción:
Es el manejador usado por Director cuando soltamos el botón derecho del ratón
que hemos pulsado previamente.
9.4.4.
ALGUNAS SITUACIONES PARTICULARES
Sustitución de un elemento por otro dentro del mismo sprite:
Un efecto muy usado es el de hacer que los botones parezcan que se hunden al hacer click
sobre ellos. Esto se consigue teniendo dos imágenes, una con el botón "sin pulsar" y otra con el
botón "pulsado". Supongamos que, en el cast, estos elementos están situados en estos lugares:
número de cast: 11 Nombre: botón no pulsado
número de cast: 12 Nombre: botón pulsado
En el sprite del frame correspondiente colocamos la imagen del botón no pulsado (p.e., en el
sprite 15). Para crear el efecto deseado, el script de este botón será:
on mouseDown
set the castNum of sprite 15 = the number of cast "botón pulsado"
updateStage
repeat while the mouseDown
end repeat
set the castNum of sprite 15 = the number of cast "botón no pulsado"
updateStage
if the mouseCast = the number of cast "botón no pulsado" then go "fin"
end
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 35/37
ANEXO – Manual de Macromedia Director.
En este caso, "fin" es el nombre del marker a donde saltamos. Una forma más abreviada de
escribir esto es la siguiente:
on mouseDown
set the castNum of sprite 15 = 12
updateStage
repeat while the mouseDown
end repeat
set the castNum of sprite 15 = 11
updateStage
if the mouseCast =12 then go "fin"
end
Veamos detenidamente qué pasa en este botón: comenzamos con un "mouseDown" (esto es,
pulsamos el botón del ratón). En ese momento, en el sprite 15 se sustituye la imagen que había
por otra nueva; estaba la imagen del botón no pulsado (castNum = número de cast = 11 = the
number of cast "botón no pulsado") y la sustituimos por la del botón pulsado (castNum =
número de cast = 12 = the number of cast "botón pulsado") mediante el comando "set"=Haz
que. A continuación actualizamos el stage=refrescamos la pantalla=updateStage. Lo que viene
a continuación es un bucle (repeat...end repeat) que hace que el programa se detenga ahí el
tiempo que el usuario mantenga pulsado el ratón ("while the mouseDown"). Una vez que el
usuario ha levantado el dedo del ratón, pasamos a las sentencias siguientes, que lo que hacen
es volver a poner la imagen del botón sin pulsar.
Por último, la sentencia if the mouseCast =12 then go "fin" lo que hace es mirar a ver qué
elemento se encuentra debajo del cursor/ratón (the mouseCast). Si es el 12="botón no
pulsado", entonces salta a la secuencia "fin"; caso contrario, no pasa nada. Esto sirve para,
p.e., cuando hemos hecho click en un botón equivocado y, para paliar la situación, salimos con
el cursor fuera de él y soltamos el ratón. Sin esta sentencia, es script podría ser:
on mouseDown
set the castNum of sprite 15 = 12
updateStage
repeat while the mouseDown
end repeat
set the castNum of sprite 15 = 11
updateStage
go "fin"
end
y, cuando levantáramos el dedo del ratón, estuviésemos donde estuviésemos,
saltaríamos a la secuencia "fin".
* rollOver:
Esta función indica si el cursor está sobre un sprite determinado o no. Es de la forma
rollOver(sprite). Esta función se usa a menudo para crear scripts que realizan una acción
cuando el usuario sitúa el cursor sobre un sprite específico. Para verlo más claramente, vamos a
coger el ejemplo visto anteriormente de sustitución de una imagen por otra cuando
mantenemos el ratón pulsado sobre un botón, y lo vamos a hacer ahora con la función rollOver.
Para ello, consideramos, como antes, que en el cast, estos elementos están situados en estos
lugares:
número de cast: 11 Nombre: botón no pulsado
número de cast: 12 Nombre: botón pulsado
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 36/37
ANEXO – Manual de Macromedia Director.
y que en el sprite 15 del frame correspondiente colocamos la imagen del botón no pulsado.
Para simular una pulsación de botón cuando pasemos el cursor por encima de él, el script de la
movie (que no el del botón) deberá ser:
on exitFrame
if rollOver(15) then
set the castNum of sprite 15 = 12
else
set the castNum of sprite 15 = 11
end if
go to the frame
end
Este script hace lo siguiente: cuando va a abandonar el frame, comprueba si el cursor está
sobre el sprite 15 y, si efectivamente es así, pone la imagen del botón pulsado (número de cast
12); si no es así ("else"), entonces la imagen es la correspondiente al botón no pulsado
(número de cast 11). Posteriormente, vuelve al mismo frame (para "detener ahí la movie").
Esto únicamente sustituye, como hemos dicho, una imagen por otra. Si además queremos que
cuando estemos sobre el botón (y, por lo tanto, la imagen corresponda a la del botón pulsado)
se ejecute una detrminada acción al hacer click sobre él, deberemos programar ese botón. En
este caso, pondremos en el script del botón pulsado:
on mouseUp
go "curriculum"
end
De esta forma, al pasar sobre el botón sin pulsar nos cambiará a botón pulsado y, si además
hacemos click sobre él, iremos al marker "curriculum".
* Ir varios frames adelante/atrás:
Como comentamos al principio, una de las formas de saltar a un frame específico era mediante
el script:
on mouseUp
go to (the frame + 1)
end
Este script nos hace saltar al frame siguiente al que estamos al hacer click sobre el objeto en
cuestión. Podemos saltar más de uno simplemente cambiando "the frame + 1" por "the frame
+ x", donde x puede ser cualquier número. Igualmente, podemos ir uno o más frames "hacia
atrás", cambiando "the frame + x" por "the frame - x".
* Salir de la aplicación:
Como toda aplicación que se precie, lógicamente deberemos incluir en nuestros interactivos un
botón para abandonar la aplicación. Aunque en las aplicaciones creadas con Director no es
estrictamente necesario, pues siempre se sale de ellas con comando-Q, no está de más ver el
script del botón "salir", que es el siguiente:
on mouseUp
quit
end
Sistemas Multimedia e Interacción Gráfica– Curso 2004/05 - 37/37