Porting Photoshop blend modes to cocos2d
Published on 5/06/2012It’s fairly common for game developers to work with graphical artists who make use of Photoshop for mockups and artwork. Occasionally it’s necessary to mimic one or more of Photoshop’s blend modes to accomplish a visual effect. Thankfully, as part of cocos2d’s CCBlendProtocol we can accomplish this using the setBlendFunc method.
The setBlendFunc acts as a wrapper around OpenGL ES’ glBlendFunc and accepts two GLenum’s as parameters, like so:
GLenum src = GL_ONE; GLenum dst = GL_ONE; [sprite setBlendFunc:(ccBlendFunc){src, dst}];
There are already a number of great resources available for experimenting with OpenGL blend modes, but for ease of reference I’ve included a table of the most commonly used Photoshop blend modes and their setBlendFunc equivalents:
| Photoshop Blendmode | SRC | DST |
|---|---|---|
| Blend | GL_SRC_ALPHA | GL_ONE_MINUS_SRC_ALPHA |
| Multiply | GL_DST_COLOR | GL_ONE_MINUS_SRC_ALPHA |
| Screen | GL_ONE_MINUS_DST_COLOR | GL_ONE |
| Linear Dodge | GL_ONE | GL_ONE |
If you’ve experimented with other Photoshop blend modes using cocos2d’s setBlendFunc and have corrections or additions you’d like to make to the above table, please get in touch on Twitter @nialgiacomelli