Semana No.6

 

Práctica para primer proyecto 


La idea es realizar una interacción de botones y clip de película para así al final conseguir un rompecabezas que será el primer proyecto final de nuestro segundo parcial.

Comenzaremos creando un archivo nuevo con los ajustes estándar 
 
Crearemos un botón al que hay que darle un nombre  y debemos ubicar justo en el ancle point.
A nuetsro botón le crearemos un Over para que en el momento en que nosotros pasemos el mouse tenga esa pequeña interacción y sepamos que se está seleccionando ese mismo. 






Crearemos un movie clip con nombre diferente, dentro de nuestro movie clip colocaremos nuestro botón y lo centaremos.
Con esto listo debemos regresar a escena y así colocar el movie clip en la escena. 
Es importante verificar la funcionalidad del botón al momento de colocarlo presionando el ctrl+enter. 




Lo que sigue es tener un poco de orden en nuestro trabajo, así que nombraremos las capas donde colocamos nuestro botón y donde colocaremos nuestros otros tres rectángulos "objetos"



Algo importante es que nombre de nuestro botón, imagen , instancia, etc. son completamente diferentes y que no debemos olvidarlo pues es funcional y muy importante para el código.
Nombraremos la instancia de nuestro botón y anotaremos su coordenadas (x/y).


Crearemos una nueva capa llamada "debajo/sobre/over) y esta ira debajo de la primera capa que hicimos y crearemos unos rectángulos debajo de los que ya hicimos en nuestro capa de objetos 


Insertaremos un nuevo clip de película donde colocaremos nuestro rectángulo y lo arrastraremos a la escena debajo del objeto que deseamos. 


Nombraremos esta nueva instancia y en la zona de "Color Effects - Efectos de Color" le pondremos alfa con porcentaje 0 para que desaparezca completamente. Este funcionaria como una capa sensible.

 
Crearemos una capa por encima de las otras dos con el nombre de "código" y lo colocaremos. 

import flash.events.*

//posicion inicial del cuadro verde

rosa1.x=533.4;

rosa1.y=405.45;

 

//al presionar arrastrar el cuadro vede

rosa1.addEventListener(MouseEvent.MOUSE_DOWN,arrastrar);

function arrastrar(e:MouseEvent){

 rosa1.startDrag();

}

 

//soltar el mouse y dejar el cuadro verde

rosa1.addEventListener(MouseEvent.MOUSE_UP,soltar);

function soltar(e:MouseEvent){

 rosa1.stopDrag();

                

// para que el cuadro verde se quede en la posicion deseada

                

                 if (rosa1.hitTestObject(sobrerosa))

 {

rosa1.x=320;

rosa1.y=157;

 }

  // si el cuadro verde no se posiciona en el lugar adecuado regresa

  else

 {

rosa1.x=533.4;

rosa1.y=405.45;

 }

}

Repaso 

17/marzo/2022

En esta clase únicamente hicimos el mismo ejercicio que la clase pasada pero por nuestra cuenta y en esta ocasión haciendo los tres botones y programándolos par que funcionen como piezas. 










TAREA

Debemos realizar la ilustración de nuestro rompecabezas y crear las piezas individualmente. 






Comentarios