|
ANCORA
ANIMAZIONE.. E UN PIZZICO DI ACTIONSCRIPT
Eccoci di nuovo insieme per approfondire e affrontare altri
aspetti caratteristici di Flash5. Come già accennato,
qualsiasi oggetto grafico creato in Flash può, e in
alcuni casi deve, essere trasformato in una delle 3 tipologie
di base: Oggetto grafico, Movie Clip e Pulsante. Analizziamo
una per una queste caratteristiche di comportamento. Abbiamo
appreso nella lezione precedente che è possibile definire
una tipologia di comportamento ad un oggetto creato. Ad esempio
creiamo una forma geometrica più o meno complessa e
stabiliamo che tipologia dovrà assumere. Ma perchè
questo? Flash preferisce riconoscere alcune caratteristiche
degli oggetti limitando alcune particolarità di alcune
e avvantaggiandone altre. Ma ciò che apparentemente
sembra un limite in realtà limite non è.
Avviamo Flash5, verifichiamo che la dimensione dello Stage
sia di 550 x 400 pixel con 12 FPS e creiamo sullo stage un
cerchio di 50 pixel circa di diametro. Selezioniamolo e premiamo
F8 e la convertiamo in "Grafico". Ora, dal menu
"Finestra" + "Pannelli" + "Informazioni"
posizioniamo l'oggetto sulle coordinate X e Y rispettivamente
a 250 per X e 350 per Y.
Selezioniamo il fotogramma 30, premiamo F6, che corrisponde
alla creazione di un fotogramma chiave, posizioniamo il puntatore
su quest'ultimo selezionandolo e posizioniamo il nostro oggetto
direttamente nella finestrella delle Informazioni, 30 per
quanto riguarda X e 250 per Y. Creiamo l'interpolazione di
forma spostandoci sulla Time Line tra i due fotogrammi chiave
e col tasto destro selezioniamo "Crea interpolazione
movimento".
Ora selezioniamo il fotogramma 60 e creiamo un nuovo fotogramma
chiave con F6. Stessa procedura ma inversa, impostiamo nelle
informazioni X sempre 250 e Y 350. Creiamo l'interpolazione.
Ora dal menu selezioniamo la voce "Controlli" +
"Prova filmato". Ecco la nostra animazione a tutto
schermo che esegue a ciclo continuo un movimento. Sicuramente
sarebbero molti i parametri da ritoccare per ottenere un'animazione
più fluida e piacevole ma per ora accontentiamoci così
:-).
Chiudiamo questa sorta di anteprima e creiamo 2 nuovi livelli
dal menu "Inserisci" + "Nuovo livello".
Blocchiamo il primo con un click sul pallino in corrispondenza
del lucchetto tenendo in considerazione che se clicchiamo
direttamente sul simbolo del lucchetto bloccheremo tutti i
livelli e lo rinominiamo col nome pallina. Rinominiamo anche
gli altri 2 livelli appena creati con i nomi finale e action.
Non è obbligatorio dare dei nomi ai livelli ma bisogna
tenere presente che quando sono tanti è molto facile
confondersi e un nome aiuta moltissimo a individuare qual
è il livello su cui lavorare.
Nel livello nominato action selezioniamo l'ultimo fotogramma,
il 60 e premiamo F6. Il fotogramma è diventato un fotogramma
chiave anche se è vuoto. Ora diamo un'azione, la nostra
prima azione, a questo fotogramma. La più semplice
azione che Flash ci mette a disposizione è Stop. Selezioniamo
quindi il fotogramma 60 del livello action col tasto destro
e poi la voce "Azioni". Si aprirà una finestra
come in figura:
Sarà proprio all'interno di questa finestra che noi
andremo a scrivere il codice delle azioni di Action Script.
Questo strumento è diviso principalmente in 2 sezioni,
quella di sinistra è un elenco di azioni che ActionScript
può eseguire e quella di destra dove andremo a scrivere
il nostro codice. Per ora è sufficiente sapere che
questo strumento dispone di 2 modalità di scrittura:
Modalità normale e Modalità esperto. Dalla figura
selezioniamo la linguetta in alto a destra e impostiamo il
segno di spunta su Modalità normale.
Fatto questo, doppio click alla cartellina azzurra, a sinistra,
denominata "Azioni principali" e poi doppio click
sull'azione "Stop", oppure se più comodo,
la trasciniamo direttamente nella finestra di destra. Chiudiamo
questa finestra. Il fotogramma numero 60 del livello action
ora ha un simbolino che deve essere come quello in Figura.
Quel simbolo, una "a" in corsivo" ci indica
che in quel fotogramma è presente un'azione, in questo
caso un semplice Stop. Ora verifichiamo il tutto andando sul
menu "Controlli" + "Prova filmato". Se
tutto funziona, vedremo la nostra pallina salire verso l'alto
per poi ridiscendere e fermarsi. Ecco, abbiamo appena appreso
non solo come realizzare un'animazione ma anche come effettuare
un controllo su questa. Ora faremo qualcosa di più
complesso quindi, respirone profondo e... coraggio! :-).
Sulla Time Line abbiamo ancora un livello vuoto che abbiamo
chiamato "finale". Blocchiamo gli altri 2 livelli
col lucchetto e selezioniamo il fotogramma 60, cioè
l'ultimo, del livello "finale". Inseriamo un fotogramma
chiave con F6 e poi creiamo un quadrato di circa 30 pixel
di lato nel bordo inferiore ma verso il lato destro, facciamolo
di colore rosso. Selezioniamolo, premiamo F8 e attribuiamogli
un comportamento "Pulsante". Apparentemente non
è cambiato nulla. Con il tasto destro del mouse selezioniamo
l'oggetto appena trasformato in un pulsante e selezioniamo
la voce Azioni. Verifichiamo che sia impostata la Modalità
normale, doppio click su Azioni principali e poi sull'azione
Go To.
Essendo in modalità normale il programma interpreterà
che vogliamo fare eseguire un'azione ad un pulsante e scriverà
automaticamente a che evento dovrà eseguirla. Osserviamo
la prossima figura:
La prima riga ci dice On Release, cioè dopo aver premuto
e rilasciato il pulsante sinistro del mouse sopra al pulsante
creato, l'azione che il programma dovrà compiere sarà
quella di andare al fotogramma numero 1, gotoAndPlay (1).
Chiudiamo questa finestra e lanciamo il nostro filmato. L'effetto
dovrà essere quello di una pallina che sale verso l'alto,
poi torna giù, si ferma e lì rimane fino a che
noi non faremo un click sul pulsante rosso per poi riprendere
la corsa. Abbiamo così approfondito il concetto di
controllo su un'animazione. Questo è fondamentale per
poter appunto controllare sia le animazioni sia gli eventi.
|
