画布游戏动画 [英] Canvas Game Animation

问题描述

所以我做一个游戏，并得到了一个半透明的png动画从spritesheet的想法，当玩家在他死后回到开始时出现。

So I a making a game and got the idea of having a semi transparent png animation from a spritesheet to appear when the player gets put back to the start after he dies.

http://www.youtube.com/watch?v=s2Vwyqo_y_A

这只是我从来没有到过动画，因为某种原因我认为操纵animrequestframe东西有点混乱。我有它的设置，所以我的游戏每秒刷新60次。

It's just I have never gotten around to animation yet a for some reason I think the manipulating the animrequestframe thingy kinda confusing. I have it set so my game refreshes every 60 times a second.

想要一些建议来帮助我！ ：/
这是我的第一个'正确'游戏！

Would love some advice to help me out! :/ It's my first 'proper' game!

推荐答案

c $ c> requestFrameAnimation ，我建议你阅读这两个链接，他们解释得很好：

If you're struggling getting your head around requestFrameAnimation, I suggest you read these couple of links, they explain it really well:

1. 流畅的JavaScript动画的秘诀


2. 使用requestAnimationFrame

1. The secret to silky smooth JavaScript animation!
2. Using requestAnimationFrame

给出的最简单的例子：

function gameLoop() {
  // Game logic
  requestAnimationFrame(gameLoop);
}
requestAnimationFrame(gameLoop);

编辑：您提到您希望游戏每60 FPS 。请求动画将尽可能快地运行您的游戏 - 这是一件好事 - 但是有设置实际FPS的技巧。然而，除非你的目标是一个更低的FPS，如30，我不会打扰。

You mention you want your game to run every at 60 FPS. Request animation will run your game as fast as it can - which is a good thing - but there are tricks to set the actual FPS. However, unless you're aiming for a lower FPS, like 30, I wouldn't bother.

这篇关于画布游戏动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！