Disegnare in Actionscript 3.0: la classe Graphics
(scritto da , il giorno 14-03-2008 00:01)
Lavorare in programmazione significa talvolta anche disegnare attraverso la programmazione. Actionscript 3 ovviamente permette anche questo. Quello che andremo ad illustrare in questo tutorial, sarà la possibilità di disegnare forme geometriche semplici. Il tutto grazie alla classe Graphics.
Lavorare in programmazione significa talvolta anche disegnare attraverso la programmazione. Actionscript 3 ovviamente permette anche questo.
Quello che andremo ad illustrare in questo tutorial, sarà la possibilità di disegnare forme geometriche semplici. Il tutto grazie alla classe Graphics.
Prima di iniziare, facciamo una rapida introduzione rispetto al disegno tramite Actionscript 3.
Cosa sono le API? Ufficialmente potremmo dire che API è l'acronimo di: Application Program Interface, un insieme delle chiamate che consentono ad una applicazione di usare/integrare funzionalità di un'altra, cioé l'insieme dei parametri (o variabili) che un programma mette a disposizione dell'ambiente esterno per ricevere dati da elaborare o restituire i risultati delle sue elaborazioni. La conoscenza (e la documentazione) delle API di un programma prescinde dalle modalità operative dello stesso (fonte: Marketing Informatico)
Per testare i nostri lavori in quest'occasione utilizzeremo Flash CS3, scaricabile in prova gratuita a 30 giorni sul sito Adobe
Stando alla documentazione ufficiale, la classe Graphics permette di disgnare partendo da istanze della classe Movie Clip, Sprite o Shape. Ciascuna di queste classi ha una proprietà (quella che useremo appunto noi) corrispondente a tale oggetto. La classe Graphics non può avere sottoclassi.
Ovviamente le forme generate saranno sempre di natura vettoriale, con tutto ciò che il caso comporta.
Attraverso le API di disegno possiamo creare bordi e riempimenti di figure angolari (quadrati e rettangoli) o circolari (cerchi o ellissi). Colorare con gradienti o tinte uniformi.
Cominciamo disegnando una forma circolare:
var child:Shape = new Shape(); child.graphics.beginFill(0xFFFF00); child.graphics.lineStyle(5, 0xAACCFF); child.graphics.drawCircle(80, 100, 40); child.graphics.endFill(); addChild(child);
Come detto nell'introduzione, possiamo disgnare delle forme partendo da istanze della classe Shape (oltre a Movie Clip o Sprite).
Quindi con la proprietà graphics, corrispondente alla omonima classe, cominciamo a disegnare il riempimento (beginFill).
Generiamo quindi il bordo (drawCircle). I 3 valori accettati da questo metodo riguardo rispettivamente la posizione X e Y del cerchio. L'ultimo valore è il raggio del cerchio (in questo caso 40 pixel).
Chiude il tutto il metodo "endFill"
Ovviamente, una volta disegnato il cerchio, aggiungiamo la nuova forma allo stage..
Proviamo testando il nostro lavoro:

Come indicato ecco il nostro cerchio.
Ovviamente, la forma una volta disegnata è un elemento dello stage a tutti gli effetti. Possiamo lavorarlo ulteriormente, assegnarli eventi, ecc....
Vediamo ora invece come creare un forma quadrata:
var child2:Shape = new Shape(); with(child2.graphics) { beginFill(0xFF00AA, 1); moveTo(0,0); lineTo(100,0); lineTo(100,100); lineTo(0,100); endFill(); } addChild(child2);
Come vedete non differisce di molto dalla precedente, visto che fondamentalmente metodi e proprietà rimangono le stesse.
Rispetto al cerchio, per disegnare una forma quadrata, impostiamo col metodo "beginFill) colore e canale alfa.
Quindi partendo da un punto (moveTo), cominciamo a tracciare le nostre linee di disegno.
Actionscript ovviamente considera i punti come angoli di una forma comunque chiusa. Questo significa che anche omettendo un ultimo "lineTo(0,0)" prima del metodo "endFill", la forma viene chiusa ugualmente.
Commenti (0)
Registrati ed esegui il login se vuoi lasciare un commento
Scarica o stampa l'articolo "Disegnare in Actionscript 3.0: la classe Graphics" in formato PDF
Torna indietro









