No hay plazo que no se cumpla ni deuda que no se pague, o algo así cita un dicho conocido, la cosa es que ahora viene la segunda parte de esta serie de tutoriales.
Para ver que aprenderemos esta vez y como lo haremos, vamos después del salto.
Cómo dominar Flash parte 2
Nota: Primero que todo, es necesario haber leído la Parte 1 de esta serie para saber que necesitamos y entender un par de referencias que haremos.
Bueno, aclarado esto, vamos a lo nuestro, hoy aprenderemos a hacer botones en flash, pero no botones de pantalon ni camisa, si no que botones para poder linkear un archivo o página desde flash. Vamos a la acción.
Procedimiento:
1.- Creamos un archivo nuevo, por ahora usaremos Archivo Flash (AS 2.0), AS es ActionScript, ya explicaremos eso en futuras partes. Bien creamos el archivo.
2.- Al igual que en el tutorial anterior, creamos un simbolo en la biblioteca, pero esta vez, cuando nos aparezca esta ventana:
En tipo seleccionamos “Botón” como se puede ver en la imagen.
3.- Si se fijan, al seleccionar esto como “Tipo” la linea de tiempo toma otra forma:
Ahora, en vez de estar divida por fotogramas, se divide en estados, que son cuatro:
Reposo: Cuando el mouse no esta sobre el botón.
Sobre: Cuando el mouse esta sobre el botón.
Presionado: Cuando uno hace click sobre el botón.
Zona Activa: Cuando el botón esta activo.
Con esto podremos lograr que nuestro botón tome distintos colores y/o formas segun su estado, claro que por una cosa de estetica, no es muy recomendable que el botón cambie su forma.
4.- Bueno volviendo a la creación del botón, creamos un rectángulo (pueden darle la forma que ustedes quieran, lo haremos así, solo con fines pedagógicos). Lo pueden colorear como enseñamos en la primera parte de Como dominar Flash, luego de esto, presionan F6, como verán, el “puntero” cambio de Reposo a Sobre y el botón que dibujaron se copio automáticamente.
5.- Repetimos el proceso del paso 4, cambiando los colores a elección, hasta llegar a “Zona Activa” en este último no es necesario modificar el color.
6.- Opcionalmente podemos incluir el texto en este momento, con lo cual quedará fijo o agregarlo en la escena, con lo cual lo podemos cambiar y usar el botón para mas de una función, en este caso, lo añadiremos dentro del botón, quedando fijo (de todas formas, de querer modificarlo, es cosa de entrar nuevamente al simbolo y hacerlo, pero es un metodo poco práctico). El botón quedaría parecido a esto:
7.- Con nuestro botón creado, vamos a las Escena 1 (arriba a la izquierda) y arrastramos desde la biblioteca nuestro botón y con esto tenemos creado nuestro botón flash. Pero ¿de que sirve un botón que no hace nada? de nada, entonces ahora veremos como hacer que este haga algo, por ejemplo, mostrar nuestra animación anterior.
8.- Lo primero que hacemos es guardar este proyecto en la misma carpeta que nuestra animación anterior (o el archivo que quieran linkear).
9.- Ahora en la Escena seleccionan el botón y presionan F9, con lo que aparecerá una ventana como esta:
Esta una ventana de “Actions” es donde uno puede programar las acciones del botón y es precisamente eso lo que haremos, si se fijan, en la ventana de la derecha se ha ingresado un código de programación. Es ese el que deben ingresar, a continuación, el código y su explicación.
on (release) {
getURL(“xxx.xx”,”_blank”);
}
Ahora lo desglosamos
– on (release) = Con esto le decimos al programa que lo que tiene que hacer, lo haga despues de que uno “suelta” el boton. Cuando uno hace click lo tiene presionado y al dejar de presionarlo uno lo “suelta”.
– { = La acción a realizar, lo que se hará al soltar el botón, debe estar indicada entre llaves y esta es la de apertura.
– getURL(“xxx.xx”,”_blank”) = Eso es en si la acción a realizar, getURL es el comando con el que se le indica a flash que vaya a una dirección o archivo, luego entre ( ) y dentro de ellos entre comilas, va el nombre del archivo o direccion, donde xxx.xx es el nombre de archivo con su extensión. Si vamos a usar una dirección de Internet, esta, tambien entre comillas, debe partir con http://, separado por una coma y tambien entre comillas encontramos el comando _blank, con esto le decimos a flash que la página o archivo que se abra, debe abrir en otra ventana, podemos reemplazarlo por _self si queremos que se abra en la misma.
– ; = Con el punto y coma terminamos la acción, osea, le decimos a flash que luego del cierre de parentesis la acción termina. Es necesario si queremos agregar más de una acción, pero para acostumbrarnos a usarlo, lo pondremos acá.
– } = Cierre de llave, aqui termina la instrucción de la acción.
Y ahora si que hemos terminado, para probar su Botón en el explorador lo pueden hacer con Control+F12.
Como siempre, este tutorial a sido realizado, probado y documentado por el equipo de Como Lo Hago y por lo tanto cuenta con nuestro sello de garantía, cualquier consulta, o problema pueden dejar su comentario a continuación.
Responsable de transformar miles de k310 en w200, y sobrevivir para contarlo, Jorge Nitales tuvo sus inicios en los barrios bajos de Papúa y Nueva Guinea, en una exitosa empresa productora de Paraguas de Bambú. Luego de alcanzar fama y fortuna, lo dejó todo para jubilar a la edad de 16 años y dedicarse a la cosecha de tomates hidropónicos en la zona de Pemuco. Es ahí donde fue reclutado para CLH por Dexter, un asiduo comprador de la hortaliza. A la fecha se le adjudica el haber enseñado a miles de personas en cientos de países como teletransportarse y hacer el famoso Kamehamehá, rumoreándose fuertemente una Genkidama en el futuro próximo. Las baterías vienen por separado.
En los barrios marginales se le conoce como: Vertig0
Comentarios en Facebook
2 Comentarios
Antonio
junio 04, 2009
1:17:45 pm
Muy bueno el tutorial comentado aqui, con esto ya tengo algo ya como funciona los botones, tengo una duda, yo he animado un fondo similar al de la pagina de Cisco.com y quiero saber como lo puedo hacer al hacer click se quede activo ese fondo, y al hacer clic a otro boton se quede ahi, y al entrar a la pagina cargue automaticamente y me muestre por defecto el fondo principal. De antemano le doy las gracias por la ayuda, no se si puedas ayudarme estare eternamente agradecido porque soy nuevo en esto. MUCHAS GRACIAS
Hola, estoy trabajando con flash cs5.5 y no tengo la opcion de ActionScript, sino me aparece ActionScript 2 y ActionScript 3, hice un boton como indica el tutorial y no me realiza el link con el otro documento de flash. Tuve que elegir ActionScript 2 para hacer la prueba pero no me hace el enlace, que pudo haber salido mal??? Gracias por responder a futuro… Siro
1:17:45 pm
Muy bueno el tutorial comentado aqui, con esto ya tengo algo ya como funciona los botones, tengo una duda, yo he animado un fondo similar al de la pagina de Cisco.com y quiero saber como lo puedo hacer al hacer click se quede activo ese fondo, y al hacer clic a otro boton se quede ahi, y al entrar a la pagina cargue automaticamente y me muestre por defecto el fondo principal. De antemano le doy las gracias por la ayuda, no se si puedas ayudarme estare eternamente agradecido porque soy nuevo en esto. MUCHAS GRACIAS
11:57:01 am
Hola, estoy trabajando con flash cs5.5 y no tengo la opcion de ActionScript, sino me aparece ActionScript 2 y ActionScript 3, hice un boton como indica el tutorial y no me realiza el link con el otro documento de flash. Tuve que elegir ActionScript 2 para hacer la prueba pero no me hace el enlace, que pudo haber salido mal??? Gracias por responder a futuro… Siro