Un poco de movimiento…
Para quienes se inician en el mundo del Flash, llegar a mover un objeto a través del escenario puede encender esa chispa que los llevará a profundizar en conceptos mucho más interesantes. Así se comienza… y -por suerte- nunca se termina. Pues, siguiendo el enunciado del viejo Niklaus E. Wirth (creador del lenguaje Pascal) de que “la programación normalmente se enseña a través de ejemplos”, intentaremos ir paso a paso para que puedan descubrir cómo el Adobe Flash permite programar en pocas líneas lo que demoraríamos en diseñar utilizando inclusive interpolación de movimientos.
Para no poner las cosas difíciles en este código, comenzaremos dibujando un cuadrado que acotaremos con la herramienta Selección para convertirlo en un triángulo isósceles, como se muestra en el objeto de la derecha de la figura. Luego lo convertimos en un MovieClip llamado triangle, con punto de registro central y hacemos doble clic sobre él para editarlo. Dentro del MovieClip, insertamos un nuevo fotograma, donde rotaremos la figura en un ángulo de 180° (Ctrl+Alt+S). En este punto podemos probar la película Flash (Ctrl+Enter) para ver los cambios realizados hasta el momento.
Como pueden observar, nuestro MovieClip no hace más que reflejarse horizontalmente a una frecuencia de 12 cuadros por segundo. Eso quiere decir de que es hora de que pongamos manos a la obra, poniendo nuestros dedos en el teclado para escribir stop(); en ambos fotogramas del MovieClip triangle. Sería suficiente hacerlo sólo en el primero para detener el giro automático de la figura, pero ya veremos más adelante por qué redundamos en este caso.
El _root es el MovieClip raíz sobre el que se sitúan todos los elementos que insertamos en una película Flash. Se hace énfasis en esto porque a partir de ahora, todo el código que escribamos estará contenido en el _root. Quienes no lo hayan hecho aún, deben irse olvidando de escribir libras de código en diferentes MovieClips por todo el escenario. Tal desorden no contribuye ni a la limpieza ni a la reusabilidad. Por suerte, todas las instancias pueden ser referenciadas desde allí sin problemas. Pero debemos acostumbrarnos a nombrar cada instancia que creemos a partir de cualquier objeto en la ventana Propiedades. Ahora nombraremos triangleA a la instancia del MovieClip que hemos creado, nos paramos en el primer fotograma del _root y escribimos lo siguiente:
var velocity:Number = 5;
// Ajuste del límite izquierdo y derecho del escenario
var limit_left:Number = triangleA._width / 2;
var limit_right:Number = Stage.width - (triangleA._width / 2);
triangleA.onEnterFrame = function():Void {
// En cada frame del triángulo, ejecutar la función:
triangleA._x += velocity; // Velocidad constante en el eje X
if(triangleA._x <= limit_left || triangleA._x >= limit_right){
// Si la punta del triángulo toca los límites del escenario:
velocity *= -1; // Invertir la dirección del movimiento
triangleA.play(); // Avanzar al siguiente fotograma del triángulo
}
}
Como pueden analizar, no se permitió que el punto de registro de triangleA llegara a la posición Stage.width, porque al estar el MovieClip padre registrado en el centro, la mitad de su contorno se saldría del escenario. Para resolver este problema inherente a la mayor parte de las películas que contienen este tipo de movimiento, sumamos algebraicamente a las posiciones límites en el eje X de ambos lados del escenario la cantidad triangleA._width/2, correspondiente a la mitad del ancho de dicha instancia.
Este ejemplo se puede complicar cuanto deseemos, no sólo por describir alguna movimiento mucho más complejo, sino porque podemos dibujar el MovieClip a base de códigos, utilizando los métodos de la clase flash.geom.Rectangle, flash.geom.Transform y flash.geom.ColorTransform. ¿Se atreven a dar ese salto?
Para saber más…
Escrito por ZorphDark [blackhat4all@gmail.com]
