好吧,我有多行的 spritesheet,让我们假设它包含 3 行图像,这些图像如下所示:
x, x, x, x, // moving animation images
x, x, x, x, // jumping animation images
x, x, x, x, // dying animation images
所有图像插槽的高度和宽度均为 80 像素,它们在 spritesheet 中彼此紧密堆叠,并且它们的中心将位于图像的中间,我使用的实际字符大小是 40 像素(宽度和高度),所以它是regX: 40
和regY: 40
spritesheet img 大小将是 320px 宽度和高度。(因为 80px * 4 = 320px 的四个插槽)。
我会像这样访问它们:
var localSpriteSheet = new createjs.SpriteSheet({
images: [imgPlayer],
frames: {width:80, height:80, regX:40, regY:40},
animations: {
moving: [0,3],
jumping: [4,7],
dead: [8,11]
}
});
我想你在这里看到了模式,例如,起始数字jumping
是 4,因为瓷砖编号从 0 开始。
因此,上述 tilesheet 的实际插槽如下:
0, 1, 2, 3, // moving animation images
4, 5, 6, 7, // jumping animation images
8, 9, 10, 11, // dying animation images
希望这对您有所帮助 - 您只需要观看动画“移动”的 spritesheet 起始位置并使其从该位置开始。
// takes 4 images from first line
move: [0, 3]
// takes 4 images from second line (If spritesheet has 4 images on each line).
jump: [4, 7]
希望这可以帮助!