This is a discussion on Disegnare con Actionscript 3.0 - script 2 within the Articoli e tutorials forums, part of the Flash CS3 e Actionscript 3.0 category; Hey !
Ecco il secondo articolo della serie disegnare con actionscript 3.0 .
Per chi non avesse letto il primo articolo ...
Questa volta utilizzo la classe Point per dare forma al disegno.
Sfondo nero e linee bianche ma è solo un altro esempio di quello che si può ottenere con il drawing API di Actionscript 3.0
Vediamo lo script...
Creo un FLA che salvo con nome ' disegno2.fla ' e gli applico il colore sfondo nero.
Creo la Document Class, un file AS che salvo con nome ' Disegno2.as ', implementata in questo modo:
Code:
package
{
import flash.display.Sprite;
import flash.events.Event;
import flash.geom.Point;
public class Disegno2 extends Sprite
{
private var clips_array:Array;
private var points_array:Array;
private var num_punti:int=100;
public function Disegno2()
{
init();
initPoints();
initDrawingListener();
}
private function init():void
{
stage.frameRate=31;
clips_array=new Array();
points_array=new Array();
}
private function initPoints():void
{
for(var i:int=0;i < num_punti;i++)
{
var xx:int=Math.random()*stage.stageWidth;
var yy:int=Math.random()*stage.stageHeight;
var point:Point=new Point(xx,yy);
points_array.push(point);
var sprite:Sprite=new Sprite();
addChild(sprite);
clips_array.push(sprite);
}
}
private function initDrawingListener():void
{
addEventListener(Event.ENTER_FRAME,drawing);
}
private function drawing(e:Event):void
{
for(var i:int=0;i < clips_array.length;i++)
{
var xx:int=Math.random()*stage.stageWidth;
var yy:int=Math.random()*stage.stageHeight;
points_array[i].x=xx;
points_array[i].y=yy;
clips_array[i].graphics.clear();
clips_array[i].graphics.moveTo(stage.stageWidth/2,stage.stageHeight/2);
clips_array[i].graphics.lineStyle(.25,0xFFFFFF,.2);
clips_array[i].graphics.lineTo(points_array[i].x,points_array[i].y);
}
}
}
}
Ecco il risultato:
Analizziamo il codice.
Proprietà:
due arrays in cui inserisco i punti della classe Points e le sprites che creo e che utilizzo per disegnare
private var clips_array:Array;
private var points_array:Array;
un numero totale di punti ( più è alto più la CPU dell' utente ne risente )
private var num_punti:int=100;
Metodi:
init();
imposto la velocità del frame rate
stage.frameRate=31;
inizializzo i due arrays
clips_array=new Array();
points_array=new Array();
initPoints();
creo un ciclo con massima iterazione pari al valore di num_points
for(var i:int=0;i < num_punti;i++)
creo due variabili numeriche che contengono n valore casuale da 0 al valore della larghezza/altezza dello stage
var xx:int=Math.random()*stage.stageWidth;
var yy:int=Math.random()*stage.stageHeight;
creo un' istanza della classe Point a cui assegno le coordinate pari al valore delle 2 variabili xx e yy
var point:Point=new Point(xx,yy);
inserisco il point nell' array points_array per tenere traccia di ogni punto
points_array.push(point);
creo un' istanza della classe Sprite
var sprite:Sprite=new Sprite();
aggiungo la sprite al DisplayObject o non sarebbe visibile
addChild(sprite);
inserisco nell' array clips_array la sprite in modo da tenere traccia di ognuna di loro e poterle richiamare
clips_array.push(sprite);
initDrawingListener();
aggiungo un intervallo ENTER_FRAME che chiama il metodo drawing() tante volte al secondo pari al valore del frame rate
addEventListener(Event.ENTER_FRAME,drawing);
drawing();
creo un ciclo con massima iterazione pari al valore della lunghezza dell' array clips_array
for(var i:int=0;i < clips_array.length;i++)
creo due variabili numeriche che contengono n valore casuale da 0 al valore della larghezza/altezza dello stage
var xx:int=Math.random()*stage.stageWidth;
var yy:int=Math.random()*stage.stageHeight;
assegno al point, che è all' interno dell' array points_array con indice dell' iterazione ciclo del momento, le coordinate pari al valore delle variabili xx e yy
points_array[i].x=xx;
points_array[i].y=yy;
pulisco le grafiche della sprite che è all' interno dell' array clips_array con indice dell' iterazione ciclo del momento
clips_array[i].graphics.clear();
inizializzo le grafiche
clips_array[i].graphics.moveTo(stage.stageWidth/2,stage.stageHeight/2);
clips_array[i].graphics.lineStyle(.25,0xFFFFFF,.2);
passo al metodo lineTo le coordinate x e y del point che è all' interno dell' array points_array con indice dell' iterazione ciclo del momento
clips_array[i].graphics.lineTo(points_array[i].x,points_array[i].y);
NB: Avrei anche potuto ' bypassare ' e non utilizzare la classe Point, assegnando direttamente al metodo lineTo i valori delle variabili xx e yy ma questo tutorial vuole spiegare come integrare la classe Point con i disegni in runtime.