Una de las ventajas de crear contenido con la API de dibujo es que no existe la limitación de colocar el contenido una sola vez. Los elementos dibujados se pueden modificar, conservando y modificando las variables utilizadas para dibujar. Se puede lograr un efecto de animación cambiando las variables y redibujando, ya sea a lo largo de una serie de fotogramas o mediante un temporizador.
Por ejemplo, el siguiente código modifica la pantalla con cada fotograma que pasa (detectando el evento
Event.ENTER_FRAME
), incrementa el número de grados e indica al objeto de Graphics que debe limpiar la pantalla y redibujarla con la posición actualizada.
stage.frameRate = 31;
var currentDegrees:Number = 0;
var radius:Number = 40;
var satelliteRadius:Number = 6;
var container:Sprite = new Sprite();
container.x = stage.stageWidth / 2;
container.y = stage.stageHeight / 2;
addChild(container);
var satellite:Shape = new Shape();
container.addChild(satellite);
addEventListener(Event.ENTER_FRAME, doEveryFrame);
function doEveryFrame(event:Event):void
{
currentDegrees += 4;
var radians:Number = getRadians(currentDegrees);
var posX:Number = Math.sin(radians) * radius;
var posY:Number = Math.cos(radians) * radius;
satellite.graphics.clear();
satellite.graphics.beginFill(0);
satellite.graphics.drawCircle(posX, posY, satelliteRadius);
}
function getRadians(degrees:Number):Number
{
return degrees * Math.PI / 180;
}
Se puede experimentar modificando los valores de inicialización de las variables
currentDegrees
,
radius
y
satelliteRadius
al comienzo del código para lograr unos resultados completamente diferentes. Por ejemplo, se puede reducir la variable radius o incrementar la variable totalSatellites. Esto no es más que un ejemplo de la forma en la que la API de dibujo puede crear una presentación visual cuya complejidad oculta la sencillez de su creación.
