Botones y acciones en Animate

 Acciones Generales en escenas

Ya que tenemos todas las animaciones listas, es momento de probar el interactivo y ver cuáles son sus funciones principales.

Dando clic en el panel de "Control" se desplegará un menú con las opciones para la previsualización del interactivo, presionando Ctrl + Intro podremos previsualizar la reproducción de nuestro interactivo.

Al no tener ningún tipo de acción dentro de nuestro interactivo, cada escena se repetirá indefinidamente en bucle, volviendo a iniciar con la primera escena, para evitar esto, se colocarán códigos en el panel de "Acciones" que permitirán un funcionamiento adecuado de nuestro interactivo.

El primer código con el que trabajaremos será el de "Detener en este fotograma" que nos permitirá terminar de reproducir la animación en el último fotograma animado asignado.

Desplegando el panel de acciones se abrirá una hoja en blanco en que podremos insertar todos los códigos que se necesiten, es importante crear una nueva capa en la línea del tiempo para cada acción diferente que realicemos.

Posicionándonos en el último fotograma desplegaremos el panel de "Acciones" y colocaremos el primer código de "Detener en este fotograma". Para más comodidad, el panel de "Acciones" cuenta con cun apartado llamado "Fragmentos de código" , que contiene todos los códigos dentro de ActionScript, lo único que tendremos que hacer es dar doble clic sobre la acción que necesitemos y el código se colocará automáticamente en el panel de "Acciones".

Al terminar de ingresar el código, probamos el interactivo con Ctrl + Intro y la escena a la que le hayamos asignado el código deberá de dejar de reproducirse en el último fotograma asignado.

Botones

Al crear botones en Animate es importante recordar que estos requieren una especificación de tipo de símbolo diferente a las que ya conocemos, ya que este nos permitirá interactuar entre las escenas y realizará acciones específicas que nosotros le asignemos.

Se comienza realizando una forma dentro de la escena de Animate, o bien, se importan los vectores desde Illustrator.

Al presionar F8, nos desplegará el panel de "Convertir a símbolo" en donde podremos seleccionar que tipo de símbolo será nuestro vector. Seleccionaremos el tipo "botón".

Inmediatamente después de crear el símbolo, en el panel de "Propiedades" podremos ver un ícono que nos indica que es un botón y le daremos un nombre de instancia para trabajar con el al momento de asignar el código. El nombre de instancia NO debe llevar caracteres especiales ni símbolos numéricos. 

Una vez teniendo estos elementos, daremos doble clic sobre nuestro botón y en la línea de tiempo podremos ver diferentes opciones para el momento en el que interactuemos con el botón. Estas opciones se colocan como fotogramas clave que crearán un clip de película dentro del botón.

Colocaremos un fotograma clave en la interacción que necesitemos, en este caso colocaremos un fotograma clave en la opción "Sobre". Esto quiere decir que cuando pasemos el cursor sobre el botón, el botón tendrá una modificación, será una modificación de tamaño, color, etc. 

Acciones dentro de los botones

Una vez teniendo nuestros botones, deberemos asignarles acciones para que estos nos permitan interactuar con las escenas. 

Para hacer esto, crearemos una nueva capa en nuestra línea de tiempo para asignar la acción del botón, seleccionaremos el botón al que le asignaremos la acción y desplegaremos el panel de "Acciones" y "Fragmentos de código".

Dentro de los fragmentos de código, seleccionaremos la acción que deseemos, en este caso seleccionaremos "Hacer clic para ir a la escena y reproducir", que nos llevar a alguna escena específica y la reproducirá a partir del fotograma 1.

Una vez que el código esté dentro del panel, podremos ver al inicio del código el nombre de instancia que le asignamos a nuestro botón que realizara dicha acción, seguido de la acción que realizará al dar clic sobre el botón. Lo único que queda por realizar, es cambiar el nombre que aparece entre paréntesis por el nombre de la escena a la que queremos que se dirija. 

Es importante tener en cuenta que al momento de asignar acciones a los botones, y crear acciones en general, se crearán fotogramas clave, para poder ver los botones en fotogramas específicos y que estos tengan su acción dada en esos fotogramas establecidos, lo único que tendremos que hacer, es emparejar el fotograma de la acción con el fotograma clave del botón para que tengan la visibilidad y la interacción en el fotograma que nosotros le asignemos.