1
2
3
4
5
6
<body>
<script src="res/loading.js"></script>
<canvas id="gameCanvas" width="480" height="720"></canvas>
<script src="frameworks/cocos2d-html5/CCBoot.js"></script>
<script cocos src="main.js"></script>
</body>

首先加载的是CCBoot.js文档

执行主循环

1
2
3
4
5
6
7
8
9
10
11
12


mainLoop: function () {
if (this._purgeDirectorInNextLoop) {
this._purgeDirectorInNextLoop = false;
this.purgeDirector();
}
else if (!this.invalid) {
this.drawScene();
}
},

_purgeDirectorInNextLoop:下一帧是否需要清除自身,一般在cc.director.end()赋值为true

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60

* Draw the scene. This method is called every frame. Don't call it manually.
*/
drawScene: function () {
var renderer = cc.renderer;

// calculate "global" dt
this.calculateDeltaTime();

大专栏  Cocos2dx-JS学习01n class="comment">//tick before glClear: issue #533
if (!this._paused) {
this._scheduler.update(this._deltaTime);
cc.eventManager.dispatchEvent(this._eventAfterUpdate);
}


//首先执行调度器中的任务,然后触发cc.director.EVENT_AFTER_UPDATE事件,检查交互事件,有的话就分发处理




/* to avoid flickr, nextScene MUST be here: after tick and before draw.
XXX: Which bug is this one. It seems that it can't be reproduced with v0.9 */
if (this._nextScene) {
this.setNextScene();
}
//如果有场景切换,便切换

//渲染当前scene
// draw the scene
if (this._runningScene) {
if (renderer.childrenOrderDirty) {
cc.renderer.clearRenderCommands();
cc.renderer.assignedZ = 0;
this._runningScene._renderCmd._curLevel = 0; //level start from 0;
this._runningScene.visit();
renderer.resetFlag();
}
else if (renderer.transformDirty()) {
renderer.transform();
}
}

renderer.clear();

// draw the notifications node
if (this._notificationNode)
this._notificationNode.visit();
//遍历节点,更新节点的空间转换矩阵,发送命令给渲染器
cc.eventManager.dispatchEvent(this._eventAfterVisit);
cc.g_NumberOfDraws = 0;

renderer.rendering(cc._renderContext);
this._totalFrames++;
//排序,绘制
cc.eventManager.dispatchEvent(this._eventAfterDraw);
cc.eventManager.frameUpdateListeners();
//更新帧率
this._calculateMPF();
},

关于绘制管理

关于内存管理(引用计数法)

调度器

cc.Node有相关API

1
2
3
4
node.scheduleUpdate()
node.update = function (dt) {

}

默认调度器:使用scheduleUpdate,必须重写update函数,dt是时间间隔

自定义调度器:

1
node.schedule(callback,inteval,repeate,delay,key)

回调函数(必须),时间间隔(默认0),重复次数(默认cc.REPEAT_FOREVER),延时时间(默认0),唯一标示符

卸载调度器:

unschedule和unscheduleAllCallbacks

场景管理

使用栈的结构

在退出的相关生命周期函数中,应该将this._super()函数放在最后调用,遵循“先进后出“

A->B

SceneA的onEixtTransitionDidStart方法开始前SceneB的ctor执行,所以不要在ctor中做开销大的工作

精灵

每个精灵一般关联一张纹理(Texture2D对象)

四种方法创建

Cocos2dx-JS学习01的更多相关文章

  1. node.js 学习01

    PHP开发技术栈(LAMP) Linux  Apache  MySql  PHPnode.js 全栈开发技术栈(MEAN): MongoDB  Express  Angular  Node.js 现阶 ...

  2. 【8-18】JS学习01

    Source : http://www.w3school.com.cn/html 外部的 JavaScript 也可以把脚本保存到外部文件中.外部文件通常包含被多个网页使用的代码. 外部 JavaSc ...

  3. jquery动画切换引擎插件 Velocity.js 学习01

    一.Velocity.js介绍 Velocity是一个jQuery插件,重新实现了$.animate() 来产生更高的性能(速度也比CSS动画库更快),而包括新的功能,以提高动画工作流程. Veloc ...

  4. JS学习-01

    01

  5. Node.js 教程 01 - 简介、安装及配置

    系列目录: Node.js 教程 01 - 简介.安装及配置 Node.js 教程 02 - 经典的Hello World Node.js 教程 03 - 创建HTTP服务器 Node.js 教程 0 ...

  6. ThinkPhp学习01

    原文:ThinkPhp学习01 一.ThinkPHP的介绍           MVC  M - Model 模型                工作:负责数据的操作  V - View  视图(模板 ...

  7. 【iScroll源码学习01】准备阶段 - 叶小钗

    [iScroll源码学习01]准备阶段 - 叶小钗 时间 2013-12-29 18:41:00 博客园-原创精华区 原文  http://www.cnblogs.com/yexiaochai/p/3 ...

  8. JS学习小结(上)

    学而时习之,不亦说乎,开启JS学习新乐章~ JS是干啥的?网页特效,它主要是实现控制结构和样式,是一种行为,有多重要,不言而喻吧,页面炫酷的资本. 1. JS输出: alert("hello ...

  9. vue学习01

    vue学习01   1. 创建一个Vue实例官网-学习-教程-安装-(开发/生产版本)-与jQuery的引用相似 <!DOCTYPE html> <html> <head ...

  10. Vue.js学习笔记:在元素 和 template 中使用 v-if 指令

    f 指令 语法比较简单,直接上代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " ...

随机推荐

  1. LeetCode——155. 最小栈

    设计一个支持 push,pop,top 操作,并能在常数时间内检索到最小元素的栈. push(x) -- 将元素 x 推入栈中. pop() -- 删除栈顶的元素. top() -- 获取栈顶元素. ...

  2. thinkcmf2.2 火狐浏览器图片上传以及谷歌图片上传打开稍慢

    对目录中 admin/themes/simplebootx/asset/plupload.html 文件 进行更改如下图:

  3. Python与mongo交互

    # 导入模块 import pymongo # 连接MongoDB数据库 conn = pymongo.MongoClient('localhost', 27017) # 建库 db = conn.g ...

  4. 微服务项目开发学成在线_day01_CMS服务端开发

    05-CMS需求分析-什么是CMS 什么是CMS?CMS (Content Management System)即内容管理系统,不同的项目对CMS的定位不同.CMS有哪些类型? 每个公司对每个项目的C ...

  5. flask汇总

    flask框架 蓝图 随着flask程序越来越复杂,我们需要对程序进行模块化的处理,之前学习过python的模块化管理,于是针对一个简单的flask程序进行模块化处理 Blueprint概念 简单来说 ...

  6. gitKraken取消/关闭全屏

    如果你找不到在哪里设置的 这是配置文件  注意 fullScreen 字段,改这个字段可以改变是不是全屏,改变之前先关闭软件, 文件目录 第二张图

  7. 微信小程序2048开发进度(一)

    父亲是个体劳动者,他的兴趣就是下象棋,针对平时兴趣,我想做一款自己的2048小游戏,在慕课网观看了2048小游戏的讲解,以及关于开发小游戏的理论知识,对开发一款小游戏有了基本的认识.

  8. ZJNU 1372 - 破解情书

    取模运算在数组内循环解密,否则会MLE /* Written By StelaYuri */ #include<stdio.h> ],cn[]; int main() { int i,j, ...

  9. Django专题之ORM操作2

    Django ORM操作   目录 一般操作 看专业的官网文档,做专业的程序员! 回到顶部 必知必会13条 <1> all(): 查询所有结果 <2> get(**kwargs ...

  10. semantic框架 - selection dropdown自定义样式

    semantic和Bootstrap是我最常用的前端框架. 这次需求,是要修改selection dropdown. 直接贴代码,不解释. .ui.form input:not([type]):foc ...