cocos2d-js 帧序列动画
1.resource.js
var res = {
playerWalk_plist:"res/playerWalk.plist",
playerWalk_png:"res/playerWalk.png"
};
var g_resources = [];
for (var i in res) {
g_resources.push(res[i]);
}
2.app.js
var HelloWorldLayer = cc.Layer.extend({
sprite:null,
ctor:function () {
this._super();
var size = cc.winSize;
//----------------------------------------------------------------------
cc.spriteFrameCache.addSpriteFrames(res.playerWalk_plist,res.playerWalk_png);
var sp=cc.Sprite.create();
sp.setPosition(cc.p(size.width*0.5,size.height*0.5));
//使用SpriteBatchNode可以让反复加载帧时只渲染一次,只从内存中取出
var spriteBatchNode= cc.SpriteBatchNode.create(res.playerWalk_png);
spriteBatchNode.addChild(sp);
this.addChild(spriteBatchNode);
var animFrames = [];
var str = "";
for (var i = 1; i < 15; i++) {
str = "playerWalk00" + (i < 10 ? ("0" + i) : i);
var frame = cc.spriteFrameCache.getSpriteFrame(str);
animFrames.push(frame);
}
var animation = new cc.Animation(animFrames, 1/30);
sp.runAction(cc.animate(animation).repeatForever());
//-----------------------------------------------------------------------
return true;
}
});
var HelloWorldScene = cc.Scene.extend({
onEnter:function () {
this._super();
var layer = new HelloWorldLayer();
this.addChild(layer);
}
});
cocos2d-js 帧序列动画的更多相关文章
- 【跟我一起学Unity3D】代码中分割图片而且载入帧序列动画
在Cocos2dx中.对大图的处理已经封装好了一套自己的API,可是在Unity3D中貌似没有类似的API(好吧,实际上是有的,并且功能更强大),或者说我没找到. 只是这也在情理之中,毕竟Unity3 ...
- 如何使用js捕获css3动画
如何使用js捕获css3动画 css3动画功能强大,但是不像js,没有逐帧控制,但是可以通过js事件来确定任何动画的状态. 下面是一段css3动画代码: #anim.enable{ -webkit-a ...
- 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇01:播放序列动画》
1.播放序列动画 系列动画播放概述 2D游戏中的动画系统,不同于3D游戏.3D游戏中,角色美术资源不仅包含角色模型的,还包括角色的贴图和动作等,模型本身自带角色的动作动画效果.2D游戏中,角色美术资源 ...
- 用原生JS写移动动画案例及实际应用
js很强大 相信很多人都知道,那么它有哪些强大之处呢?有兴趣的人可以去查查,这里就不赘述了,因为不在本片文章讨论的范围. 我们要讲的是怎么用原生JS写移动动画?我们先举一个最简单的动画例子,很多网站的 ...
- JS模拟CSS3动画-贝塞尔曲线
一.什么是贝塞尔曲线 1962年,法国工程师皮埃尔·贝塞尔(Pierre Bézier),贝塞尔曲线来为为解决汽车的主体的设计问题而发明了贝塞尔曲线.如今,贝赛尔曲线是计算机图形学中相当重要的一种曲线 ...
- 原生JS封装简单动画效果
原生JS封装简单动画效果 一致使用各种插件,有时候对原生JS陌生了起来,所以决定封装一个简单动画效果,熟悉JS原生代码 function animate(obj, target,num){ if(ob ...
- Android开发教程AnimationDrawable逐帧播放动画
下面我们一起来看篇Android开发AnimationDrawable控制逐帧播放动画实现过程,希望文章对各位朋友带不一些帮助. 当我们点击按钮时,该图片会不停的旋转,当再次点击按钮时,会停止在当前的 ...
- 原生js判断css动画结束 css 动画结束的回调函数
原文:原生js判断css动画结束 css 动画结束的回调函数 css3 的时代,css3--动画 一切皆有可能: 传统的js 可以通过回调函数判断动画是否结束:即使是采用CSS技术生成动画效果,Jav ...
- 原生js判断css3动画过度(transition)结束 transitionend事件 以及关键帧keyframes动画结束(animation)回调函数 animationEnd 以及 css 过渡 transition无效
上图的 demo 主要讲的 是 css transition的过渡回调函数transitionend事件: css3 的时代,css3--动画 一切皆有可能: 传统的js 可以通过回调函数判断动画 ...
随机推荐
- mongodb安装 win7版
首先下载mongdb的zip包,可以到:http://www.mongodb.org/downloads.选择32位或64位的. 在D盘创建mongodb文件夹,d:\mongodb.把解压里面所有的 ...
- jvm的可见性的理解
同步包括两方面的含义: 独占性和可见性. 很多人仅仅理解了独占性,而忽略了可见性. 根据Java Language Specification中的说明, jvm系统中存在一个主内存(Main Memo ...
- Notepad++ V6.9.0 中文绿色便携版
软件名称: Notepad++软件语言: 简体中文授权方式: 免费软件运行环境: Win 32位/64位软件大小: 3.4MB图片预览: 软件简介:Notepad中文版是一款非常有特色的编辑器,是开源 ...
- 转 shell awk 使用详解
awk简介 awk: 中文意思是报告生成器 能够根据我们输入的信息,将信息格式化以后显示,将定义好的信息以比较美观(直观)的方式显示出来出现比较早,继而出现了new awk(nawk)在windows ...
- php 分页类(2)
<?phpinclude("connection.php");$perNumber=10; //每页显示的记录数$page=$_GET['page']; //获得当前的页面值 ...
- 《JavaScript高级程序设计》读书笔记 ---基本概念小结
ECMAScript 中的基本数据类型包括Undefined.Null.Boolean.Number 和String. 与其他语言不同,ECMScript 没有为整数和浮点数值分别定义不同的数据 ...
- Hadoop上的中文分词与词频统计实践 (有待学习 http://www.cnblogs.com/jiejue/archive/2012/12/16/2820788.html)
解决问题的方案 Hadoop上的中文分词与词频统计实践 首先来推荐相关材料:http://xiaoxia.org/2011/12/18/map-reduce-program-of-rmm-word-c ...
- JSP 之国际化
导入 <%@ taglib url="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %> 创建三个语 ...
- C语言介绍
以下东东转自百度百科 C语言是一种计算机程序设计语言,它既具有高级语言的特点,又具有汇编语言的特点.它由美国贝尔实验室的Dennis M. Ritchie于1972年推出,1978年后,C语言已先后被 ...
- Linq第二讲
这一讲,来说说集合.因为linq主要用于对数据源进行查询,集合是最常见的数据源. 集合 形式: 数组,列表List<T> Arraylist等. 特点: 可通过索引或键访问.可进行fore ...