一个js文件方便快捷实现帧动画播放组件

在开发游戏时候,更多的是核心玩法的化简,通过代码来一步步实现功能。而动画可以让游戏在效果上锦上添花。

通常做一个精灵的动画有很多的方式,但弊端就是比较耗时。而一些小配角在游戏看来无关重要的,那我们就可以通过简单的方式来实现动画,让他们能够直接动起来。这样就不用再耗费时间去做clip的动画了。

话不多说,直接上代码,先准备素材。在爱给网上找到自己想要的素材就可以了,然后再通过TexturePacker来把图片合并减少图片所占容量。

蜡笔小新跑动图片

之后就创建AnimateScript.js文件了。

属性声明:

属性声明

为了让大家自己手动打代码熟悉,故只贴上代码截图,毕竟整份文件代码数不多。

初始化与基本逻辑:

onLoad加载

循环播放与单次播放动画方法:

循环播放
单次播放

利用updata(dt)实现动画逻辑控制:

动画实现

通过这一个js文件,就可以挂在节点上轻松实现动画的播放了。

节点挂载脚本

这样只要把相关的图片拖进SpriteFrames里面就可以了,这样只要有动画的图片就可以方便快捷实现帧动画了。

最终动画效果
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,148评论 1 32
  • 前几天爷爷来我家做客,让我惊讶万分。可能大家会觉得奇怪,爷爷来我家有什么奇怪的。但在我家的确是的。 从小到大,爷爷...
    畅锁欲言阅读 351评论 1 3
  • 1.生活中哪些事情让你感到特别自豪?写下你的那些精神胜利,那些超出当时预期的胜利,那些在某些阶段你甚至轻松地通过考...
    月涵echo阅读 242评论 1 0
  • 时光如流水,已经快二十天了,从刚开始的迷茫焦急,到现在的平静淡然,看淡了很多,也把迷茫藏在了心底。刚看了一篇鸡...
    宫雀阅读 174评论 0 0
  • 20161109问题解析请点击今日问题下方的“【Java每日一题】20161110”查看(问题解析在公众号首发,公...
    weknow阅读 332评论 2 5