mercoledì 14 maggio 2014

Come creare un'animazione

Se volete creare un videogioco o un'animazione per un vostro programma, vi servono prima di tutto una serie di immagini da sostituire in sequenza per creare l'animazione.
Io ho creato tre sequenze differenti per un personaggio: quella in cui è fermo(s1-s18), quella in cui avanza (f1-f6) e quella in cui indietreggia (b1-b6).

Mettiamo un'immagine, che chiameremo "thai" come esempio, nella nostra finestra e creiamo una  proprietà custom che contenga la cartella con tutte le sequenze dell'animazione (chiamati frame o sprite).

Esempio di sprite
Io per far prima, ho messo l'immagine e poi ho aggiunto il seguente codice:

on opencard
   put the filename of image thai into temp
   set itemdel to "/"
   put item 1 to -2 of temp into temp2
   set the cartella of image thai to temp2
   send fermo to image thai
end opencard



Poi ho scritto il codice per l'animazione quando rimane sul posto, il messaggio l'ho chiamato fermo. Ho creato una proprietà custom sprite che mi fa da contatore per l'ordine corretto delle immagini.
Se le immagini non sono tutte della stessa dimensione il baricentro si sposta e l'animazione potrebbe cominciare a muoversi, per questo è meglio memorizzare la posizione (proprietà loc) e reimpostarla dopo aver aggiornato lo sprite.
Bisogna stare attenti a creare un messaggio che chiama se stesso, non una sequenza ripetuta all'interno di un messaggio, altrimenti blocchereste il programma. Ecco il codice corretto dentro l'immagine:

on fermo
   put the cartella of me into cart
   put the sprite of me into spr
   add 1 to spr
   if spr > 16 then
      put 1 into spr
   end if
   set the sprite of me to spr
   put the loc of me into temploc
   put cart & "/s" & spr & ".png" into temp
   set the filename of image thai to temp
   set the loc of me to temploc      
   send fermo to me in 0.2 sec   
end fermo

on cancellafermo
      repeat for each line templ in the pendingmessages
      if item 3 of templ is "fermo" then
         put item 1 of templ into temp
         cancel temp
      end if      
   end repeat
end cancellafermo


Come vedete l'immagine contiene sia il messaggio da ripetere per fare tutto il ciclo della sequenza che il messaggio per bloccarlo.
Adesso aggiungiamo i pulsanti per muovere il personaggio, ecco il codice per muoverlo in avanti:

on mouseUp   
call cancellafermo of image thai
   set the stato of image thai to "avanti"   
   put the cartella of image thai into cart
   repeat for 2 times
      repeat with spr = 1 to 6
         put cart & "/f" & spr & ".png" into temp
         put the item 1 of the loc of image thai into templocx      
         put the item 2 of the loc of the image thai into templocy
         add 5 to templocx
         set the loc of the image thai to templocx,templocy      
         set the filename of image thai to temp
         wait 0.2 sec
      end repeat
   end repeat   
   send fermo to image thai   
end mouseUp


Siccome non voglio interruzioni durante la sequenza di movimento, ho usato un unico messaggio con un ciclo repeat all'interno. Ma fatelo solo se volete qualcosa che non possa mai essere interrotto. Di solito è meglio fare come nel caso della sequenza da fermo.
Usate anche lo stesso codice per il pulsante per andare indietro (basta sostituire -5 con 5) e avrete fatto.
Questo è il risultato e non c'è una riga di codice in più: