Animiamo i nostri giochi

Abbiamo imparato come caricare e mostrare porzioni di un immagine su schermo, per i nostri giochi, grazie all'articolo precedente sui font bmp.

Ora parliamo anche di come possiamo animare la grafica dei nostri giochi, dando maggior vita alle nostre creazioni.

Il principio di disegno e' sempre lo stesso gia' visto nello scorso articolo, con lievi differenze per poter rendere il tutto piu' semplice e pratico ed avere un buon effetto all'occhio.

Le animazioni nei giochi 2D, sono come i cartoni animati, tanti fotogrammi diversi in cui si esprime un cambio di stato graduale della scena, in questo caso il cambio e' solo del soggetto.

Un esempio pratico, lo si puo' avere dall'immagine in cima, visti cosi' i fotogrammi potrebbero sembrare completamente privi di senso, ma mostrati sequenzialmente, uno dopo l'altro con il giusto tempismo, daranno al giocatore l'impressione che il personaggio si stia muovendo.

Ma dopo le ovvieta', passiamo alla parte pratica dell'articolo, potete tranquillamente aggiungere la funzione qui sotto al sorgente della volta scorsa, oppure inserirla in una struttura base da zero, non sono richieste altre funzioni particolari di disegno per il corretto funzionamento del tutto.
void getSprite(SDL_Surface *src, SDL_Surface *dest, int x, int y, int w, int h)
{
static int index = 0;
static int delay = 10;

SDL_Rect pick;
pick.x=index*w;
pick.y=0;
pick.w=w;
pick.h=h;

SDL_Rect area;
area.x=x;
area.y=y;
area.w=w;
area.h=h;

SDL_BlitSurface(src,&pick,screen,&area);

if(delay < 1)
{
delay = 10;
if(index>=2)
index = 0;
else
index++;
}
else
delay--;
}
Avendo dichiarato prima, una superficie idonea a contenere la nostra sequenza di animazioni (sprites sheet), copieremo da quest'ultima sulla nostra superficie principale, un frame alla volta delle dimensioni specificate e alle coordinate passate in argomento alla funzione.

La funzione ogni circa 10 millisecondi, incrementa un indice interno, quest'ultimo moltiplicato per la larghezza di un singolo frame, diventera' il punto di inizio da cui prelevare l'immagine, come si puo' vedere dalla riga seguente:
pick.x=index*w;
Per questo motivo, l'unica premessa richiesta al giocatore, e' quella di avere tutti i frame posti orizzontalmente nell'immagine.

Durante il suo ciclo, controlla che l'indice non sia andato oltre il numero massimo di fotogrammi presenti nell'immagine, in questo caso staticamente ma si potrebbero anche specificare in argomento per rendere la cosa piu' pratica e utile, se viene superato questo limite massimo si riparte da zero e il tutto continua.

Il tempo di attesa fra un frame e l'altro, e' mantenuto costante dalla nostra classica funzione di gestione degli fps, di cui ho gia' parlato e utilizzata in precedenti articoli.

Questa e' la maniera piu' comune di gestire le animazioni che abbia potuto vedere e trovare in giro per la rete, e oltre tutto molto pulita e veloce, anche se si potrebbe fare di piu'.

Si potrebbe ad esempio, avere uno sprite sheet alla maniera di RPG Maker 2000 e caricare le varie porzioni d'immagine come si e' fatto per i font, magari specificando la sequenza di animazione tramite stringhe alfanumeriche, che potrebbero dare molta piu' liberta' al programmatore sul da farsi.

Per ora provate a smanettare un po' con l'esempio di questo articolo e divertitevi, avremo tempo di ritornare sull'argomento animazioni e grafica pian piano.

Nessun commento :

Posta un commento

Related Posts Plugin for WordPress, Blogger...