CAEmitterLayerでゲームオーバーエフェクトを実装してみる

particleEmitter = (CAEmitterLayer *) self.layer;

particleEmitter.emitterPosition = CGPointMake(0, 0);//CGPointMake(frame.origin.x, frame.origin.y);//CGPointMake(0, 0);

particleEmitter.emitterSize = CGSizeMake(frame.size.width, frame.size.height);

particleEmitter.renderMode = kCAEmitterLayerAdditive;

              

CAEmitterCell *emitterCell = [CAEmitterCell emitterCell];

emitterCell.birthRate = myBirthRate;//火や水に見せるためには数百が必要

emitterCell.lifetime = 0.5;

emitterCell.lifetimeRange = 0.5;

emitterCell.color = [[UIColor colorWithRed: 0.5 green: 0.1 blue: 0.1 alpha: 0.1] CGColor];

emitterCell.contents = (id) [[UIImage imageNamed: @"Particles_fire.png"] CGImage];

emitterCell.name = @"fire";

emitterCell.velocity = 50;

emitterCell.velocityRange = 20;

emitterCell.emissionLongitude = M_PI_2;

emitterCell.emissionRange = M_PI_2;

emitterCell.scale = 0.3f;

emitterCell.scaleRange = 0;

emitterCell.scaleSpeed = 0.5;

emitterCell.spin = 0.5;

particleEmitter.emitterCells = [NSArray arrayWithObject: emitterCell];

次にエミッターを返す部分です。

+ (Class) layerClass //3
{
    //configure the UIView to have emitter layer
    return [CAEmitterLayer class];
}

パーティクル表示中で放射方向を変えたい場合は

以下のようにします。

-(void)setEmitDirection:(float)_direction{
    [particleEmitter setValue:[NSNumber numberWithDouble:_direction]
                   forKeyPath:@"emitterCells.fire.emissionLongitude"];

}

これを外部から呼び出してやれば、

エフェクトを表示しているUIViewControllerからでも任意方向にリアルタイムで

放射方向を自由に変更出来ます。

また感の良い方なら分かるかもしれませんが

同様に色を変える場合はキーパスを以下のように指定して、

@“emitterCells.fire.color

更にバリュー値はid型に変換してあげてこのようにしてあげます。

setValue:(id)[[UIColor colorWithRed: 0.5 green: 0.1 blue: 0.1 alpha: 0.1] CGColor]

まずは簡単な主人公が死んだ時の死亡エフェクトを作りました。

死亡エフェクトは中央が白、爆発のふちになる程、赤くなるようにしました。

実際の様子が⬇です。

地味ですね。。真ん中に赤い火の玉のようなものが表示されるだけです。

いろいろ色や形を変えてみたりしました⬇

少しエフェクトっぽく見えてきたでしょうか。

以前、敵機が襲来するプログラムを作ったので

そのプログラムと合わせて実際にプレーヤーが敵機に衝突した時に

この赤いパーティクルを表示させてみました。

衝突検知はコチラでやったものを採用しています。

あと、迫力を出すために自動で縦スクロール中の背景イメージも

一旦停止させて横方向に振動させるようアニメーションしてみました。

どうでしょうか。。

動画撮影と合わせたシミュレーション上での実行結果なので

若干画面がカクカクしていますが、実機では結構滑らかに実行できていました。

Change before you have to.

androidアプリ開発、iosアプリ開発、rails、deep learning .etc.を使った社会実験。

CAEmitterLayerでゲームオーバーエフェクトを実装してみる