Actionscript 3.0 for beginners: lesson #1
venerdì 8 agosto, 2008Premessa
Actionscript 3.0 può rappresentare un buon punto di partenza per impratichirsi, chi non è pratico di programmazione C e/o C++, di programmazione orioentata agli oggetti (OOP). Inoltre, questa serie di lezioni, saranno utili a chi proviene da altri ambienti o da precedenti versioni di Flash.
Impostare un progetto
In questa prima lezione vedremo come impostare un progetto Flash CS3 generico. È bene utilizzare i progetti quando si prevede di avere a che fare con almeno più di un file. L'uso dei progetti è stato introdotto - da Macromedia - già nelle versioni precedenti alla CS3, quindi dovrebbere essere argomento noto anche a sviluppatori Actionscript 2.0.
Comunque sia con Actionscript 3.0 - come vedremo - è possibile associare un file Actionscript (.as) al documento-filmato principale, il nostro .fla per intenderci. Questa caratteristica è molto utile e rende un progetto anche minimale composto da almeno due file: il .fla e .as associato. Per questo motivo è bene "sempre" partire da un progetto, così da organizzare sin da subito i vari file (.fla, .as, ...) che faranno parte del nostro "pacchetto" di sviluppo.
Inoltre, una volta acquisita la dimesticazza con la filosofia ad oggetti, instrinseca in questo tipo di linguaggio, sarà normale ritrovarsi con numerosi file, anche per progetti sostanzialmente semplici.
Un progetto Flash è un contenitore virtuale (i file .flp sono file testo in formato XML con l'elenco dei file da caricare) che riunisce, in modo organizzato, tutti i file del nostro progetto.
-
<flash_project name="mioprogetto" version="1">
-
<project_file path="./mioprogetto.fla" filetype="fla" profile="" def_file="true" />
-
</flash_project>
Sarebbe possibile benissimo gestire più file singolarmente, tuttavia un progetto Flash propone una serie di caratteristiche che rendono alcune operazioni più semplice e automatizzate, come la compilazione e il salvataggio di tutti i file che compongono il progetto.
Nota: se avete installata una suite completa, quindi con Dreamweaver o Adobe Version Cue, tramite i progetti potrete usufruire di tutta una serie di features altrimenti non disponibili, come il collegamento diretto ai siti realizzati tramite Dreamweaver - con tutte le impostazioni per FTP - o al versioning.
Prima di creare effettivamente il progetto è bene preparare in modo oppurtuno il filesystem, ovvero le cartelle che conterranno i nostri file. Normalmente si crea una cartella del nostro progetto e, nel caso più semplice (quello che vedremo in questa prima lezione) ciò è sufficiente!
La creazione di un progetto avviene da menu File->Nuovo o dalla pagina di benvenuto:
Verrà chiesto di salvare un file, ad esempio mioprogetto.flp. Salviamo questo file nella cartella che abbiamo precedentemente preparato.
A questo punto possiamo aggiungere il filmato principale, sempre dal Menu File->Nuovo:
Salviamo questo file (.fla) con un nome, ad esempio mioprogetto.fla. A questo punto, ancora, il progetto non è a conoscenza del nostro file filmato. Dal pannello Progetto selezionare l'icona 
"Aggiungi file al progetto" e selezioniamo il nostro mioprogetto.fla:
Un progetto Flash permette di aggiungere un numero qualsiasi di file .as e .fla. Alcuni progetti, infatti, sono composti da più file "filmato" (.fla), caricati runtime da un filmato principale. Per questo motivo bisogna indicare quale, tra i file filmato presenti nel progetto, è quello di default, cioè quello che verrà eseguito in design-time alla selezione della voce "Prova filamato".
Nota: se nel progetto è presente un solo filmato Flash potrebbe selezionarlo come "predefinito" in automatico... tuttavia questa features è sfuggita, per ora, agli sviluppatori Adobe.
Selezioniamo quindi il nostro filmato e dal menu contestuale selezioniamo (indichiamo) "Imposta come documento predefinito".
L'icona del nostro filmato cambierà, indicando che quel filmato è il principale.
Apriamo ora il filmato principale, nella finstra delle proprietà, in basso, noteremo la prima differenza rispetto alle precedente versioni di Flash: Classe documento.
La classe documento non è necessaria per far funzionare il nostro filmato. Come accadeva "un tempo", si potrebbe inserire il codice direttamente nel primo frame del filmato stesso. Tuttavia, usare la classe documento, rende il nostro progetto estremamente più chiaro, svincolando il codice dal filmato vero e proprio. La classe documento, infatti, è un vero e proprio file .as esterno. In questo modo possiamo anche riutilizzare tale classe per altri filmati senza dover "copiare e incollare" codice da frame a frame.
Per aggiungere una Classe documento e suffciente selezionare dal menu File->Nuovo:
Inseriamo il seguente codice/template:
-
package {
-
/**
-
* Class Documento for mioprogetto
-
*
-
*
-
* @class MioProgetto
-
* @author Giovambattista Fazioli
-
* @email g.fazioli@undolog.com
-
* @web http://www.undolog.com
-
* @version 1.0
-
*
-
*/
-
import flash.display.*;
-
import flash.events.*;
-
//
-
/**
-
* Class constructor
-
*/
-
public function MioProgetto ():void {
-
// todo
-
}
-
}
-
}
Salviamo come "MioProgetto.as" e aggiungiamo questo file al progetto:
Nel campo testo "Classe documento" delle proprietà del filmato principale che abbiamo visto prima inseriamo "MioProgetto":
Clicchiamo sull'icona 
, se tutto è corretto si aprirà nell'editor la nostra classe Documento.
Classe documento
Possiamo verificare il nostro progetto dal bottone "Prova progetto" del pannello progetti:
Inseriamo nel costruttore della Classe documento il seguente codice:
-
/**
-
* Class constructor
-
*/
-
public function MioProgetto ():void {
-
trace( 'Avvio progetto' );
-
}
Questo sarà il codice relativo all'avvio del nostro filmato, quello - insomma - che "un tempo" si inseriva nel primo frame! Ciò significa che qualsiasi istanza di MovieClip, TextFiled o Component inseriti nel filmato principale, saranno visibili a questa Classe. Nella prossima lezione realizzeremo il classico gioco Tic Tac Toe (in onore anche al citato WarGames) così da vedere in dettaglio ulteriori caratteristiche della Classe Documento.
I temi neri li vedevo bene 10 anni fa! 
Ciao, Emanuele
come darti torto…
Simple Flash Project Generator 0.5: una AIR application per Flash | Undolog.com ha detto:
[...] Actionscript 3.0 for beginners: lesson #1 abbiamo visto i passi necessari per la creazione di un progetto in Flash CS3. Così mi è venuta [...]
Actionscript 3.0 for beginners: lesson #2 | Undolog.com ha detto:
[...] Come promesso ecco la seconda lezione su ActionScript 3.0! Oggi inizieremo l’analisi di un semplice progetto che riproduce il giochino del Tris o Tic Tac Toe. Ho cercato di inserire in questo esempio alcune caratteristiche particolari di ActionScript 3.0, cercando di dare spazio alla comprensione e non allo stile. Ne segue che se avessi dovuto scrivere il “gioco” davvero, probabilmente l’avrei strutturato in modo assai diverso, ma in questo caso ho cercato di mediare tra una classica programmazione compatta ed ermetica con una maggiormente comprensibile per i neofiti. Ho realizzato un’unica classe documento, procedura non necessaria ma utile per rimanere in linea con la precedente lezione. [...]
Oibaf ha detto:
ciao Giovambattista, mi sembra un tutorial molto interessante ma che non hai nemmeno iniziato l’ultima fase della avvio progetto dove lo inserisco sempre nel mioprogetto.as? aggiungendo a quello scritto precedentemente? Mi piacerebbe capire come realizzare un sito internet in as3 con pulsanti e pagine e nient’altro spero che tu possa aiutarmi grazie mille
Giovambattista Fazioli ha detto:
@Oibaf: non ho capito bene la prima parte del tuo commento.
dosa85 ha detto:
Ciao. Complimenti per il bel tutorial. Comunque avevo una domanda, ma il secondo script della prima lezione dove andrebbe messo di preciso?!?!?!? thank
Giovambattista Fazioli ha detto:
@dosa85:
Il secondo script è una porzione del primo, a titolo di esempio. Corrisponde al costruttore.
dosa85 ha detto:
L”errore: 1013: L’attributo private può essere utilizzato solo nelle definizioni delle proprietà di classe.
Giovambattista Fazioli ha detto:
@dosa85:
Quest’errore può dipendere da vari fattori. Sei sicuro di aver seguito tutto in modo corretto? In caso mandami per email lo ZIP di quello che hai fatto, così vediamo perchè non ti funziona.