Issue #414: part6: Support transparency when exporting as PNG spritesheet

Added flattenFrameAt to LayerUtils.
Added renderFrameAt to PiskelController (using flattenFrameAt)
Use renderFrameAt in PiskelRenderer (which is used for PNG spritesheet)

chore: renamed createLayerFromSpritesheet to createFramesFromSpritesheet
       (in LayerUtils)
This commit is contained in:
Julian Descottes
2016-03-09 23:37:09 +01:00
committed by juliandescottes
parent d2dc42e7cf
commit 7bf2662b66
7 changed files with 138 additions and 11 deletions

View File

@ -74,7 +74,7 @@ describe("FrameUtils suite", function() {
]);
});
it ("[LayerUtils] creates a layer from a simple spritesheet", function () {
it ("[LayerUtils] creates frames from a simple spritesheet", function () {
var B = black, R = red;
// original image in 4x2
@ -86,7 +86,7 @@ describe("FrameUtils suite", function() {
var spritesheet = pskl.utils.FrameUtils.toImage(frame);
// split the spritesheet by 4
var frames = pskl.utils.LayerUtils.createLayerFromSpritesheet(spritesheet, 4);
var frames = pskl.utils.LayerUtils.createFramesFromSpritesheet(spritesheet, 4);
// expect 4 frames of 1x2
expect(frames.length).toBe(4);

View File

@ -0,0 +1,56 @@
describe("LayerUtils test", function() {
var B = '#000000';
var R = '#ff0000';
var T = Constants.TRANSPARENT_COLOR;
var frameEqualsGrid = test.testutils.frameEqualsGrid;
var imageEqualsGrid = test.testutils.imageEqualsGrid;
var frame1 = pskl.model.Frame.fromPixelGrid([
[B, T],
[T, B]
]);
var frame2 = pskl.model.Frame.fromPixelGrid([
[T, R],
[R, T]
]);
beforeEach(function() {});
afterEach(function() {});
it("flattens a frame", function() {
// when
var l1 = new pskl.model.Layer('l1');
l1.addFrame(frame1);
var l2 = new pskl.model.Layer('l2');
l2.addFrame(frame2);
// then
var flattened = pskl.utils.LayerUtils.flattenFrameAt([l1, l2], 0);
//verify
imageEqualsGrid(flattened, [
[B, R],
[R, B]
]);
});
it("flattens a frame with opacity", function() {
// when
var l1 = new pskl.model.Layer('l1');
l1.addFrame(frame1);
var l2 = new pskl.model.Layer('l2');
l2.setOpacity(0.5);
l2.addFrame(frame2);
// then
var flattened = pskl.utils.LayerUtils.flattenFrameAt([l1, l2], 0, true);
//verify
imageEqualsGrid(flattened, [
[B, 'rgba(255,0,0,0.5)'],
['rgba(255,0,0,0.5)', B]
]);
});
});