- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个小问题,我使用的是多行 Spritesheet,其中每一行都是图像序列。
但是我无法让 Sprite 表从不同的高度开始(因此它可以向下移动),它们都从顶 Angular 开始
var spriteSheetUp = new createjs.SpriteSheet({
// image to use
images: [snakeI],
// width, height & registration point of each sprite
frames: {width: 96, height: 90, regX: 0, regY: 290},
animations: {
move: [0, 3, "move"]
}
});
我希望上面的内容开始使用像素 290 处的帧。
提前致谢!
最佳答案
好吧,我有多行 Sprite 表,让我们假设它包含 3 行带有如下 Blob 的图像:
x, x, x, x, // moving animation images
x, x, x, x, // jumping animation images
x, x, x, x, // dying animation images
所有图像槽的高度和宽度均为 80px,它们在 spritesheet 中紧密地堆叠在一起,它们的中心将位于图像的中间,我使用的实际字符大小是 40px(宽度和高度),所以它是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]
}
});
我想你在这里看到了这个模式,例如跳跃
的起始编号是4,因为图 block 编号从0开始。
所以上面的图 block 表的实际插槽是这些:
0, 1, 2, 3, // moving animation images
4, 5, 6, 7, // jumping animation images
8, 9, 10, 11, // dying animation images
希望这对您有所帮助 - 您只需观察动画的 Sprite 表起始位置“移动”并使其从该位置开始。
// 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]
希望这有帮助!
关于javascript - EaselJS 多行 Spritesheet,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15276525/
我正在尝试水平翻转 SpriteSheet 动画中的 Sprite 。我从this example开始 我在创建SpriteSheet后立即添加了翻转的帧 var ss = new creat
我正在尝试水平翻转 SpriteSheet 动画中的 Sprite 。我从 this example 开始 我在创建 SpriteSheet 后立即添加了翻转帧 var ss = new cr
是否可以使透明rect可点击? 我不想填充它,所以看起来像 shape.graphics.setStrokeStyle(2).beginStroke("#000").rect(0, 0, 1
如何在createJS中绘制圆弧。我已经经历过 arcTo 函数,但这不是我想要的。我希望能够绘制几条弧线,这些弧线放在一起时类似于一个圆。例如:我希望能够使用 8 条弧线绘制一个圆。无法使用 Arc
当我尝试使用时: temp = new createjs.Bitmap(obj.path) 我收到错误: Uncaught An error has occurred. This is most li
我正在用 EaselJS 制作一个旋转矩形,但它不像我想的那样工作。 我认为,如果我想制作一个围绕其中心在 x=100, y=100 位置旋转的正方形 (40x40),我需要将它的注册点设置为 reg
我在使用 EaselJS 时遇到了困难。基本上我想创建一个简单的网格并突出显示所选的实际元素: var stageWidth = 800, stageHeight = 600, cell_
我最近发现了EaselJS,我正在尝试制作一个非常简单的 Canvas 射击游戏。 我的 Canvas 宽度为 500 像素,高度为 500 像素。 当用户的鼠标进入 Canvas 时,目标会随着鼠标
我正在使用 EaselJS SpriteSheets,我想知道如何让我的英雄停止平稳运行,因此,如果 SpriteSheet 正在播放“运行”动画并且位于第 5 帧,我需要通过帧进行动画处理6, 7,
我的形状要么从地板上掉下来,要么消失。我的代码很简单,如果您复制并粘贴,您就可以看到所有内容。无论如何,听到的是代码。我想我可能没有在tick函数中的碰撞中添加一些东西。 var box, gravi
EaselJS.js 库有很多我的项目中不需要的函数(我不调用它们)。有没有办法检测这些功能并为每个项目删除它们?我需要尽可能减小文件大小。 附注我的easeljs.js是在Adobe Flash C
我正在尝试提高 Canvas 上的性能,因为每个 stage.update() 上都会重新绘制所有内容(多个区域),这就是它的工作原理。我只想绘制/添加一个区域。我可以让它工作,但是由于更新,所有以前
我正在使用 EaselJS 用 JS 编写一个简单的游戏。我尝试保持一切面向对象,以保持游戏状态、EaselJS 对象状态以及 Canvas 上显示的内容同步。我希望能够通过更改属性来更改 Canva
我希望我的位图转到单击位置,但我希望看到 bitmap.x/bitmap.y 和 click.x/click.y 之间的进展我怎样才能制作这个动画? 非常感谢 最佳答案 单击舞台时,您可以使用 Twe
我需要使用 Shape 对象创建可拖动的随机矩形。此函数在单击鼠标的位置创建新的矩形。 var rects = []; var i=0; var stage; window.onload = func
在代码的开头,我设置了一个刻度事件。以下 3 行有效。 createjs.Ticker.addEventListener("tick", handleTick); createjs.Ticker.us
我正在尝试在 Canvas 中创建可拖动的背景图像。目前我有这样的东西: var stage = new createjs.Stage("canvas"); createjs.Ticker.addEv
所以我正在使用 easeljs,并且我有一堆要回收的图像。由于某种原因,每当我尝试将它们添加到舞台 stage.update() 就不再起作用。 (我使用警报来测试这一点,因此它可能会变得非常慢例如加
我刚开始使用 easeljs 库。我创建了一个带舞台的 Canvas ,它可以正常工作。 我想添加位图作为按钮并将它们并排添加到舞台底部。 我试过以下方法,但它会将位图放在彼此的顶部。 var but
我刚开始通过在线教程学习 javascript,并从 GitHub 存储库下载文件。文件类型为“easeljs-0.7.1.min”。当我输入下面给出的代码时,它没有显示任何内容在浏览器上。是我下载的
我是一名优秀的程序员,十分优秀!