Hola, el producto final de este tutorial es la estructura de un sitio 100% funcional, animado y ligero, en este tutorial aprenderas a hacer lo siguiente:

Parte 1 – Animar un botón al estilo 2.0
Parte 2 – Crear un menú a partir del primer botón que creamos, con sus estados de “Sobre” y “Fuera” através de AS3
Parte 3 – Estructurar contenidos, cómo armarlos, animación de entrada y salida de cada contenido.
Parte 4 – Conectar el menú con el contenido, disparando las entradas y salidas animadas de cada sección.
Parte 5 – Indicar en que sección nos econtramos por medio del los botones.

Para decargar los videos en HD, archivos o verlos a través de un reproducto flash entra:
http://www.batatastudio.com/tutoriales/16-menuAvanzado/index.html

Ver Resultado Final
http://www.batatastudio.com/tutoriales/16-menuAvanzado/resultadoFinal.html

O puedes verlos desde youtube:

98 Responses to “Menú Avanzado y Secciones Animadas en Flash AS3”

  1. La verdad lo e intentado pero no lo logro
    lo que hago es crear una capa nueva en la cual en el primer fotograma introdusco este código pero no se que estoy haciendo mal me pueden ayudar luisma por favor o cualquier compañero se los agradecería enormemente

    Este es el código para que aparesca la primera pantalla de inicio:
    “solo hay que hacer lo siguiente, creas una nueva capa en el primer fotograma luego le colocas la accion de entrada del Inicio osea todo lo del else por ejemplo:

    
nosotros_mc.gotoAndPlay(“Dentro” );
    
nosotros = true;
    
nosotros_btn.gotoAndPlay(“Click” );
    
nosotros_btn.removeEventListener (MouseEvent.ROLL_OVER, sobreMi);
    
nosotros_btn.removeEventListener (MouseEvent.ROLL_OUT, fueraMi);
    
nosotros_btn.removeEventListener (MouseEvent.CLICK, clickInicio);
    
y en var inicio:Boolean = true; en AS3″

  2. hey viejo lusima a pude solucionar el problema,,,, loco muchas gracias enserio de usted ees de la persona que mas e aprendido as3 siguiendo sus tutoriales,,,

    y seria buenisima que hicieras de flash catalyst pues la verdad es dificil encontrar..

    gracias de un colombiano agradecido ajajj

  3. luis primero la vez pasada me ayudaste y no te agradeci de nuevo muchas gracias. tengo este problema hice lo de la botonera y muy bien pero en contacto cargue un swf externo y coloque este codigo en el contacto en el codigoen el else…

    else (contacto = false);
    {

    var contenedor = new Loader();
    contenedor.load(new URLRequest(“formulario_final.swf”));
    addChildAt(contenedor, 9)
    contacto_mc.gotoAndPlay (“Dentro”)
    contacto = true;
    contacto_btn.buttonMode = false;
    contacto_btn.gotoAndPlay (“Click”);
    contacto_btn.removeEventListener(MouseEvent.ROLL_OVER, sobreMi);
    contacto_btn.removeEventListener(MouseEvent.ROLL_OUT, fueraMi);
    contacto_btn.removeEventListener(MouseEvent.CLICK, ClickContacto);

    }

    y carga pero no se ocmo colocar en los otros botones para q ese swf se quite de nuevo si me pudieras agrdecer te estaria inmensamente agradecido …

  4. que buenos tutoriales, desde bogota Colombia sigo a batatastudio me parece genial esta pagina, gracias por compartir conocimiento

    un saludo

  5. jose Parra says:

    Hola Batatero Mayor te felicito de pana eres como dicen aca en mi tierra “Un Huevo” estoy aprendiendo mis conocimientos eran cero y en tan poco tiempo con tus tuto me atreveria a realizar una trabajo de ese tipo…!!!

  6. Batata Studio says:

    Abel Carrera: Gracias por re publicar la solución y claro que seguiré haciendo videotutoriales de flash en español!! :)

  7. Ok Luis, lo encontré y ya lo apliqué… Muchísimas gracias…
    y gracias también al amigo Santiago que compartió con todos este código y ahora lo vuelvo a publicar para que otros también lo puedan ubicar…Gracias y por favor no dejes de seguir haciendo mas videos…!!!

    Este es el código para que aparesca la primera pantalla de inicio:
    “solo hay que hacer lo siguiente, creas una nueva capa en el primer fotograma luego le colocas la accion de entrada del Inicio osea todo lo del else por ejemplo:

    
inicio_mc.gotoAndPlay(“Dentro” );
    inicio = true;
    inicio_btn.buttonMode = false;
    inicio_btn.gotoAndPlay(“Click” );
    inicio_btn.removeEventListener (MouseEvent.ROLL_OVER, sobreMi);
    inicio_btn.removeEventListener (MouseEvent.ROLL_OUT, fueraMi);
    inicio_btn.removeEventListener (MouseEvent.CLICK, clickInicio);

    
y en var inicio:Boolean = true; en AS3″

  8. Batata Studio says:

    Abel Carrera: Hola, en los comentarios esta la solución, te pido de favor que lo busques, saludos! :)

  9. Hola LUIS, gracias por los excelentes tutoriales la verdad son buenísimos, el motivo de mi pregunta es por que quiero que la primera pantalla osea la de NOSOTROS paresca automaticamente al abrir todo el archivo, Se podra????
    Ojala puedas ayudarme, gracias.

  10. Luisma…como dirian los españoles..eres la leche…mis respetos hermano..contigo aprendo mas rapido que yendo a un curso de flash…Espero y continues haciendo mas tutos…

  11. Hola Luis Maria primero que nada, muchas gracias por tus trabajos son muy buenos no cabe duda que eres un master es esto, una pregunta, bueno apenas estoy empezando a utilizar flash tengo conocimientos vagos pero mi duda es esta, como puedo insertar tomando el ejemplo de este tutorial la pagina swf que sea compatible con un html? por ejemplo que cuando le de click al botón que dice servicios me enlace a una pagina html si se puede?

    Bueno esta es la duda que tenia muchas gracias y saludos que estés de lo mejor.

  12. Batata Studio says:

    roma: Hola, el flash cs5 tiene por defecto un cargador pre instalado, esos puntitos con el cargador y puede ser que este muy pesado tu swf y por eso no se vea, tengo un tutorial donde explico como quitar esa función. Saludos!

  13. Que tales muy buenos tus aportes en verdad ayudan bastante a los que kieres siertas guias para iniciarce en esto .
    Bueno kisiera pedirte si no es muxa molestia unnos tips basicos de como hacer una web similar a esta : http://www.diversionenquilmes.net/cuerpo_2.php
    no igual pero si hacer algunnos efectos el del footer que es como una especia de carrucel y el de la galeria de fotos del menu principal.
    Se agradece cualkier apoyo basico .
    Mucha suerte ;)

  14. Que onda esta de lo mejor tu tutorial
    apenas estoy empezandoy espero que me salga al 100%
    gracias
    SALUDOS¡¡

  15. heres una maquina Luis. Pedazo de tuto te has marcado.
    Mi duda es como hacer funcional el formulario mail. osea cual es el codigo para que funcione.
    muchas gracias y sigue asi

  16. Hola luisma, era una maquina, padazo de tutorial que te has marcado.
    Mi pregunta es que como hago para que le formulario funcione, osea que codigo hay que añadir para hacerlo funcinal. gracias

  17. Muchisimas Gracias por los tutoriales…Ojala sigan haciendo mas porque aprendo mas con ustedes que en el instituto a donde voy….
    Un saludo desde Colombia

  18. Hola,
    y antés que nada agradecer muchisimo todos los tutoriales, no tenia ni idea de flash y ay voy haciendo cositas gracias a ti. Solo una cosa, he tenido que modificar algo el código(tú proyecto funciona perfectamente) y he tenido que cambiar el bloque del condicional porque en el else me daba un error. Lo he cambiado por else if (en la mayoria de lenguajes que si pones else no colocas ninguna condición) y la comparación he tenido que poner “==” para que la compare. No se si el poner solo un = realiza la asignación.
    De echo aún no me funciona, pero seguro que habré dejado alguna cosa y estoy en ello.

    Me extraña mucho el haber tenido que hacer estos cambios cuando tu proyecto funciona bien.

    Por si le pasa a laguien más.

    Trabajo con cs5.

    saludos y mil grácias

  19. gracias estava chevere

  20. Hola Luis Felicitaciones por tus tutoriales estan buenisimos y muy utiles.

    y bueno te tengo una pregunta hice una pagina siguiendo esta solo que le adite el formulario del otro tutorial y un submenu en servicios al exportarlo no me arroja ningun error, tambien lo puedo ver en el html y en dreamweaver, pero cuando lo subo al servidor remoto me salen 3 puntos suspensivos moviendose como si fuera un cargador y no me aparece la pagina, sabes a que se debe esto?

  21. hola luisma, necesito saber si es posible que al comenzar la animacion inicie de entrada el formulario de nosotros. gracias

  22. Hola Luid M. un saludo cordial desde PERÚ, pues ante todo agradecerte por los tutoriales que realizas con el fin de apoyar a los que empezamos en este mundo de animación flash.
    Mi consulta es como podría hacer que en un botón me salga otra ventana pequeña mostrando algun contenido algo asi como una ventana emergente y que el contenido que se muestra de fondo baje su opacidad o este de un color un poco mas oscuro.
    Y que la ventana emergente tenga un botón de cerrar X para tal fin y que la ventana de fondo se muestre normalmente. Gracias ante todo

  23. hola luis mira yo segui tu guia pero tengo 1 problema , q es cuando hago la parte del tutorial parte 4 se me abren todos los botones y no se como pararlos osea nisiquiera tengo q poner el mouse en los botones q se abren todos al mismo tiempo alguna sugerencia para ese problema? ya q la primera vez lo hice con 4 botones osea a los 3 q tiene el tutorial le agregue uno mas , y despues lo hice con el archivo q vos publicaste y me sigue saliendo el mismo problema . desde ya muchas gracias y agradecido por los tutoriales
    DESDE LA JUNGLA digo Argentina mis salu2

  24. Luis Maria! Sos un genio! Por fin pude terminar el sitio!!! No lo puedo creer. Realmente como decis en el tutorial, es ORO!. Muchisimas Gracias por tu ayuda. Solamente me queda averiguar como subirlo jajaja

  25. Muchisimas gracias luisma y Santiago , Luisma muchisimas gracias por todo el apoyo y por mermitirme agradecerte publicamente saludios!!

  26. Batata Studio says:

    Gabriel Vega: Hola! Sí puedes hacer referencia a mi sitio desde el tuyo, eso esta bien! :)
    En este mismo post busca el comentarios de “Santiago” ahí esta la respuesta a tu pregunta :)
    Saludos!

  27. Batata Studio says:

    Santiago: Hola! Va de nuevo, La variable del contenido ponla en “True”. Al botón inviertele el add por el remove. Debajo de todos los listener de Over y Out, coloca “nosotros_mc.gotoAndPlay(“Dentro”);” así como el estado de “click” del botón y listo, a grandes rasgos eso es.. Saludos!

  28. Batata Studio says:

    alvaro julian lopez arcos: Hola eso no es flash, pero se puede hacer algo similar en flash, Saludos! :)

  29. Batata Studio says:

    roberto: Hola! Para eso hago los tutoriales! Para que los regreses las veces que sea necesario y te salga… esa es mi ayuda…

  30. Hola que tal Luisma un saludo nuevamente desde Guadalajara,agradeciendo nuevamente tus enseñanzas Maestro de mestroa y con unos pequeños detalles, tenia una duda sobre como hacer que apareciera uno de los contenidos al cargar el menu, la misma duda que tenia luis en un comentario que hizo a lo cual le pediste que buscara la respuesta en el blog, te suplico me perdones o me mandes un zape!! pero busque en el blog y no pude encontrar la respuesta,el segundo punto es que quisiera ver si puedo utilizar ya sea tu logo o el nombre de batata studio en la pagina que estoy realizando esto solamente como un agradecimiento por todo lo que he aprendido gracias a tus tutoriales haciendo una mencion de que el sitio fue creado gracias al apoyo de batata studio, nuevamente gracias y disculpa que te moleste con algo que como tu comentaste te preguntan muuuyyy seguido .

  31. Luisma, ahi encontre el comentario que explica a mi pregunta. lo pego a continuacion para que el prximo no este tanto tiempo buscando…
    No seria de mucha ayuda para los usuarios y para vos hacer una pestaña de preguntas frecuentes??? ojala se pueda.
    Saludos amigo! Muchisimas gracias…

    “solo ay q hacr lo siguiNT, creas una nueva capa en el primer fotograma luego le colocas la accion de entrada del Inicio osea todo lo del else por ejemplo:
    inicio_mc.gotoAndPlay(“Dentro” ); inicio = true; inicio_btn.buttonMode = false; inicio_btn.gotoAndPlay(“Click” ); inicio_btn.removeEventListener (MouseEvent.ROLL_OVER, sobreMi); inicio_btn.removeEventListener (MouseEvent.ROLL_OUT, fueraMi); inicio_btn.removeEventListener (MouseEvent.CLICK, clickInicio);
    y en var inicio:Boolean = true; en AS3″

  32. Hola luisma, estuve buscando por todos lados sobre la pregunta que hace luis y que anteriormente hizo cristian. Como hacer que el contenido de un botón cargue al entrar al sitio??? No puedo resolverlo, tengo el sitio terminado con y has sido mi gran maestro en esto. Te pido que me orientes donde buscar esa respuesta y te estaré eternamente agradecido.
    Saludos y mil gracias!!!

  33. Luis sobre la pregunta de como cambiar una imagen al pasar al raton y que vuelva a su estado al quitar el raton seria amanera de ejemplo algo asi como lo que hay en esta pagina:
    http://www.sillyfarm.com/store/index.php?p=catalog&parent=343&pg=1

    le pasas el cursor a un articulo y se agranda y cuando lo quitas vuelve a su estado normal

    ahora bien yo he hecho mi pagina y creo que es un desastre le falta mucho y me gustaria si me podrias oreintar a un rediseño para que se vea impactante o si lo puedes hacer tu y cuanto me cobrarias?

  34. hola oye he estado viendo tus tutorialesy son de gran ayuda, oye tengo una duda he estado haciendo un submenu pero la neta no me queda podrías ayudarme?

  35. Batata Studio says:

    luis: Hola, espero que estés bien! Te pido de la manera más atenta que leas los comentarios que ahí viene la respuesta, Saludos!

  36. hola como hago para que se carge el contenido para que no se vea hueco el area de contenido. osea que el boton ya este activado y con el contenido ya en ele centro..gracias

Leave a Reply