Documentos de Académico
Documentos de Profesional
Documentos de Cultura
Cuaderno de Ejercicios Flash 8 PDF
Cuaderno de Ejercicios Flash 8 PDF
Pgina 1
Contenido
Ejercicio 1. Crear Gua de Dibujo. Cuadrculas ....................................................................... 4
Ejercicio 2. Cambiar Propiedades de la Pelcula ..................................................................... 5
Ejercicio 3. Abrir Paneles ........................................................................................................ 6
PRACTICA 1: Crear una pelicula a nuestro gusto.................................................................... 7
PRACTICA 2: Estructurar una Pelcula..................................................................................... 7
PRACTICA 3: Creando Fotogramas ......................................................................................... 7
PRACTICA 4: Paneles............................................................................................................... 8
Ejercicio 4.Crear un valo ...................................................................................................... 8
Ejercicio 5.Dando Color a un valo ........................................................................................ 9
Ejercicio 6.Creando un color transparente........................................................................... 10
PRACTICA 5: Bandera Olmpica ............................................................................................ 11
PRACTICA 6: Saturno ............................................................................................................ 11
Ejercicio 7.Cambiar el Tipo de Texto .................................................................................... 11
PRACTICA 7: Objetos. Rellenos y Bordes .............................................................................. 12
PRACTICA 8: Selecciones ...................................................................................................... 12
PRACTICA 9: Alinear Objetos ................................................................................................ 13
PRACTICA 10: Grupos ........................................................................................................... 13
Ejercicio 8.Cambiar un objeto de Capa ................................................................................ 13
Ejercicio 9.Crear Smbolo. .................................................................................................... 14
Ejercicio 10.Modificar una instancia de un smbolo............................................................. 15
PRACTICA 11: Crear Smbolo ............................................................................................... 16
PRACTICA 12: Insertar Instancia ........................................................................................... 17
PRACTICA 13: Duplicar Instancia .......................................................................................... 17
PRACTICA 14: Efectos sobre Instancias ................................................................................ 17
Ejercicio 11.Carga y Modificacin de Filtros......................................................................... 18
PRACTICA 15: Selector de Filtros .......................................................................................... 20
Ejercicio 12.Encadenar Interpolaciones ............................................................................... 21
Ejercicio 13. Animar Texto por Bloques ............................................................................... 23
PRACTICA 16: Crear un Clip a modo de cuenta atras ........................................................... 26
PRACTICA 17: Crear un clip vaco y editarlo despus ........................................................... 26
PRACTICA 18: Exportar una pelcula con proteccin............................................................ 26
Ejercicio 14.Crear un Botn con Relieve .............................................................................. 27
PRACTICA 19: Crear un boton en forma de pildora ............................................................. 28
PRACTICA 20: Ajustar el rea Activa .................................................................................... 29
PRACTICA 21: Botn con Sonido .......................................................................................... 29
PRACTICA 22: Detener una Pelcula ..................................................................................... 30
PRACTICA 23: Animacion por forma Babosa arrastransose .............................................. 30
PRACTICA 24: Cambio de Forma y Tamao.......................................................................... 31
PRACTICA 25: Cambiar la Forma de un Texto ...................................................................... 31
PRACTICA 26: Consejos de Forma ........................................................................................ 31
Ejercicio 15.Exportar objeto como Bitmap........................................................................... 32
CUADERNO DE EJERCICIOS Y PRACTICAS FLASH 8
Pgina 2
Pgina 3
Pgina 4
Pgina 5
Pgina 6
Pgina 7
PRACTICA 4: Paneles
1 Abre el Panel Mezclador de Color.
2 Abre el Panel Acciones.
3 Abre el Panel Alinear.
4 Cierra el Programa Flash 8
5 Vuelve a abrirlo. Qu notas?
Truco: Si quieres crear un crculo perfecto, mantn pulsada la tecla SHIFT mientras das
forma al valo. (Sucede igual con la Herramienta Rectngulo)
Pgina 8
que se
2 Hacemos clic en el interior del valo o en su borde. Depender de la zona cuyo color
queramos modificar.
Obtendremos algo similar a la figura 1 o a la 2.
3 Una vez hecho esto, nos fijamos en el Panel de Colores, que se encuentra dentro de la
Pgina 9
Rectngulo Azul
Ahora con Transparencia
Si situamos otra imagen detrs de nuestro rectngulo (en otra capa), podemos ver cmo
queda el efecto de la transparencia sobre nuestro relleno
Pgina 10
PRACTICA 6: Saturno
1 Dibuja un valo
2 Convierte su color de relleno un degradado de verde oscuro a verde claro (por ejemplo).
3 Crea el aro que le rodea.
4 ne los 2 objetos para que parezca el planeta Saturno
Pgina 11
desaparecen si no escribes nada y haces clic en cualquier lugar del escenario). Esto es
lgico, ya que los textos Dinmicos y los de entrada no tienen porque tener "contenido"
Panel Propiedades
PRACTICA 8: Selecciones
1 Dibuja 5 valos. Dales el color de relleno y borde que quieras (elige un relleno que no
sea transparente
Pgina 12
Pgina 13
8 Hacemos clic en Pegar para colocar el objeto en este fotograma o hacemos clic en Pegar
in Situ para pegar el objeto en la misma posicin en la que estaba al cortarlo
Pgina 14
Primer Smbolo".
Pgina 15
y modificamos el tamao de la
7 Bien, ahora hemos modificado la instancia. Comprobemos que el smbolo sigue intacto.
Pgina 16
Pgina 17
Pgina 18
Pgina 19
Utiliza el archivo fuente filtros.fla que encontraras en la carpeta ejercicios/filtros del curso.
Como ya hemos visto, averiguar los filtros que afectan a un clip es realmente complicado,
debers idear una forma para poder gestionarlos y mantener los que estn activos cada
vez que se pulse uno de los botones.
No debers reproducir el aspecto de los filtros, puedes personalizarlos como ms te guste.
Pgina 20
Pgina 21
Pgina 22
Objetivo.
Crear una animacin sobre un texto separndolo en bloques de letras cuyo movimiento
ser tratado de manera independiente, dando al texto un efecto vistoso que pudiera
servir como presentacin de entrada a una web u otro tipo de pelcula.
Pgina 23
6 Creamos 5 nuevas capas, una por cada bloque que hemos creado.
Pgina 24
9 Seleccionamos cada capa y vamos borrando las partes del texto que no corresponden
con la parte del texto que debe contener. Es recomendable bloquear el resto de capas
cuando se haga esto para asegurarnos de que borramos las letras de esa capa (hay que
tener en cuenta que al principio todas las capas contienen lo mismo y superpuesto).
10 Situamos (arrastrando) el fotograma de cada capa a los siguientes frames:
"A" : Fotograma 1.
"U" : Fotograma 6.
"LA" : Fotograma 12.
"Clic" : Fotograma 18.
11 Seleccionamos el fotograma que ocupa cinco posiciones despus del fotograma de
cada capa y pulsamos F6 cada vez. En la capa "Clic" selecciona el fotograma 30 y pulsa
tambin F6.
12 Hacemos clic con el botn derecho en los fotogramas centrales que hay entre los
fotogramas claves y seleccionamos cada vez Crear Interpolacin de Movimiento.
13 Extendemos la imagen los ltimos fotogramas de cada capa hasta que ocupen el
fotograma 30 (Botn derecho Insertar Fotrograma Clave).
14 Exceptuando la capa "Clic" seleccionamos el primer fotograma de cada interpolacin y
aumentamos el tamao del bloque que contiene.
15 Movemos ahora fuera del escenario el bloque "Clic".
16 An en esta capa, hacemos clic con el botn derecho sobre el fotograma 24 y
seleccionamos Insertar Fotograma Clave.
17 En este fotograma recin creado reducimos el ancho del bloque de texto y lo
colocamos junto a la ltima "a".
Y ya tenemos la animacin creada. Como vemos hemos utilizado todo tipo de tcnicas de
interpolacin, aunque todava puede complicarse ms como veremos ms adelante.
Pgina 25
Pgina 26
8 Seleccionamos el botn.
9 Activamos la opcin de men Insertar Nuevo Smbolo...
10 Marcamos el comportamiento de botn y le damos un nombre. Pulsa Aceptar.
11 Hacemos doble clic sobre el botn para editarlo.
CUADERNO DE EJERCICIOS Y PRACTICAS FLASH 8
Pgina 27
Pgina 28
Pgina 29
Pgina 30
Pgina 31
Pgina 32
7 Pulsamos Guardar.
Pgina 33
Pgina 34
10 Intoduce ahora un -100 en la casilla Aceleracin (dentro), para hacer que aumente
progresivamente su velocidad.
Pgina 35
Pgina 36
Pgina 37
INSTRUCCION
DESCRIPCION
EMBED
SRC
QUALITY
BGCOLOR
WIDTH
ALIGN
TYPE
PLUGINSPACE
</EMBED>
Pgina 38
Pgina 39
Ser en el segundo 07.359, puedes utilizar las flechas izquierda y derecha para
Pgina 40
ajustar el tiempo.
de nuevo para crear otro punto de referencia, le daremos el
10. Pulsa el botn
nombre de carrera1 y seleccionaremos Navegacin.
11. Desplaza el cabezal al segundo 07.360.
12. Crea un punto de referencia pulsando el botn
carrera1inicio y selecciona Evento en Tipo.
y dale el nombre de
de la lista de la derecha
17. Desplzate hasta el segundo 58.159 e inserta otro punto de referencia. Llmalo
carrera2 y dale Tipo Navegacin.
18. Cambia el cabezal a la posicin 58.160 y crea un punto de referencia llamado
carrera2inicio de Tipo Evento.
19. Dale un parmetro llamado fotograma y con valor ready.
Pgina 41
20. Desplaza el cabezal al segundo 1:34.600, crea all un ltimo punto de referencia.
21. Dale el nombre carrera2fin y el Tipo Evento.
22. Crea un parmetro para este punto de referencia (pulsando el botn
fotograma y dale el valor lose.
), llmalo
23. Ya hemos terminado, haz clic en el botn Siguiente hasta que llegue al final y
empiece la importacin.
Hemos importado un vdeo preparado para navegar por l y que nos pasar parmetros
en determinados puntos. Fcil verdad?.
al pie de la Biblioteca.
Pgina 42
Pgina 43
7. Arrastra otro smbolo y colcalo al pie del Escenario (este ser el que har que rote
el elemento).
8. Redimensinalo, y selecciona tambin Botn.
9. Repite estos pasos para cada una de las formas que hayas creado.
10. Una vez ya estn todos los botones en el Escenario pasaremos a escribir el cdigo
asociado.
11. Crea una nueva capa pulsando el botn Insertar Capa
Pgina 44
}
Debers indicar en que nivel estaba cargado el SWF que contiene el elemento, en
este caso era _level1. Esto har que la propiedad visible del SWF se cambie a true
si se encontraba a false y al revs.
14. Tambin podemos acceder a las propiedades de los smbolos del SWF. Vers cmo.
Selecciona el botn que realizar el giro y escribe esto:
on (release) {
if (_level1._visible) {
_level1.cuadrado._rotation =
_level1.cuadrado._rotation - 15;
}
}
Como puedes ver, utilizamos la propiedad rotation, para referenciarnos al objeto
en cuestin slo es necesario escribir el nivel en el que se encuentra seguido del
nombre de instancia que le dimos en su momento.
15. Repite estos pasos para cada uno de los botones. Recuerda escribir bien las rutas
de nivel y los nombres de instancia.
16. Una vez terminado prueba la pelcula desde Control Probar pelcula.
Pgina 45
Para ello debers crear un movieclip que reproduzca el movimiento de la pgina, esta
pelcula tiene que llamarse hoja_movimiento y deber estar incluida directamente sobre
la pelcula principal (_root.hoja_movimiento), pues los botones incluidos en las hojas SWF
que cargars apuntan a ese clip de pelcula para avanzar o retroceder.
Adems, debers marcar con etiquetas de fotogramas ambos movimientos (el de avance y
retroceso) como siguiente y anterior.
Podrs encontrar las hojas a cargar en la carpeta /ejercicios/periodico del curso.
El resto queda a tu disposicin, utiliza todos los recursos que necesites.
Pgina 46
Tamben debers establecer el orden de tabulacin de los objetos y el botn por defecto.
Pgina 47
Adems, debers darle funcionalidad al botn Reset y Enviar. El primero limipando los
datos del formulario y el segundo recogiendolos validndolos y enviandolos a un archivo
php.
El validador del email deber comprobar que la direccin esta correctamente escrita (para
ello utiliza funcin indexOf y lastIndexOf).
Ejercicio 20.Rotacin
Objetivo.
Reproduciremos la pelcula que vimos en la teora pero en vez de utilizar diferentes
fotogramas de movieclips utilizaremos la propiedad _rotation.
Ejercicio paso a paso.
1. Abre el archivo movimiento_rotacion.fla que encontrars en la carpeta
ejercicios/movimiento_rotacion.
2. Observa que al clip le hemos dado el nombre de instancia miClip. Ahora abre el
Panel Acciones (Ventana Acciones o pulsando la tecla F9).
3. Escribe el siguiente fragmento de cdigo: var izquierda:Boolean =
false;
var derecha:Boolean = false;
miClip._x = 30;
miClip.onPress = function() {
if (miClip._x <= 30) {
miClip._rotation = 10;
derecha = true;
}
if (miClip._x >= 515) {
miClip._rotation = -10;
izquierda = true;
}
}
onEnterFrame = function() {
if (derecha) {
if (miClip._x < 515) {
miClip._x = miClip._x + 6;
}
else {
CUADERNO DE EJERCICIOS Y PRACTICAS FLASH 8
Pgina 48
miClip._rotation = 0;
derecha = false;
}
}
if (izquierda) {
if (miClip._x > 30) {
miClip._x = miClip._x - 6;
}
else {
miClip._rotation = 0;
izquierda = false;
}
}
}
Pgina 49
_global.ultimaY = 0;
Utilizaremos estas variables para saber en cada momento cuantas estrellas hay en
el Escenario y la posicin de la ltima de ellas.
7. Selecciona el botn aadir y escribe el siguiente fragmenteo de cdigo en el Panel
Acciones: on (release) {
if (numEstrellas<30) {
numEstrellas++;
var miEstrella:MovieClip =
attachMovie("estrella", "estrella_"+ultimaX+"_"+ultimaY,
numEstrellas);
miEstrella._x = ultimaX;
miEstrella._y = ultimaY;
if (ultimaX>=Stage.width-50) {
ultimaY += 50;
ultimaX = 0;
} else {
ultimaX += 50;
}
}
}
Observa los que hemos hecho. Si podemos aadir ms estrellas (entonces se
cumple la condicin) aumentamos en 1 el contador de estrellas.
Aadimos un nuevo clip de pelcula y le damos un nombre de instancia compuesto
por el nombre estrella seguido por las coordenadas de posicin para poder
eliminarlo ms tarde.
Aumentamos las variables de coordenadas teniendo en cuenta si la fila de estrellas
ha superado ya la anchura de la pantalla.
8. Selecciona el botn quitar y escribe el siguiente fragmento de cdigo en el Panel
Acciones: on (release) {
if (numEstrellas>0) {
numEstrellas--;
if (ultimaX==0) {
ultimaY -= 50;
ultimaX = Stage.width-50;
} else {
ultimaX -= 50;
}
removeMovieClip("estrella_"+ultimaX+"_"+ultimaY);
CUADERNO DE EJERCICIOS Y PRACTICAS FLASH 8
Pgina 50
}
}
En este caso hemos avaluado si hay estrellas que quitar (el contador debe ser
mayor que 0 para eso), y disminuimos el contador de estrellas en 1.
Devolvemos las coordenadas a su posicin inmediatamente anterior y eliminamos
la estrella que se encuentra en esa posicin llamndola por el nombre que hemos
creado para tal fin.
Ya hemos creado una pelcula que aade un nmero concreto de elementos
automatizadamente. Fcil verdad?.
Pgina 51
Pgina 52
(!(fondo.hitTest(miClip.getBounds(_root).xMin,
miClip.getBounds(_root).yMin-velocidad, true) ||
fondo.hitTest(miClip.getBounds(_root).xMax,
miClip.getBounds(_root).yMin-velocidad, true))) {
miClip._y -= velocidad;
}
}
if (Key.isDown(Key.LEFT)) {
if
(!(fondo.hitTest(miClip.getBounds(_root).xMin-velocidad,
miClip.getBounds(_root).yMin, true) ||
fondo.hitTest(miClip.getBounds(_root).xMin-velocidad,
miClip.getBounds(_root).yMax, true))) {
miClip._x -= velocidad;
}
}
if (Key.isDown(Key.RIGHT)) {
if
(!(fondo.hitTest(miClip.getBounds(_root).xMax+velocidad,
miClip.getBounds(_root).yMin, true) ||
fondo.hitTest(miClip.getBounds(_root).xMax+velocidad,
miClip.getBounds(_root).yMax, true))) {
miClip._x += velocidad;
}
}
}
Parece un poco complicado pero en esencia es ms sencillo. Para cada uno de los
movimiento (arriba, abajo, izquierda y derecha) tendremos que evaluar si se
produce colisin con el objeto miClip y el clip fondo.
Pero no bastar con hacerlo slo de una esquina, veamos un ejemplo para verlos
con ms claridad:
Como ves en la imagen, deberemos ver si se producen dos colisiones. En el
movimiento hacia abajo una ser la de la esquina inferior izquierda y la otra de la
esquina inferior derecha.
Si por ejemplo, no evaluasemos el choque con la esquina inferior izquierda e
intentsemos realizar un movimiento hacia abajo, ste se realizara! Y en
definitiva es lo que queremos evitar.
Observa tambin que para realizar el hitTest hemos tenido en cuenta la posicin
que adoptar el objeto despus del movimiento (sumndole la velocidad, o lo que
Pgina 53
Pgina 54
Utiliza el archivo fuente arma.fla que encontraras en la carpeta ejercicios/arma del curso.
Tu tarea consistir en crear el cdigo necesario para que el juego funcione. Debers seguir
las siguientes instrucciones:
Pgina 55
Crear un rayo con el arma cada vez que se pulsa la tecla Espacio.
Pgina 56
Pgina 57
Pgina 58
Dibujar un fondo.
Pgina 59