Animera med Drawing API

En fördel med att skapa innehåll med Drawing API är att du inte är begränsad till att placera innehållet en gång. Det du ritar kan ändras genom att behålla och ändra variablerna som används för att rita. Du kan skapa animering genom att ändra variabler och rita om, antingen över en bildpunktsperiod eller med tidsinställning.

I följande kod ändras till exempel visningen i varje bildruta (genom att händelsen Event.ENTER_FRAME avlyssnas) genom att gradantalet ökas och Graphics-objektet rensas och ritas om med uppdaterad position.

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; 
}

För att kunna skapa ett resultat som är betydligt annorlunda kan du experimentera med att ändra de ursprungliga startvariablerna i början av koden, currentDegrees, radius och satelliteRadius. Pröva till exempel med att krympa variabeln radius och/eller öka variabeln totalSatellites. Det här är bara ett exempel på hur Drawing API kan användas för att skapa visuellt innehåll vars komplexitet döljer hur enkelt det var att skapa.