iOS Sprite Kit - Blend Mode Effect

Question

This question builds upon the following question: How can I achieve a good fire effect with alpha blending and particles?

I want to achieve the visual effect of using SKBlendModeAdd on a black layer, but adding it to another (random) color background.

In the question posted above, it is explained how to do this: either by using an extra texture from which the alpha layer is removed or by using alpha premultiplication.

I've tried implementing both, but to no avail.

This probably has to do with the following:

A particle is a textured and colored node whose contents are blended into the framebuffer. Although there is no visible class representing particles added by the emitter node, you can think of a particle as having properties like any other object.

From Apple's Documentation

My guess is that because it's a framebuffer, the workaround solutions do not work for Sprite-Kit.

So how would I go about implementing this with SKTexture or SKSpriteNode ?

See below an example of the difference in colours between dark and light backgrounds. I would like to get the exact same colours on the light background as I get on the dark background (because on the dark background it actually looks like fire).

Answer 1

Wrapping the SKEmitterNode in an SKEffectNode allows the EmitterNode to be rendered into a framebuffer which is subsequently rendered onto the screen. I tested this out (after much push and pull of different nodes and scenes and views) and this results in the exact effect you want, where the Add blend mode is applied to a background that is not rendered onto the final scene, and the final scene's background is therefore not added to the values of the particles.

The only problem is that there is a dark outline to the "fire", but this is a result of the blended color being originally very dark (which is not noticeable against a dark background, but is very against a light background). This could be changed by refining the particle's color and various other properties, or accepted altogether.

Example:

SKEffectNode *effectNode = [[SKEffectNode alloc] init];

NSString *firePath = [[NSBundle mainBundle] pathForResource:@"Fire 3" ofType:@"sks"];
SKEmitterNode *fireEmitter = [NSKeyedUnarchiver unarchiveObjectWithFile:firePath];

fireEmitter.position = CGPointMake(CGRectGetMidX(self.frame), CGRectGetMidY(self.frame));

[effectNode addChild:fireEmitter];
[self addChild:effectNode];

The SKEffectNode renders all descendants onto a framebuffer, so it's as simple as adding the emitter as a child to the SKEffectNode. The position is arbitrary in the example.

This isn't very efficient, and there seems to be a performance problem with little else but the fire effect. Other than editing the emitter somewhat (lowering the birthrate, etc), I imagine the best way to get this effect would be a custom shader, with the downside that it would be much more complicated and not technically "SpriteKit" mechanics.