In questa nuova lezione del nostro corso di programmazione videogame in cocos2d approfondiremo un concetto che abbiamo già incontrato nelle precedenti lezioni ma che, vista l’importanza che riveste, necessita di una lezione tutta sua: le action!

Le action pemettono di far compiere delle azioni ai CCNode presenti nella nostra applicazione, come rotazioni, ridimensionamenti a molto altro. È interessante notare che le action si applicano ai CCNode attraverso il metodo runAction: quindi possiamo indifferentemente applicare un’azione ad una sprite, ad un layer o ad un’intera scena!

La gerarchia delle classi

Per capire bene come gestire ed eseguire le action è necessario capire quali sono le classi interessate e la loro gerarchia.

La radice di tutto è la classe CCAction, che mappa il concetto generico di action. CCACtion, infatti, presenta pochissime proprietà, in quanto viene specializzata da un gran numero di sottoclassi e saranno proprio queste classi che andremo ad utilizzare.
In questo grafico vediamo il primo livello di gerarchia, con la classe CCAction e le prime sottoclassi.

Il grafo completo può essere visualizzato a questo indirizzo.

Quasi tutte le azioni che andremo ad utilizzare saranno subClass di CCFiniteTimeAction, che mappa il concetto di un’azione e che ha una durata finita nel tempo, come ad esempio uno spostamento oppure una rotazione. In particolare CCFiniteTimeAction ha due sottoclassi, la prima è CCActionInterval, mentre la seconda è CCActionInstant e dai loro nomi è chiaro che si riferiscono alle azioni che durano un certo intervallo di tempo e le animazioni che sono invece instantanee.

Le rimanenti tre classi (CCFollow, CCRepeatForever, CCSpeed) sono invece delle azioni un pò particolari, e le vedremo più avanti con degli esempi.

Prepariamo il progetto per gli esempi

Per provare alcune azioni ci servirà un progetto cocos2d dove fare un pò di esperimenti. Questo non dovrebbe più presentare problemi, se avete qualche dubbio tornate a leggere il capilo due di questo corso.

Io ho creato il mio progetto cocos2d e l’ho chiamato “learningCocosAction”.

Ho deciso in questo caso di rimuovere completamente la classe HelloWorldLayer per crearne una mia da zero, ho quindi rimosso i due file HelloWordLayer.h e .m ed ho cancellato la riga
#import “HelloWorldLayer.h” dal file AppDelegate.m.

A questo punto ho creato un nuovo file e dalla finestra che permette di scegliere il tipo di file ho scelto “cocos -> CCNode class”. Saremmo potuti tranquillamente partire anche con un NSObject, infatti partendo da questo template non è che ci sia molto in più, ci risparmiamo giusto l’import della libreria di cocos.

Ho chiamato il file BasicActionLayer e l’ho creato come subclass di CCNode.

Ora come abbiamo già visto nel progetto “Hello world” è consuetudine inserire all’interno del layer un metodo di istanza che restituisca una CCScene già allocata e con il CCLayer già inserito. Personalmente trovo questa soluzione molto comoda, ma forse un pò anomala dal punto di vista logico, preseguiamo comunque con questa consuetudine e aggiungiamo questo codice nel file BasicActionLayer.m:

+(CCScene *)scene {
    CCScene *scene = [CCScene node];
    BasicActionLayer *layer = [BasicActionLayer node];
    [scene addChild:layer];
    return scene;
}

Non dimentichiamoci di dichiarare il metodo anche nel file BasicActionLayer.h.

Fatto questo possiamo tornare al file appDelegate.m e importare la nostra nuova classe inserendo:

#import "BasicActionLayer.h"

e sostituendo l’ultima riga del metodo applicationDidFinishLaunching: con questa:

[[CCDirector sharedDirector] runWithScene: [BasicActionLayer scene]];

Se provate ad eseguire l’applicazione a questo punto, dovreste vedere solamente lo schermo nero e il contatore del framerate, questo perché nella classe BasicActionLayer non abbiamo ancora inserito nulla.

Provvediamo quindi immediatamente a caricare una semplice sprite a cui assegneremo delle action.
Importiamo la seguente immagine nel nostro progetto e modifichiamo il metodo init del BasicActionLayer in modo che crei la sprite dall’immagine:

-(id) init
{
        if( (self=[super init])) {
                        CCSprite *alien = [CCSprite spriteWithFile:@"alien01.png"];
                CGSize size = [[CCDirector sharedDirector] winSize];
                alien.position =  ccp( size.width /2 , size.height/2 );
                [self addChild: alien];
        }
        return self;
}

Questo codice dovrebbe esservi già familiare: abbiamo creato una sprite da file e l’abbiamo posizionata al centro dello schermo, il risultato sarà questo:

Proviamo le action

Non ci resta adesso che provare alcune action, guardiamo la lista di tutte le animazioni presenti alla pagina che ho linkato poco fa e decidiamo di provare una tra quelle che useremo più spesso: CCMoveTo.

Dalla documentazione possiamo vedere che ha un metodo di istanza actionWithDuration:position: e questo ci è sufficiente per creare la nostra action, modifichiamo quindi il metodo init aggiungendo semplicemente queste due righe di codice:

-(id) init
{
if( (self=[super init])) {
CCSprite *alien = [CCSprite spriteWithFile:@"alien01.png"];
CGSize size = [[CCDirector sharedDirector] winSize];
alien.position =  ccp( size.width /2 , size.height/2 );
[alien setTag:100];
        [self addChild: alien];
       
CCMoveTo *moveAction = [CCMoveTo actionWithDuration:2 position:ccp(0, 0 )];
[alien runAction:moveAction];
        }
        return self;
}

Il codice è molto semplice, abbiamo creato una istanza della classe CCMoveTo specificando la durata in secondi e la posizione da raggiungere, provate ad eseguire il progetto e vedrete la sprite che si porterà a velocità costante verso l’angolo in basso a sinistra dello schermo:

Allo stesso modo possiamo eseguire una lunga serie di animazioni, come ad esempio il blink in cui specifichiamo la durata dell’animazione e il numero di “lampeggi”.

CCBlink *blinkAction = [CCBlink actionWithDuration:2 blinks:10];
[alien runAction:blinkAction];

oppure il fadein, per far apparire l’oggetto modificando la sua opacità:

CCFadeIn *fadein = [CCFadeIn actionWithDuration:2];
[alien runAction:fadein];

Una molto carina è CCJumpTo, che permette di far eseguire alla nostra sprite dei salti che simulano la presenza della gravità. Niente di eccezionale per carità, ma l’accellerazione diminuisce man mano che la sprite raggiunge il punto più in alto per poi cambiare verso e ricominciare a crescere. Pensate solo per un attimo a quanto codice avremmo dovuto scrivere per ottenere questo risultato, mentre grazie a cocos2d il tutto si riduce a due righe di codice:

CCJumpTo *jumpto = [CCJumpTo actionWithDuration:5 position:ccp(0, 0 ) height:100 jumps:8];
[alien runAction:jumpto];

I tre parametri della funzione sono rispettivamente:

• il tempo dell’animazione in secondi
• la posizione da raggiungere
• quanto alti saranno i salti e in quanti salti verrà raggiunta la posizione finale

Un aspetto molto interessante è che le animazioni possono anche essere eseguite contemporanemante… se volte spostare la vostra sprite mentre ruota e intanto diventa trasparente non dovete far altro che creare tre azioni e poi eseguirle: la sprite (che si aggiorna ogni 1/60 di secondo) eseguirà tutte le animazioni contemporaneamente.

Ci sono alcune azioni che hanno un effetto immediato sulla sprite e sono subclass di CCActionInstant, come ad esempio CCFlipY:

CCFlipY *fliyp = [CCFlipY actionWithFlipY:TRUE];
[alien runAction:fliyp];

che una volta eseguita ribalta l’immagine lungo l’asse Y.

Modificatori

Alcune subclass di CCAction sono un pò particolari nel senso che operano come se fossero dei modificatori alle altre azioni, vediamo ad esempio CCRepeatForever. Questa classe deriva direttamente da CCAction, ma da sola è inutile. Dalla documentazione notiamo infatti che il suo metodo principale è:

+ (id) actionWithAction:(CCActionInterval *) action;

Quindi dobbiamo prima avere un’azione di tipo CCActionInterval e sarà poi questa azione che verrà eseguita indefinitivamente. Per avere un esempio basta digitare:

CCRotateBy *rotate = [CCRotateBy actionWithDuration:2 angle:360];
CCRepeatForever *rotateForever = [CCRepeatForever actionWithAction:rotate];
[alien runAction:rotateForever];

In questo esempio creiamo prima un’animazione per ruotare la sprite di 360 gradi, poi creiamo un’animazione di tipo CCRepeatForever e gli passiamo l’animazione appena creata… in questo modo abbiamo creato una sprite che ruota indefinivamente alla velocità di mezzo giro al secondo.

Tra i modificatori uno molto utile è sicuramente CCSequence, che ha la particolarità di ricevere un numero di azioni e di eseguirle in sequenza, vediamolo nell’esempio:

CCBlink *blinkAction = [CCBlink actionWithDuration:2 blinks:10];
CCSequence *actionSequence = [CCSequence actionsWithArray:[NSArray arrayWithObjects:blinkAction,rotate, nil]];
[alien runAction:actionSequence];

Provate adesso a guardare la pagina che ho linkato all’inizio di questo articolo, dove sono presenti tutte le subclass di CCAction e provate a scrivere un pò di codice per implementarle tutte.

Buona programmazione!