This demo demonstrate how to render with different blend modes.
Press Space to toggle background, Z to change textures.
The following is a minimal code example to demonstrate different Blend Modes.
// load sprite's texture asset
let texture = await Shaku.assets.loadTexture('assets/sprite.png');
// part below goes between startFrame() and endFrame()
// -------------------------------------------------------
// sprite offset and position
let x = 1;
let y = 1;
let spriteSize = 100;
// draw alpha blend (default) blend mode:
spritesBatch.begin(Shaku.gfx.BlendModes.AlphaBlend);
spritesBatch.drawQuad(texture, new Shaku.utils.Vector2(x++, y).mul(spriteSize), spriteSize);
spritesBatch.end();
// draw opaque (no transparency) blend mode:
spritesBatch.begin(Shaku.gfx.BlendModes.Opaque);
spritesBatch.drawQuad(texture, new Shaku.utils.Vector2(x++, y).mul(spriteSize), spriteSize);
spritesBatch.end();
// draw additive (add color to dest) blend mode:
spritesBatch.begin(Shaku.gfx.BlendModes.Additive);
spritesBatch.drawQuad(texture, new Shaku.utils.Vector2(x++, y).mul(spriteSize), spriteSize);
spritesBatch.end();
// draw multiply (multiply color with dest) blend mode:
spritesBatch.begin(Shaku.gfx.BlendModes.Multiply);
spritesBatch.drawQuad(texture, new Shaku.utils.Vector2(x++, y).mul(spriteSize), spriteSize);
spritesBatch.end();
// there are other blend modes Shaku support, check out Shaku.gfx.BlendModes for more options