Guía Visual de Macromedia Flash MX 2004

Macromedia Flash MX es un programa donde podemos desarrollar desde una simple animación hasta una aplicación
multimedial completa (película, material educativo, sitio web, etc.)

La Pantalla de Flash:

Cuando abrimos Macromedia Flash MX nos encontramos con la siguiente pantalla:

Línea de
Tiempo

Cuadro de
Escenario de la
Herramientas
Película

Ventana de
Propiedades

Configuración de la Película (Document o Movie):

La Película es el archivo de Flash compuesto por escenas, actores y animaciones. En ella, crearemos nuestros dibujos
con las Herramientas, y nuestras animaciones por medio de la Línea de Tiempo. Para poder configurar esta película,
por ejemplo, cambiarle el tamaño, el color de fondo, la velocidad de los fotogramas o frames por segundo (FPS), se
debe acceder al menú MODIFICAR – DOCUMENTO (en inglés, MODIFY – DOCUMENT). Aparece el siguiente cuadro:

Entonces, este cuadro nos pide los datos para el

tamaño de nuestra película, color de fondo, la
velocidad de reproducción, y qué tipo de regla o
unidad de medida deseamos utilizar (píxeles,
centímetros, etc).

Botón Printer (Coincidir con impresora): Significa

que nos adapta el documento para una buena
impresión (en caso de bocetos, por ejemplo).
Botón Contents (Coincidir con contenidos): Nos
adapta el fondo a los objetos que tenemos sobre la
película, y si sobra espacio lo elimina.
Botón Make Default (Transformar en
predeterminado): Una vez que tenemos todos los
valores anteriores ingresados (alto, ancho, color,
velocidad) y si todas nuestras películas van a ser
iguales, o sea, van a usar esos valores, tomamos esta opción y la dejamos predeterminada. Cada vez que tengamos un
archivo nuevo va a abrir con estas características predeterminadas.
Botón Default (Predeterminado): Sirve para pedir que nos coloque lo predeterminado, por si cambiamos y no es lo
deseado.
Tipos de Archivos manejados por Flash:

En Flash, como mínimo, tenemos dos archivos:

• El archivo fuente, es decir, aquél que creamos, animamos, configuramos, y que al

guardarlo su extensión es .fla, y su ícono es de color rojo. Dicho archivo se puede volver a
abrir y modificar, pero no es el que se ejecuta.

• El archivo ejecutable o Publicación, el cual nosotros debemos crear al terminar el archivo

fuente. Este archivo es el que realmente se va a ejecutar, ya sea en el Internet Explorer (si
forma parte de una página web), o usando el Flash Player, que es el programa que lo
ejecuta. Su extensión es .swf, y su ícono es de color gris. También podemos hacer que
nuestra película sea un gif animado, un video AVI, etc.

¿Cómo hacemos para crear el archivo de publicación?

Una vez que terminamos el archivo fuente (la película .fla), debemos exportar dicho archivo, haciendo lo
siguiente:

1) Guardamos el archivo fuente con un nombre dado (File – Save).

2) Accedemos al menú FILE – EXPORT – EXPORT MOVIE, y guardamos el archivo de publicación

(en lo posible con el mismo nombre del archivo fuente), y debajo del nombre, elegimos uno de los
formatos de publicación (un tipo de archivo):
Cuadro de Herramientas (Tools):

Aquí vemos las herramientas disponibles para crear y

editar dibujos.

Si tenés Flash instalado en tu PC, dichas herramientas

se pueden ejercitar realizando las actividades Flash que
figuran en el sitio web del colegio:

www.sagradocorazon.edu.ar :

• Cuando la página carga, hacé clic en la opción

Material de Estudio en el menú de la izquierda.

• Después, en el menú que aparece arriba,

elegimos la opción Polimodal.

• Descargá las actividades y las consignas de la

primera tabla que aparece (se llama Flash –
Actividades, y Flash – Consignas para
actividades).

• Descomprimí las actividades y podés repasar

las dos primeras que hicimos en clase.

Ventana de Propiedades (Properties):

Esta ventana es sensible al contexto donde se hace clic. Esto significa que, si hago clic sobre una línea, va
a mostrar las propiedades o características que se le pueden dar a una línea (longitud, espesor, tipo, etc).

Línea seleccionada con la

herramienta Selección
(flecha negra)

Propiedades
Propiedades de de la
la
Línea
Línea
(el
(el relleno
relleno no
no
funciona
funciona porque
porque
no
no pertenece
pertenece aa lala
línea)
línea)
En cambio, si le hago clic al color de relleno de una figura, mostrará además, la posibilidad de cambiar dicho
relleno.

Fondo seleccionado con la

herramienta Selección
(flecha negra)

Propiedades
Propiedades del del
Relleno
Relleno
(ahora
(ahora no no
funcionan
funcionan las las
propiedades
propiedades de de
la
la línea)
línea)

Lo mismo sucederá con cualquier objeto que figure en la película, incluso funciona con la película
misma. Si hago clic en el escenario, aparecerán las opciones para cambiar el color de fondo, el
tamaño, etc.

Línea de tiempo (Timeline) y sus capas (Layers):

La línea de tiempo controla a cada objeto que forma parte de la película, ubicándolo en el espacio y en el
tiempo. Cada objeto se llama Actor. Dicho actor puede ser un texto, una imagen, un dibujo o conjunto de
ellos, un sonido, etc. Cuando animamos, cada actor se maneja en forma independiente de los demás, por
eso cada uno se ubica en una capa (Layer) distinta. En el siguiente ejemplo tenemos dos capas:

• Fondo, en la que se dibuja el ambiente de la animación, o sea, dónde transcurre la película. Por
ejemplo, una calle en la ciudad. Los fondos son estáticos, no son animados. Si quisiera animar
algún elemento del fondo tendré que sacarlo de esta capa y ubicarlo en otra. Por ejemplo, quiero
que una nube del cielo se mueva. Crearé una capa llamada Nube, y la animaré allí.
• Auto: se puede dibujar un automóvil y animarlo para que recorra la calle dibujada en el Fondo.

Tenemos dos capas:

Fondo y Auto.
El nombre por defecto
de una capa es Layer1,
Layer2...
Doble clic sobre este
nombre para cambiarlo.

Ocultar
Capa

Agregar
nueva Capa Bloquear Borrar
Capa Capa
 Fotogramas:

Los fotogramas son los cuadros que forman una animación. Cada fotograma indica qué se debe ver en la
película, dónde, con qué características y por cuánto tiempo.
Existen cuatro tipos de fotogramas:

• Fotograma Clave (KEYFRAME): Encargado de ubicar un actor en la película.

• Fotograma (Frame): Encargado de hacer que el actor del fotograma clave permanezca en el
mismo lugar y con las mismas características, una determinada cantidad de tiempo.

• Fotograma Final: Indica que se cumplió el tiempo del actor del fotograma clave.

• Fotograma Vacío: Indica que no hay ningún actor en esa animación, o que el actor desaparece.

Fotograma Vacío: Fotograma Final:

Está preparado para Indica que el fondo
recibir un actor. Se ve termina su aparición en
que todavía no se ha la película tal como
dibujado el automóvil, apareció en el
y lo está esperando. fotograma clave.

Este fotograma 15, es

el fotograma activo. El
Fotograma Clave: es el Cabezal de
primer fotograma de la Reproducción (en rojo)
capa Fondo, e indica está sobre él.
que el fondo de la
Fotogramas: son
película se dibujó allí y
varios; van desde el
debe aparecer ni bien Aquí se indica que
fotograma 2 hasta el
comience a reproducirse hasta el fotograma
29. Hacen que el fondo
la misma. 15, tenemos 1.2
permanezca un tiempo
en pantalla hasta el segundos de
fotograma 29. película.

Allí se indica el número Esta es la velocidad de

de fotograma que está reproducción (12 fotogramas
activo por segundo). Se puede
cambiar haciendo doble clic
allí. Por defecto son 12.

• Para agregar un fotograma clave a la capa: Clic derecho (en el fotograma de la capa) – INSERT
KEYFRAME.

• Para agregar un fotograma a la capa: Clic derecho – INSERT FRAME.

• Para agregar un fotograma vacío a la capa: Clic derecho – INSERT BLANK KEYFRAME.

• Para borrar un fotograma de cualquier tipo: Clic derecho – REMOVE FRAMES.

Ejemplos de Animación:

1) Se desea dibujar un círculo rojo, y hacer que aparezca y desaparezca varias veces en el
mismo lugar cada 0.3 segundos:

3) Vuelve a
2) Aquí hay 4 fotogramas aparecer y
vacíos. O sea que el círculo permanece otros
no está (desaparece por 4 fotogramas.
0.3 s)

1) Animación: el círculo
aparece en un
fotograma clave, y
permanece 3
fotogramas más (en 4) Vuelve a
total 4 fotogramas, o sea desaparecer
0.3 segundos)

NOTA:
1. Para reproducir la animación, se presiona la tecla Enter, y el cabezal se mueve por los fotogramas.

2. Para ver una vista previa de la publicación en el Internet Explorer, o en el Flash Player, se debe
presionar la tecla F12. Nótese que la reproducción vuelve a empezar y se hace infinitas veces.

Si se quiere que además de aparecer, el círculo cambie de color, se debe hacer clic en cada
fotograma clave en que aparece (1, 10, 20) luego clic en el relleno rojo para cambiarlo por otro color
con la herramienta Relleno.
 2) Se desea agregar una capa al ejemplo anterior, de manera que cada vez que el círculo
desaparezca, aparezca un rectángulo en su lugar:

Observemos las dos capas: cada vez que en la capa Círculo hay fotogra7mas, en la capa Rectángulo están
vacíos. Ahora el cabezal está reproduciendo el fotograma 1. Se ve el círculo.

Cuando pase por el fotograma 5, el círculo desaparecerá, y aparecerá en su lugar el rectángulo :

Y así pasará con los demás fotogramas hasta el 29, que es el último.

Si reproducimos con F12, la animación no tendrá fin, y así es como quedará publicada en el archivo .swf.

Podemos hacer además, que ambas figuras aparezcan en diferentes posiciones del escenario, con
distintos colores, tamaños, rotación, etc. Sólo tenemos que posicionarnos en cada fotograma clave
con un click, luego seleccionar la figura y cambiar sus propiedades.
Símbolos Gráficos:

Si en una película queremos utilizar un determinado objeto muchas veces, conviene convertirlo en símbolo
gráfico. Para ello seleccionamos el objeto y accedemos al menú MODIFY – CONVERT TO SYMBOL:

Le ponemos un nombre sin

espacios, debajo elegimos la
opción GRAPHIC y hacemos
clic en OK.

Nos damos cuenta que un objeto es un símbolo gráfico porque cuando lo seleccionamos, aparece un
rectángulo celeste rodeándolo, y en la ventana de propiedades vemos que dice Graphic a la izquierda.

Los símbolos quedan guardados en la Biblioteca de la película

(Library).

Cada vez que necesitemos un símbolo iremos a la biblioteca y allí

estará listo para usarse. Por eso se dice que son Reutilizables.

Para ver la ventana de la Biblioteca, tenemos que acceder al menú:

WINDOW – LIBRARY.

Aparece en el panel de la derecha de la pantalla.

Si no se ve, hacé clic en la flecha gris derecha de la pantalla de
Flash.

Lo bueno de esto es que, si quiero construir un bosque, lo único que

hago es arrastrar el árbol de la biblioteca al escenario tantas veces
como árboles quiera colocar en él.

Arrastro
Arrastro elel
símbolo
símbolo al al
escenario
escenario
todas
todas las
las
veces
veces que
que
quiera.
quiera.
 Si le queremos cambiar alguna característica al árbol (color, forma, etc) tendremos que editar el símbolo.
Para ello, debemos hacerle doble clic al mismo en la biblioteca. De esta forma, ingresamos a él y lo
editamos. Por ejemplo, le cambiaremos el color:

4) Clic en la flecha
para salir del
símbolo y volver al
escenario de la
película.

2) Entramos
al símbolo
“árbol”

1) Doble clic en
el símbolo 3) Cambiamos los
colores

Al cambiar el símbolo, automáticamente cambian todas las copias del mismo que habíamos
arrastrado al escenario.

NOTA: No todos los dibujos tienen que ser símbolos gráficos. Si en el ejemplo anterior de la animación del
círculo, éste hubiera sido un símbolo gráfico, no podríamos haber logrado que cambiara de color ni de
tamaño varias veces, pues al editarlo, habría tomado el nuevo color y tamaño en todos los fotogramas
clave.
 Interpolaciones:

Las interpolaciones son efectos de animación sencillos que ahorran mucho tiempo al usuario, ya que
colocando un fotograma clave de origen, y otro de destino, se generan todos los fotogramas intermedios de
la animación en forma automática.

Existen dos tipos:

• Interpolación de Movimiento (MOTION TWEEN)
• Interpolación de Forma (SHAPE TWEEN)

Interpolación de Movimiento:

Permite mover un símbolo gráfico por la película desde una posición de origen dada, hasta otra posición
de destino.

Por ejemplo, si quiero mover una estrella desde la izquierda hacia la derecha, debo seguir estos pasos:

1. Dibujar la estrella en el fotograma clave 1 de la capa Estrella.

2. Convertirla en símbolo gráfico.
3. Ubicarla sobre la película, a la izquierda.
4. Insertar un fotograma clave en la posición 30 (por ejemplo).
5. Seleccionar el fotograma 30.
6. Correr la estrella del fotograma 30 a la parte derecha de la película.
7. Hacer clic derecho sobre algún fotograma intermedio – CREATE MOTION TWEEN.
8. Presionar Enter para probar el efecto (o F12)

Fotograma clave de
origen: la estrella
está a la izquierda.

Fotograma clave de
destino: la estrella
está a la derecha.

Fotogramas
En la línea de tiempo, los
intermedios: por cada fotogramas se pintaron de
uno, la estrella se va violeta y apareció una flecha
desplazando desde el que indica el sentido de la
origen hasta el destino interpolación (desde dónde
parte el símbolo, y a dónde
llega).
 Ahora podemos agregarle más efectos a nuestra estrella durante la animación:

• Si queremos que, a medida que se mueva, vaya rotando, hacer clic en el fotograma clave de
destino, y luego rotar la estrella.
• Si queremos hacer un zoom a la estrella (que se agrande), posicionados en el fotograma clave
destino, agrandar la estrella.
• Si queremos que se achique, agrandar la estrella en el primer fotograma clave, o achicarla en el
último.

Interpolación de Forma:

Consiste en lograr que un dibujo se convierta en otro dibujo. Es decir, a medida que se va deformando, va
adquiriendo la forma del otro.

Por ejemplo, queremos que un círculo se convierta en un rectángulo:

1. Dibujar el círculo en el fotograma clave 1 de la capa Círculo.

2. Ubicarlo en el centro de la película.
3. Insertar un fotograma clave en la posición 30 (como ejemplo).
4. Seleccionar el fotograma 30.
5. Borrar el círculo que aparece, y en su lugar dibujar el rectángulo con otro color.
6. Hacer clic en uno de los fotogramas intermedios (por ejemplo, el 15).
7. En la ventana de Propiedades, elegir la opción SHAPE del menú Tween.
8. Presionar Enter para probar el efecto (o F12)

Fotograma clave
de origen: círculo.

Fotograma clave de
destino: rectángulo.

En la línea de tiempo los

fotogramas se pintaron de
Fotogramas verde, y apareció una flecha
intermedios: el que indica el sentido de la
círculo se va interpolación (de qué objeto
convirtiendo en el parte, y a qué objeto llega a
rectángulo. convertirse.
ATENCIÓN: Para que la interpolación de forma salga bien, debemos usar dibujos. NUNCA usar
símbolos gráficos, porque ellos se usan solamente en la interpolación de movimiento.

Ahora podemos agregarle más efectos a nuestros dibujos durante la animación:

• Si queremos que el círculo, a medida que se convierta en el rectángulo, se mueva, hacer clic en el
fotograma clave de destino, y mover el rectángulo a otra posición.

• Si queremos que el círculo, a medida que se convierta en el rectángulo, se agrande, posicionados

en el fotograma clave destino, agrandar el rectángulo.

• Si queremos que se achique, agrandar el círculo en el primer fotograma clave, o achicar el

rectángulo en el último.

Uso de imágenes:

Podemos incluir en las películas aquellas imágenes que nos gusten. Para ello, debemos importarlas a la
biblioteca, de la siguiente manera:

Acceder al menú FILE – IMPORT – IMPORT TO STAGE : aparece un cuadro para elegir el archivo a
importar. La imagen se importa al escenario de la película, y queda guardada en la Biblioteca.

O BIEN

Acceder al menu FILE – IMPORT – IMPORT TO LIBRARY : también aparece el cuadro para elegir el
archivo. La imagen se importa en la Biblioteca, sin pasar por el escenario de la película. Se elige esta opción
si queremos a importar imágenes que vamos a usar más tarde.

Efectos de imagen:

Podemos usar imágenes en animaciones, y en interpolaciones de movimiento. En estas últimas, sabemos

que debemos convertir las imágenes a símbolos gráficos.

Además de hacer que una imagen se mueva por la película, rote, se agrande y se achique (como ya hemos
visto), podemos agregarle nuevos efectos:

• Efecto ALFA: Consiste en darle una cierta transparencia a la imagen. Si el efecto alfa es al 0%, la
imagen no se ve (es totalmente transparente). Si es de 50%, es medianamente transparente, y se
ve como si estuviera impresa en un papel de calcar. Si está al 100%, la imagen no tiene
transparencia, es decir, se ve normalmente. Se puede elegir más o menos transparencia entre 0 y
100%. Con este efecto, en una interpolación de movimiento, podríamos hacer que una imagen vaya
apareciendo, vaya desapareciendo, o ambas cosas.

Imagen original Imagen con efecto Alfa al 40%

 • Efecto TINTA: Consiste en darle color a la imagen. Se usa mucho en fotos, por ejemplo en
paisajes. Si el efecto tinta es al 100% y elegimos por ejemplo, la tinta azul, la imagen no se verá, y
en su lugar aparecerá un rectángulo azul. Si el efecto es al 50%, la imagen tendrá un tono azul, es
decir que sus colores tenderán al azul. Si el efecto es al 0%, es como si no estuviera (no habrá tinta
azul). Se puede elegir más o menos tinta entre 0 y 100%. Con este efecto podremos lograr que una
imagen se vaya colorizando, agregándole diferentes tintas.

Imagen
Imagen original
original Imagen
Imagen con
con efecto
efecto Tinta
Tinta amarilla
amarilla al
al 40%
40%

• Efecto BRILLO: Es similar al efecto alfa, aunque no se le da transparencia a la imagen, sino que se
le da más o menos brillo a la misma. Este efecto va desde 100% (todo brillo, o sea, se ve un
rectángulo blanco en lugar de la imagen), pasando por 0% (el brillo normal de la foto), hasta –100%
(nada de brillo, es decir, se ve un rectángulo negro).

Imagen
Imagen original
original Imagen
Imagen con
con efecto
efecto Brillo
Brillo al
al –40%
–40%

¿Cómo hacemos para combinar dichos efectos en una interpolación?

Es muy sencillo. Construyamos una interpolación de movimiento, en la que aparezca una imagen:

• El fotograma clave de origen tiene que contener una imagen (símbolo gráfico).
• El fotograma clave de destino tiene que contener la misma imagen, en el mismo lugar.
• Luego, a la imagen del primer fotograma clave, aplicarle efecto Alfa al 0%.
Fotograma de origen:
símbolo gráfico de
una imagen.

Hacemos clic en la
imagen, y elegimos
en la opción COLOR,
Alpha al 0%

Fotograma de
destino: el mismo
símbolo gráfico de la
imagen.

Hacemos clic en la
imagen, y elegimos
en la opción COLOR,
Alpha al 100%, o
bien, None (nada).

Fotogramas
intermedios: la
imagen va
apareciendo.
 Ahora, construyamos una interpolación de movimiento, en la que una imagen pase de un tinte rojo a un tinte
azul:

Fotograma de origen:
símbolo gráfico de Hacemos clic en la
una imagen. imagen, y elegimos
en la opción COLOR:
TINT. Luego elegimos
el color rojo, y
colocamos 30%

Fotograma de
destino: el mismo Hacemos clic en la
símbolo gráfico. imagen, y elegimos
en la opción COLOR:
TINT. Luego elegimos
el color azul, y
colocamos 38%

Fotogramas
intermedios: la
imagen va
cambiando del tono
rojo al azul.
Botones:

Además de los símbolos gráficos, existe el símbolo de tipo Botón, que se utiliza para controlar la
reproducción de la película. El botón responde a eventos del Mouse y tiene tres formas de visualizarse que
debemos definir nosotros al dibujarlo:

• UP: Qué aspecto tendrá el botón cuando se vea sobre el escenario. Ejemplo =>

• OVER: Qué aspecto tendrá el botón cuando le pasemos el Mouse por encima.
Ejemplo: cambiará el color de fondo y del texto =>

• DOWN: Qué aspecto tendrá el botón cuando le hagamos click.

Ejemplo: cambiará nuevamente ambos colores =>

Además tiene la opción HIT, que no se ve en pantalla pero es muy importante, pues ella determina cuál es
la zona activa del botón (la parte del mismo habilitada para hacerle clic). Por lo general es todo el dibujo del
botón.

Al crear un botón, los tres comportamientos anteriores (UP, OVER y DOWN) deben estar definidos, aunque
no es obligatorio que los tres cambien colores, formas, fuentes, etc. Y la opción HIT también tiene que
quedar definida.

Veamos cómo se crea un botón:

En la película, crearemos un nuevo símbolo, de tipo botón. Para ello, acceder al menú INSERT – NEW
SYMBOL. Aparece el siguiente cuadro, en el que escribiremos el nombre del botón sin espacios (en este
caso, Reproducir), y elegiremos la opción BUTTON. Luego clic en OK:

Cuando hacemos clic en OK, entramos al nuevo objeto de tipo botón, para dibujarlo.

En la Biblioteca
aparece el nuevo
botón, aunque todavía
no tiene contenido.

Aquí están las opciones que

permiten definir cómo será el
botón. En cada una, iremos
dibujando el botón a gusto.
PASO 1:

Dibujemos el botón tal como se vería al ubicarse en el escenario. Al

dibujarlo se visualiza el fotograma clave en la opción UP, que dejó de
estar vacío:

PASO 2:

Luego debemos definir cómo será el botón cuando el usuario le pase el

Mouse por encima (OVER): para ello, insertemos un fotograma clave en
la opción OVER (clic derecho – Insert Keyframe). Aparece una copia del
botón que dibujamos en la opción UP. Tratando de no moverlo de
lugar, le cambiamos, por ejemplo, los colores:

PASO 3:

Ahora tenemos que definir el aspecto del botón cuando el usuario le

haga clic (DOWN). Para ello, debemos insertar un fotograma clave en
la opción DOWN, y cambiamos los colores de la copia del botón
anterior. También podemos cambiar formas, fuentes, tamaños.

PASO 4:

Ahora definamos la zona activa del botón, o sea, la parte del mismo
que va a responder al Mouse (HIT). En este caso, todo el dibujo
estará activo, por lo que, si insertamos un fotograma clave en la
opción HIT, al aparecer una copia del botón hecho en el paso
anterior, ya estamos definiendo esta zona activa. No es necesario
cambiar el aspecto del botón porque no se verá en pantalla.

Listo. Ahora, salimos del símbolo Botón haciendo clic en la flecha celeste que aparece en la ventana del
botón, y volvemos al escenario.

Si miramos la Biblioteca, allí estará el botón Reproducir, ahora mostrando su aspecto definido en UP.
Una vez creado el botón, debemos hacerlo funcionar, definiendo qué hará ese botón. Es decir, qué ACCIÓN
realizará cuando le hagamos clic.

Por ejemplo:
• Reproducir la película (play).
• Detener la película (stop).
• Ir a un determinado fotograma y reproducir la película desde allí (gotoandplay).
• Ir a un determinado fotograma y detener la reproducción allí (gotoandstop).
• Cargar un sitio web (getURL).

Para ver si el botón funciona o no, debemos crearlo e insertarlo en una película que contenga, al menos,
una animación.

Crearemos una capa nueva capa llamada BOTONES, que contendrá todos los botones que vayamos a
crear. Esta capa no posee animación, y deberá acompañar a las demás capas durante toda la película, de
manera que el usuario pueda acceder a los botones en cualquier momento de la reproducción de la misma.

La capa BOTONES
acompaña a toda
la película.

Ubicado en la capa
BOTONES,
arrastramos el
botón de la
Biblioteca al
escenario.

Y ahora, a definir su comportamiento.

Seleccionamos el botón, y activamos la ventana de Acciones (ACTIONS), que se encentra detrás de la

ventana de Propiedades, en la zona inferior de la pantalla. Si no se encuentra allí, activarla yendo al menú
WINDOW – DEVELOPMENT PANELS - ACTIONS

Clic sobre la palabra

Actions, y se despliega
la ventana de acciones
hacia arriba
 Así se ve la ventana de Acciones:

El botón debe
estar
seleccionado

Ventana de
Acciones
desplegada.
Nótese que al lado
de Actions, debe
figurar la palabra Panel de Código:
Button, para aquí se escribe el código,
trabajar sobre el usando el lenguaje de
botón. programación
ACTIONSCRIPT, que
definirá la acción a
realizar por el botón
cuando se le haga clic.

Nuestro botón deberá reproducir la película. Por lo tanto el código a escribir en el panel de código es:

on(press)
on(press) significa
significa “cuando
“cuando se
se presione
presione el
el botón...”
botón...”
on(press)
on(press) play();
play(); significa
significa “reproducir
“reproducir la
la película”
película”
{{
yy las
las llaves
llaves obligatorias
obligatorias se
se colocan
colocan para
para indicar
indicar que
que todo
todo lo
lo que
que está
está entre
entre ellas,
ellas,
play();
play(); se
se va
va aa realizar
realizar cuando
cuando sese presione
presione el
el botón
botón (en
(en este
este caso
caso es
es play();
play(); solamente,
solamente,
}} pero
pero puede
puede haber
haber más
más código).
código).

Cuando El código se
terminamos de escribe todo en
escribir el minúscula, salvo
código, clic en excepciones que
Actions para se verán luego.
cerrar la ventana

O sea que, cuando se presione el botón (cuando se haga clic en él),

se reproducirá la película.
Conviene crear ahora un botón que detenga la película, para darnos cuenta si el botón Reproducir funciona.

Una vez creado el botón Detener Película, nos ubicamos en la misma capa BOTONES y lo arrastramos al
escenario, lo seleccionamos, y en el panel de código de la ventana de Acciones escribiremos:

on(press)
on(press) significa
significa “cuando
“cuando se
se presione
presione el
el botón...”
botón...”
on(press)
on(press) stop();
stop(); significa
significa “detener
“detener la
la película”
película”
{{
yy las
las llaves
llaves obligatorias
obligatorias se
se colocan
colocan para
para indicar
indicar que
que todo
todo lo
lo que
que está
está entre
entre ellas,
ellas,
stop();
stop(); se
se vava aa realizar
realizar cuando
cuando sese presione
presione el
el botón
botón (en
(en este
este caso
caso es
es stop();
stop(); solamente,
solamente,
}} pero
pero puede
puede haber
haber más
más código).
código).

Ahora podemos probar cómo funcionan ambos botones haciendo una vista previa de la publicación de la
película, presionando la tecla F12.

Otros casos citados en los que podemos usar Botones:

• Ir a un determinado fotograma y reproducir la película desde allí (por ejemplo desde el

fotograma 20).

Una vez construido el botón y puesto en el escenario en su capa correspondiente, escribimos el

siguiente código en la ventana de Acciones:

on(press)
on(press) significa
significa “cuando
“cuando se
se presione
presione el
el botón...”
botón...”
on(press)
on(press)
gotoandplay(20);
gotoandplay(20); significa
significa “ir
“ir yy reproducir
reproducir desde
desde el
el fotograma
fotograma 20
20
{{ en
en adelante”
adelante”
gotoandplay(20);
gotoandplay(20);
}} con
con las
las llaves
llaves obligatorias.
obligatorias.
 • Ir a un determinado fotograma y detener la película allí (por ejemplo, en el fotograma 15).

Una vez construido el botón y puesto en el escenario en su capa correspondiente, escribimos el

siguiente código en la ventana de Acciones:

on(press)
on(press) significa
significa “cuando
“cuando se
se presione
presione el
el botón...”
botón...”
on(press)
on(press)
gotoandstop(15);
gotoandstop(15); significa
significa “Ir
“Ir yy detener
detener la
la película
película en
en el
el fotograma
fotograma
{{ 15”
15”
gotoandstop(15);
gotoandstop(15);
}} con
con las
las llaves
llaves obligatorias.
obligatorias.

• Cargar un sitio web (por ejemplo, Hotmail).

Una vez construido el botón y puesto en el escenario en su capa correspondiente, escribimos el

siguiente código en la ventana de Acciones:

• on(press) significa “cuando se presione

el botón...”
on(press)
{ • getURL(“http://www.hotmail.com”);
getURL(“http://www.hotmail.com”); significa “cargar el sitio web Hotmail”, como
ejemplo.
}
• con las llaves obligatorias.

Sólo las letras URL van

en MAYÚSCULA

Profesores: Ariel Barabas y Elizabeth Vallerino