Les presento la entrega número 3 de 6 de la serie de botones en Flash. Es un tuto corto de 20 minutos donde veremos: Animación de forma, animación clásica de movimiento, utilizaremos los paneles, herramientas, gradientes así como la programación en AS3 para que se comporte como botón.
Link al video tutorial
Descarga de Archivos
INTERFACE FLASH
En este tutorial no me detengo tanto en explicar esto salvo algunos detalles como los “shortCuts” y algunas herramientas, si eres nuevo en Flash te recomiendo que veas el siguiente Tutorial, donde me detengo con más detalles en las herramientas e interfase del programa:
Video Tutorial Flash CS3 & CS4 en Español: Botones en Flash 1 de 6
ANIMACIÓN
Interpolación Clásica de Movimiento
Interpolación de Forma.
CLIPS DE PELÍCULAS
(movie clips)
Clips de Película
Anidar Clips de de película dentro de otro Clip de Película.
Duplicar MC
PROGRAMACIÓN ACTION SCRIPT
Explico cada concepto lo más lógico y aterrizado posible para una buena compresión de la programación de Botones.
Creamos la programación para que el cuando el cursor este sobre nuestro botón, este reaccione y despliegue animaciones, al igual que cuando el cursor sale del área de nuestro botón.
Links A los tutoriales existentes de la Serie:
Video Tutorial Flash CS3 & CS4 en Español: Botones en Flash 1 de 6
Video Tutorial Flash CS3 & CS4 en Español: Botones en Flash 2 de 6
Video Tutorial Flash CS3 & CS4 en Español: Botones en Flash 4 de 6
Video Tutorial Flash CS4 en Español: Botones en Flash 5 de 6
Video Tutorial Flash CS3 & CS4 en Español: Botones en Flash 6 de 6 NUEVO
Archivado bajo: Animación en Flash, Diseño de Layouts, Flash, Flash tutoriales, Video Tutoriales Flash, batatastudio, diseño web, programación | Etiquetado: adobe, batatastudio, botones actionscript en flash cs4, botones en Flash CS3 y CS4, Botones Flash, como crear botones en flash cs4, Como crear un botone en Flash, CS3, CS4, diseño web, en flash cs3 boton, Flash, flash CS3, flash CS3 Video tutorial, Flash tutoriales, flash video tutoriales en español, free tutorial, free video tutorial, gratis, prgramar botones en Flash, programación, Programación AS3, programación AS3 Botones, programacion botones flash cs4, tutoria del botones en Flash CS3, Tutorial Botones en Flash, tutorial crear botones en flash cs4, tutorial flash basico, tutorial flash CS3, tutorial flash cs3 español, tutorial flash cs4, tutoriales, tutoriales flash español, tutoriales gratis, video boton en cs4, video tutorial flash cs4, video tutoriales, video tutoriales botones flash, video tutoriales español, video tutoriales gratis, web, webdesign
[...] existentes de la Serie: Video Tutorial Flash CS3 & CS4 en Español: Botones en Flash 2 de 6 Video Tutorial Flash CS3 & CS4 en Español: Botones en Flash 3 de 6 [...]
Gracias por los videotutoriales y esta seri de videos relacionados a botones lo voy a empezar a chekear el video y luego te comento que tal me quedo o si tuve problemas…
le deja una duda en el tutorial de precarga que esta muy muy interesante a la hora de meter codigo…
Saludos y muchas gracias por los videos
le estoy siguien desde Google Reader…!!!
Saludos Peruanos…
Que bien!! por fin alguien utiliza el reader!!
orita lo voy aver amo a flash y todos los de mas programs
ya tengo mi boton hecho, hasta ahí no hay problema, el punto es… no consigo que abra el enlace al que ligo el botón, ¿tienes algún codigo hecho que pueda probar? O, en su defecto, por dónde busco.
Hola, claro que sí tengo el tutorial para eso, te dejo la liga sobre un tutorial de cómo crear un link en AS3 para tu botón:
Saludos!! espero que esto sea lo que estás buscando…
Hola Luis! muchas gracias por los videos estan de 10! me estan sirbiendo mucho pero, cuando quería abrir el video para los botones 3 de 6 hay un problema, exediste tu Bandwidth :S puedes ver que onda con esto?
Hola Diego: la respuesta esta en este post
Saludos!
Hola, solamente escribo para agradecerte por los fantasticos tutos que has hecho hasta el momento, y por los que harás. Ánimo y sigue asi.
Te has ganado un visitante asiduo a tu web, los tutoriales están genial, y el incluir los archivos y poder descargar los videos es todo un acierto. Felicidades por el trabajo y muchas gracias porque estoy empezando en flash cs4 y actionscript 3 desde cero y la verdad es que me vienen muy muy bien.
Un saludo desde España.
Hola Pablo, que bueno que encuentres útil los recursos y que mejor que me digas que es un acierto lo de los archivos y el video!!!
Saludos y te deseo todo lo mejor en mundo del Flash!!!!
=)
Hola que tal. estoy tratando de ver el video tutorial y no m deja, q podria ser? gracias
Hola Martha, acabo de checar y todo funciona correctamente, necesitas quickTime o Real player para poder verlo bien, puede que tarda un poco en cargar, pero ten paciencia, en caso de que te salga alguna leyenda o algo, te pido que me la mandes para revisarla. Te dejo el link directo del video:
http://www.batatastudio.com/tutoriales/serieBotones/boton3/boton3.mov
Saludos!
Hola, muchas gracias por tu ayuda, si tienes razon ya instale QuickTime y todo funciona de maravilla.
Disculpa pero ahora tengo otra duda, y ahora con referencia al tutorial de boton 3/6, ya vi el tutorial, hice poco a poco lo que indicas y al final en el javascrip me aparece lo siguiente:
interface ‘MouseEvent’ could not be loaded.
function fueraDeMi(event:MouseEvent):void
Total ActionScript Errors: 2 Reported Errors: 2
A que se debe? que hice mal?
por cierto para hacer el tutorial utilice macromedia flash 8, crees que sea por eso? este flash utiliza el javascript2.0 hay algo que ver?
MIL GRACIAS, de verdad MUCHAS MUCHAS GRACIAS!!
Espero que me puedas ayudar
Saludos
Hola Martha, para empezar no se llama javascript2.0 jajajajajajajaja se llama ACTION SCRIPT 2.0
Los errores te salen porque estás utilizando una versión anterior, es decir AS2 (action script 2) y tu estas escribiendo en Action Script 3 el cual no es soportado por tu macromedia flash 8, necesitas tener Flash CS3 o Flash CS4 que ya soportan la nueva versión del código. Es por eso tantos errores. Espero aclarar tu duda. Saludos!
Jejejeje si lo sé, cuando termine de escribir me di cuenta del error, pero si tengo muy claro la diferencia entre un java y un action script
MUCHAS GRACIAS por tu AYUDA
cuando subiras otra saga?
Hola ddkeydd, sobre la saga de botones pues ya tengo todos los tutos hecho solo tengo que regrabar algunos minutos de las últimas partes pero ya están listas, en cuanto este disponible en su totalidad la saga de botones podría pensar en otra. ¿tienes alguna sugerencia? Saludos!! =)
Hola Luisma estoy teniendo problemas con el link y el boton. Te explico hice un banner con varios jpg. y queria que al hacer click sobre el me lleve a un menu dentro de la pagina pero no logro hacer que se comporte como tal. Podria mandarte el codigo o decirme que es lo que estoy haciendo mal. Gracias por tu buena onda
pues bien me parece interesante la pag. pero no se pueden descargar los tutoriales ke onda komo le hago para poder descargarlooos necesito ayudaa saludos
ragdemacedo: Hola, espero que estés bien, las descargas de los videos están disponibles el 1 de agosto, si ves mi post más reciente explico porque no se ven los tutoriales, pero paciencia que a partir del sábado ya estarán disponibles!
Saludos!!!
tengo este problema utilizo cs4 ActionScript 3.0
boton 3/6, ya vi el tutorial, hice paso a paso lo que indicas y al final en el ActionScript me aparece lo siguiente:
interface ‘MouseEvent’ could not be loaded.
function fueraDeMi(event:MouseEvent):void
Total ActionScript Errors: 2 Reported Errors: 2
porfavor poderian ayudarme con esto muchas gracias
Rodrigo: Revisa bien el código: mayúsculas, puntos, comas, espacios, mínúsculas, si está mal copiado el código te van a salir errores. En el tutorial boton 1/6 explico con más detalle la escritura del código, puedes apoyarte en ese tutorial. Cuida los nombres de Instancia de los MC, los nombres de las etiquetas, intenta ser más meticuloso al momento de revisar el código. Saludos!
Funciona diez puntos.
¿Qué pasa si quiero abrir el Outlook, con el nunca bien ponderado “mailto:xxxx@xxxx.com” ?
¿Se puede?
Hola Luis María, ante todo te felicito por los tutoriales me han servido de gran ayuda pero me encontre con un inconveniente (ya que poco se de As3).
Tengo un Botón animado (mc en realidad pero su función es como botón) y quiero vincularlo a otra escena de mi fla, como lo hago? desde ya muchas gracias por tu colaboración, saludos desde Argentina!!
Mauricio: Hola, te dejo el link a dos video:
Este es para programar el clic del botón
Este otro es para hacer un sistema de navegación, es decir, das click a un botón y te lleva a una sección:
hola nuevamente luis, cheque los videos que previamente los habia visto pero ninguno me ayuda a linkear a otra escena, solo implementas el vinculo hacia una URL pero no a escenas!! agradeceria que me ayudes!
Gracias por estos tutoriales, me has ayudao mucho gracias a ti he conseguido que se mueva la pagina, mu bien explicao . Muchas muchisimas gracias.
Mauricio: Te paso el código =
btn1.addEventListener(MouseEvent.CLICK, escena2);
function escena2(event:MouseEvent):void
{
gotoAndPlay(“empiezaScena2″, “Scene 2″);
//El primer entecomillado es la etiqueta de la escena a la que quieres desplazarte
}
Voy a hacer un tutorial de esto. Saludos!
Maria Nadie: Me alegra!!!! Saludos!!!
[...] Flash CS3: Crear un botón 3 de 6 [...]
Gracias Luis me diste una gran mano!!!!
Ahora tengo otro problema en la pagina publique una seccion de videos utilizando mediante AS3 el componente FLVPlayback y a su vez un Skin que tiene predeterminada un boton para FullScreen, el inconveniente es que al ver la vista previa en mi pc funciona correctamente pero una vez publicada en la red, no hace ninguna acción este botón!!! me pudes ayudar una vez mas, gracias, un abrazo
[...] Flash CS3: Crear un botón 3 de 6 [...]
Mauricio: Hola, creo que es muy sencillo, al momento de publicar tu película haces lo siguiente:
Publish Settings – Elige el tab de HTML – en la opción de template esta seleccionada “Flash Only” – esa opción cambiala a “Flash Only Allow full screen” y listo.
Cuando lo vean en la web y se podrá desplegar como tu quieres. Saludos!!!
=)
hola luis nuevamente gracias…pero tengo algunos problemas al respecto por ej. que en algunos casos no los maximice o que se superpongan los videos..te invito a que des un vistazo al sitio y me ayudes nuevamente…te paso es http://www.viturrospeed.com/video.html gracias un abrazo
[...] Flash CS3: Crear un botón 3 de 6 [...]
Mauricio: Hola, estoy ocupndo FireFox 3.5.3 y probe 5 videos y funcionó perfectamente. Revisa el reproductor, que sea el mismo para todos.
ok lo revisare gracias luis
[...] Flash CS3: Crear un botón 3 de 6 [...]
Hola Luis, quisiera expresar que eres un verdadero Instructor de Animación…muy profesional…
La verdad es que quisiera por favor me regalaras por via Email el video de Flash Cs3: crear un boton 3 de 6, que creo es de vital importancia para aprender a elaborar el Sistema de Navegación.
Muchas gracias por la atención prestada y espero recibir respuesta positiva de su parte.
Francisco Javier: Hola!! Gracias por tus palabras!!! =) Te estoy enviando el link al video que me pediste!! Saludos!!!
Hola, estoy siguiendo todos tus tutoriales, ma parecen buenisimos para poder entender flash… queria saber si es posible obtener el video o un link de “crear un boton 3 de 6″ ya q me es muy dificil seguirlo sin poder manipularlo (pausarlo y demas)… thanx, espero tu respuesta
Joanna: Hola, si tienes Quick Time como tu reproductor principal, puedes pausarlo, adelantarlo y pararlo sin ningún problema, Saludos!!! =)
Hola luis maria, queria pedirte ayuda con algo… Tengo un boton, de uno de tus tutoriales, pero quiero que me abra un URL para lo cual le agrege este codigo
boton1_btn.addEventListener(MouseEvent.CLICK,eventoclick);
function eventoclick(event:MouseEvent) {
var direccion:URLRequest = new URLRequest(“contacto.html”);
navigateToURL(direccion);
}
pero al montarlo en Dreamweaver y ponerlo a funcionar, me abre el url en una ventana nueva y no en la misma q es lo que quiero.
Si puedes ayudarme t lo agradeceria. Bye
Joanna: Hola te respondí por correo.
Hola Luis Ma. ya casi acabo de ver todos tus tutoriales, tengo algunas preguntas, el de precarga lo hice pero cuando publico sale de inmediato la imagen de fondo, q es de 700 kb mas o menos el mismo tamaño q tu utilizaste….pero si vuelvo a publicar si comienza a cargar desde el loader… crees q he hecho algo mal? o es cuestion de q falta llenar de contenido el archivo… para q entre en el loader ??, ahora como soy nuevo en esto he borrado la barra q queda justamente arriba del stage donde me da el nombre de scene1 y la ruta y el zoom, he probado con darle reset a los workspace y nada y tambien probe reinstalando el CS4 version de prueba q tengo pero no aparece de nuevo, sabes como puedo hacer q aparezca??muchas gracias por todo esto y me has convertido en un adicto de flash….espero alguna dia poder dominarlo como tu..
hola, he estado tratando de entrar a algun tutorial tuyo pero no se puede. por ejemplo el de crear botones cs4. y el de los logos.
bye, espero funcione mejor tu web
Alex: Hola! no te apures, cuando publicas desde flash la primera vez (crtl + enter) la carga se hace automática, es decir, como se te mostró, luego hay que volver a repetir el paso de publicar con el swf abierto. (crtl + enter) para que simule la carga en Internet, en pocas palabras estás bien, no hay ningún problema. Para resetear el “workspace” lo puedes hacer desde Menú – Ventana – Resetear Espacio de trabajo y listo… Saludos!!!!
yadabril: Que raro, el sitio funciona bien… Vuelve a intentar porfavor… Saludos!
Moltes Gracies, era la edit bar q esta en toolbars q no encontraba, un saludo de un Colombiano desde Barcelona…y a ver que mas te inventas por q ya me vi todos tus tutoriales…jejejejeje
Hola Luis Maria, tengo una pregunta estoy haciendo mi primera pagina y añadiendo unos botones por medio de duplicación y haciendo unos ajustes a ella, me sale esto en la ventana de OUTPUT.
TypeError: Error #1009: No se puede acceder a una propiedad o a un método de una referencia a un objeto nulo.
at pageABC_fla::MainTimeline/frame1()
y si carga el SWF pero los botones nada… sabes q podria ser?? gracias por tu colaboración.
Alex: Hola, cuando duplicas un botón recuerda que le tienes que cambiar el nombre de instancia al botón y el código también lo tienes que duplicar, también tienes que colocar el nuevo nombre de instancia que le diste al botón duplicado… Saludos!!!
disculpa pero necesito ayuda
, siempre hago una figura y la convierto en boton y luego quiero meterle una accion presionando F9 y me dice “No se pueden aplicar acciones a esta seleccion” a que se debe?
angel: En el AS3 las acciones van sobre algún fotograma no sobre el símbolo, es decir, para comunicarte con tu símbolo tienes que colocarle el nombre de instancia y en un fotograma colocas la programación, en AS2 uno podía colocar acciones sobre símbolos! Espero aclrar tu duda! Saludos!!!
Hola LuisMa como vas?? espero sigas con la misma buena energia que se te nota con las cosas que haces…. una pregunta, es q tengo en una web varios botones como este, boton 3, pero quiero que cuando se clicke se quede en el ultimo fotograma de la etiqueta “sobre” y asi se salga del area activa no se salga de ese fotograma si y solo si hay un click en otro boton… espero me entiendas… y me puedas ayudar, mil gracias de nuevo!!!!