In questa lezione parliamo di Particle Effect, una funzione molto apprezzata di cocos2d per aggiungere degli effetti veramente interessanti ai nostri videogiochi.

Particle Effect è una funzionalità molto complessa, perché permette di modificare una quantità enorme di parametri e variabili nella gerazione del sistema di particelle, così tanti che in pratica è impossibile creare un particolare effetto agendo direttamente sul codice, perché il “guess and check” durerebbe delle ore!

Se non avete mai sentito parlare di particle effect e ancora non avete capito di cosa si tratta, questa immagine vi darà un’idea più precisa di che cosa si può realizzare:

Ma iniziamo con ordine e vediamo come si può creare un semplice effetto di particelle.

La prima informazione utile è sempre quella che riguarda la gerarchia delle classi, e vediamo alla pagina della documentazione che la classe responsabile per questo particolare effetto è la classe CCParticleSystem, subclass di CCNode!
Il fatto che sia subclass di CCNode dovrebbe farci rallegrare, perché significa che possiamo usare gli effetti di particelle in ogni caso dove è previsto l’uso di un CCNode e che tutto quello che abbiamo imparato per le azioni e gli effetti si applica anche a questa nuova classe! Potenza dell’ereditarietà!

Particle System per chi ha fretta

La libreria di Cocos2d viene fornita con una piccola serie di esempi già pronti all’uso, tutti dichiarati all’interno del file CCParticleExamples.h.

Utilizzarli è molto semplice, basterà aggiungere un’istanza della specifica classe alla nostra scena.

Per questa lezione ho creato il mio solito progetto “learnParticleEffect” ed ho sostitutito il metodo init della classe HelloWorldLayer con questo:

-(id) init
{
        if( (self=[super init])) {
        CCParticleSystem* system = [CCParticleExplosion node];
        [self addChild:system z:1 tag:1];
 
        }
        return self;
}

Con una sola riga di codice ho ottenuto questo effetto:

al posto di CCParticleExplosion avrei potuto usare una qualsiasi di queste subclass già pronte:

• CCParticleExplosion
• CCParticleFire
• CCParticleFireworks
• CCParticleFlower
• CCParticleGalaxy
• CCParticleMeteor
• CCParticleRain
• CCParticleSmoke
• CCParticleSnow
• CCParticleSpiral
• CCParticleSun

Una nota: avete notato che ho dichiarato la variabile come CCParticleSystem e non come CCParticleExplosion, questo ci permette di ragionare in termini più astratti, senza bisogni di cambiare continuamente il tipo della variabile.

Particle System per chi vuole capire

Gli undici esempi forniti da cocos2d sono soltanto pochissimi tra gli innumerevoli effetti che si possono realizzare, quindi vediamo quali sono le possibilità fornite creando una nostra subclass.

La proprietà più importante, dalla quale dipende poi la possibilità di usare alcune o altre opzioni è la proprietà

emitterType

Dalla pagina di documentazione leggiamo che può assumere due valori:

• kCCParticleModeGravity: uses gravity, speed, radial and tangential acceleration
• kCCParticleModeRadius: uses radius movement + rotation

Il primo serve per crearea emettitori di particelle che seguno “la gravità” (gravità che setteremo noi!) mentre l’altro tipo crea emettitori di particelle radiali, come CCParticleExplosion che abbiamo visto poco fa.

Sempre con uno sguardo alla documentazione notiamo una cosa interessante, molte proprietà sono affiancate da una con lo stesso nome, ma con il suffisso “var”, come speed e speedVar, startSize e startSizeVar… come mai?

In pratica possiamo scegliere non solo il valore della proprietà, ma anche la sua varianza. Ad esempio possiamo scegliere che la dimensione iniziale sia di 10 e che la sua varianza sia di 5, quindi avremo particelle di dimensione variabile da 5 a 15. Questa variabilità aiuta ad aumentare il realismo…
Pesante ad un effetto neve in cui i fiocchi siano tutti esattamente della stessa dimensione, è molto più realistico se la dimensione varia leggermente, no?

Creiamo quindi la nostra subclass di CCParticleSystem, io l’ho chiamata DEVAPPEmitter con il solito procedimento file->new->new file.

A causa delle diverse CPU che sono state utilizzate sui dispositivi apple, esistono due grandi categorie di particle emitter, una è CCParticleSystemPoint e l’altra è CCParticleSystemQuad. Senza entrare troppo nel dettaglio la nostra classe dovrà ereditare da una di queste due… ma quale?

Anche qui i ragazzi di cocos ci danno una mano, hanno previsto infatti una macro
ARCH_OPTIMAL_PARTICLE_SYSTEM che restituisce automaticamente la classe corretta… modifichiamo quindi la nostra classe in questo modo:

#import "CCParticleSystem.h"
#import "cocos2d.h"
@interface DEVAPPEmitter : ARCH_OPTIMAL_PARTICLE_SYSTEM
@end

Il metodo principale sarà questo:

-(id) initWithTotalParticles:(NSUInteger)numParticles
{
        if ((self = [super initWithTotalParticles:numParticles]))
        {
                self.duration = kCCParticleDurationInfinity;
                self.emitterMode = kCCParticleModeGravity;

                self.gravity = CGPointMake(0, -90);
       
                self.radialAccel = -90;
                self.radialAccelVar = 20;
       
                self.tangentialAccel = 100;
                self.tangentialAccelVar = 10;
       
                // speed is of course how fast particles move in general
                self.speed = 15;
                self.speedVar = 4;
       
                self.position = CGPointZero;
                self.posVar = CGPointZero;
                self.startSize = 40.0f;
                self.startSizeVar = 0.0f;
                self.endSize = kCCParticleStartSizeEqualToEndSize;
                self.endSizeVar = 0;
       
                self.angle = 0;
                self.angleVar = 0;                
                self.life = 5.0f;
                self.lifeVar = 0.0f;                
                self.emissionRate = 30;
                       
                startColor.r = 0.0f;
                startColor.g = 0.0f;
                startColor.b = 0.0f;
                startColor.a = 1.0f;
       
                startColorVar.r = 1.0f;
                startColorVar.g = 1.0f;
                startColorVar.b = 1.0f;
                startColorVar.a = 0.0f;
                
                endColor.r = 0.0f;
                endColor.g = 0.0f;
                endColor.b = 0.0f;
                endColor.a = 1.0f;
                
                endColorVar.r = 1.0f;
                endColorVar.g = 1.0f;
                endColorVar.b = 1.0f;
                endColorVar.a = 0.0f;
                
                self.blendFunc = (ccBlendFunc){GL_SRC_ALPHA, GL_DST_ALPHA};        
                self.texture = [[CCTextureCache sharedTextureCache] addImage: @"fire.png"];
        }
        
        return self;
}

Come potete vedere ho dovuto settare molte delle proprietà dell’emitter, in un modo che non aveva molto di scientifico, ma era più un “proviamo questo valore qui”… insomma se davvero vi serve un emitter non è il caso che vi mettiate a provare a crearlo via codice, ma potete usare la soluzione del prossimo paragrafo.

Particle System per chi ha capito ed ora vuole fare.

Per generare rapidamente le configurazioni per un emettitore di particelle esistono diversi software, alcuni anche per iPad, che offrono la possibilità di simulare il risultato finale senza per questo dover ricompilare.

Il tool “ufficale” (tra virgolette perché non è ufficiale) è Particle Designer, ma ne esistono veramente tante, io per questa lezione ho usato particles, perché comprato in offerta tempo fa.

Con questi programmi è facile modificare tutti i parametri e vedere live il loro effetto. Una volta creato l’emettitore che più ci aggrada, questi programmi salvano tutte le informazioni in un file *.plist, il classico formato apple.

Per poter generare un nuovo emitter basato su queste informazioni copiamo il file plist all’interno del progetto, quindi inizializziamo un’istanza della classe CCParticleSystemQuad attraverso il metodo particleWithFile, come vediamo in questo esempio:

-(id) init
{
        if( (self=[super init])) {
        self.isTouchEnabled = YES;
       
        //CCParticleSystem* system = [DEVAPPEmitter node];
        CCParticleSystem *system = [CCParticleSystemQuad particleWithFile:@"Flower2.plist"];
        [self addChild:system z:1 tag:1];
 
        }
        return self;
}

Otterremo un risultato come questo:

Questa lezione termina qui, vi lascio ai vostri particle emitters e mi raccomando… possono causare dipendenza!!

Buona programmazione
IgnazioC