Cocos2d-js学习--helloword
一、引擎包目录结构介绍
目录结构可以分为3个部分来介绍:
第一部分: 引擎相关文件
frameworks 目录包含了 Cocos2d-html5 引擎和 Cocos2d-x JavaScript 代码的汇集.
Cocos2d-html5 目录包含了所有 Cocos2d-html5 的引擎模块,例如引擎核心模块、音频模块、外部物理引擎库,CocosBuilder Reader, CocoStudio Reader 和其他的模块。所有的模块都用JS实现并且可以在WEB环境中运行。
js-bindings 目录包含了 Cocos2d-x 引擎, 绑定的和外部预置 SpiderMonkey 库的项目文件。外部接口采用 JS 编写,但是基础模块使用 Cpp 实现,可以在许多不同的本地平台上运行,例如iOS,Android,Mac,Win32等平台。
第二部分: 测试文件,游戏样本和模板
template 目录是被用来创建一个新的Cocos2d-JS 工程。它包括了 HTML5 工程和默认的本地工程。cocos 控制台使用它来创建一个新的工程。
samples 包含全部的测试工程和一个示例游戏,他们都可以从 cocos 控制台执行,也可以通过 javascript 的接口绑定机制在WEB或者本地平台运行。
js-tests全部的测试工程,简单的说,就是一本活字典。
js-moonwarriors 一个可以运行的游戏样本。麻雀虽小,五脏俱全,强烈推荐初学者自己去重构一下这个游戏。
第三部分: 其他
AUTHORS 引擎相关作者介绍。官方的人将低调做到极致,所以,这个文件木有介绍。被我发现了。囧…
README 包含一些对 Cocos2d-JS 的介绍。
LICENSE 正如我们之前提到的,Cocos2d-JS 的许可证是 MIT,你可以查阅在引擎根目录下的 the license 文件夹来获得更多关于 Cocos2d-html5 and Cocos2d-x 的许可证细节。
tools 目录包括 cocos 控制台工具和 绑定生成工具(bingings-generator)。template 文件夹下包含一个 build.xml 文件,里面存放着闭包编译器的控制信息,通过 ANT 这个命令,你可以将你的游戏打包成为一个单个文件。
build 目录包含着内置的工程样本文件。
docs 目录包含 JavaScript 编码风格指导和 release 的信息。
CHANGELOG 包含所有版本的修改信息。
setup.py 是一个环境搭建的 python 脚本。
1
2
3
4
|
for (var i = 0; i < 32; i++){
cc. log (“强烈建议:”);
cc. log (“在群里面,很经常看到同学们问的问题实际上在Tests里面都有。所以,一定要去认认真真的看一下这个项目里面都有什么功能实例”);
}
|
二、HelloWord 操作
1. 这个时候,我们对Cocos2d-JS以及她的目录结构是比较清晰的认识了,并且,我们也在上一个教程中学会了开发环境的搭建。那么,接下来,我们就开始创建基于Cocos2d-JS的HelloWord。走起。。。。
2. Cocos
3. 创建工程
首先,你需要打开你的终端工具(Windows 系统打开Dos系统),运行下列命令(自选一种)
1
2
3
4
5
6
|
//创建一个同时包含Cocos2d-html5和Cocos2d-x JSB的项目
cocos new -l js
//创建一个仅包含Cocos2d-html5的项目, --no-native 表示不需要支持Native平台(IOS,Android,Mac,Windows等),只支持浏览器就可以了。
cocos new -l js --no-native
//创建一个置顶工程名字指定目标的项目
cocos new projectName -l js -d ./Projects
|
例如,我想在桌面创建一个叫HelloWord 的项目。那么有两种做法。
第一种:
1
2
|
cd ./Desktop
cocos new HelloWord –l js
|
第二种:
1
|
cocos new HelloWord -l js -d ./Desktop
|
4. 运行项目
浏览器上:
1
2
|
cd ./Desktop/HelloWord
cocos run -p web
|
编译并运行Cocos2d-x JSB项目在iOS,android,mac上(即:native平台上)
1
2
3
|
cd ./Desktop/HelloWord
cocos compile -p ios|android|mac
cocos run -p ios|android|mac
|
例如:我要运行在IOS上,那就运行:cocos run -p ios。编译好之后,对应的工程目录在HelloWord/frameworks/runtime-src/
Android项目导入Eclipse:
导入 HelloWord/frameworks/runtime-src/proj.android 到 Eclipse, 这个时候,Eclipse会报错,完成下面一步就好了。
导入 HelloWord/frameworks/js-bindings/cocos2d-x/cocos/platform/android/java 到 Eclipse 中即可
打包项目:()
1
2
|
cd ./Desktop/HelloWord
cocos compile –p web| android|IOS –m release
|
命令运行成功之后,在HelloWord工程文件夹下多出了一个publish文件夹,这个就是发布包。
例如我想把HelloWord跑在微信上,那三个步骤搞定:
1
2
|
cd ./Desktop/HelloWord
cocos compile –p web –m release
|
拷贝HelloWord/publish/html5到你的服务器下,然后微信浏览器访问这个地址,就搞定了。PC浏览器也是一样一样滴。
三、HelloWord 分析
先上图:
1. 上面的张图,就是我们的HelloWord项目。蓝色高亮的是我们开发中最经常接触的文件,我们来一个一个的解释下他们的作用:
frameworks 中包含了两个引擎模块,还有一个包含各个平台上的工程文件夹runtime-src,你只需要进入到这个文件夹看一下就能明白他的功能了。
res 目录.它包含了工程中所有被需要的资源文件。现在它仅仅包含一些图片样本。 但是如果你想要增加一些游戏的元素或者一些极好的游戏音乐,你应该将它们放在这个文件夹下并给为每个文件取一个合适的名字。
src 文件夹. 它包含你真实游戏的所有逻辑代码。如果这里有成千上百个 javascript 源文件,你最好将它们用子文件夹分成许多小部分。现在,我们的HelloWord工程拥有2个 javascript 源文件。 app.js 包含我们模板的第一个场景代码。在resource.js 定义了许多资源的全局变量。
index.html 文件是 HTML5 基于web应用程序的入口点。它是一种 HTML5 兼容的格式。它定义了许多元数据,例如设置视角和全屏参数等。
project.json 文件是我们工程的配置文件。请参考网站project.json获得更多详情 。
main.js 是一个创建你的第一个游戏场景和在浏览器显示这个场景的一个文件。 在这个文件里,你也可以定义你的分辨率策略和预加载你的资源。
2. 运行流程
浏览器上:
我们都知道,在浏览器上,首先会运行index.html文件,在这个文件中,我们可以看到下图:
可以看到,首先,浏览器会装载 frameworks/Cocos2d-html5/CCBoot.js, 它将会尝试从 project.json 文件中装载工程的设置信息。然后才继续装载main.js。我们来看下project.json,如下图:
project_type : 工程类型
debugMode : debug模式
showFPS : 是否显示FPS,就是左下角的那三行数据,第一个是渲染的调用次数,第二个是每帧的时间开销,第三个是帧率
frameRate : 帧率
id :
renderMode : 渲染模式。
engineDir : 引擎路径
modules : 加载模块,默认只加载["cocos2d"],那比如你想用chipmunk物理引擎,就需要再加载external模块。也就是modules : ["cocos2d","external"],最后项目打包的时候,只打包有加载进来的模块,所以,没用到的不要加载进来哈。
jsList : 自定义JS源文件的一个集合,类似Java、OC中的#import或者C、C++中的#include。
Native上:
在Native平台上就简单啦。看下HelloWord/frameworks/runtime-src/Classes/AppDelegate.cpp中的applicationDidFinishLaunching()方法就知道啦。
转载于:https://www.cnblogs.com/mcdnf/p/5158276.html
Cocos2d-js学习--helloword相关推荐
- 唤醒手腕 - 前端服务器端开发 Node.Js 学习笔记(学习中,更新中)
唤醒手腕 - Node.Js 学习笔记 唤醒手腕个人的学习记录,时间在2021年12月13日 ~ 2021年12月14日,学习方式看官方文档和B站视频,如有错误或者代码问题的地方,欢迎C站大佬能够帮忙 ...
- ArcGIS JS 学习笔记4 实现地图联动
原文:ArcGIS JS 学习笔记4 实现地图联动 1.开篇 守望屁股实在太好玩了,所以最近有点懒,这次就先写个简单的来凑一下数.这次我的模仿目标是天地图的地图联动. 天地的地图联动不仅地图有联动,而 ...
- backbone.js学习笔记
backbone.js学习笔记 之前只接触过jQuery,看来Backbone是除了jQuery的第二大JS框架... backbone到底是个啥? 其实刚开始我也不知道=_=,我是这周二才听说居然还 ...
- 程序员的高速学习法——以JS学习为例,进行图解
近期一直在忙着学习,感觉做总结的时间太少了,听起来挺好玩儿的,就像<倾城之恋>里面.范柳原说:那时候都忙着谈恋爱了哪里有时间恋爱. 学习和总结也是一样.不能一直忙着学习而导致自己没有时间 ...
- node.js学习笔记
# node.js学习笔记标签(空格分隔): node.js---## 一 内置模块学习 ### 1. http 模块 ``` //1 导入http模块 const http =require('ht ...
- node.js学习笔记14—微型社交网站
node.js学习笔记14-微型社交网站 1.功能分析 微博是以用户为中心,因此需要有注册和登录功能. 微博最核心的功能是信息的发表,这个功能包括许多方面,包括:数据库访问,前端显示等. 一个完整的微 ...
- WebGL three.js学习笔记 6种类型的纹理介绍及应用
WebGL three.js学习笔记 6种类型的纹理介绍及应用 本文所使用到的demo演示: 高光贴图Demo演示 反光效果Demo演示(因为是加载的模型,所以速度会慢) (一)普通纹理 计算机图形学 ...
- js 学习笔记(一)
前言 网上其实已经有非常多的js学习资料了,但是每个人都有自己的基础,所以往往是有的人讲的深一点,有的人说的浅一点. 就我自身而言,想要匹配自己水平的找些资料,往往是十分的零碎,所以可能今天看到的文章 ...
- html 流程控制,HTML5独家分享:原生JS学习笔记2——程序流程控制
当当当当 .....楼主又来了!新一期的js学习笔记2--程序流程控制更新了! 想一键获取全部js学习笔记的可以给楼主留言哦! js中的程序控制语句 常见的程序有三种执行结构: 1.顺序结构 2.分支 ...
- 基于jquery的插件turn.js学习笔记
基于jquery的插件turn.js学习笔记 简介 turn.js是一个可以实现3d书籍展示效果的jq插件,使用html5和css3来执行效果.可以很好的适应于ios和安卓等触摸设备. How it ...
最新文章
- 符号执行:利用Angr进行简单CTF逆向分析
- Openstack 中的消息总线 AMQP
- ML之DT:利用DT(DTC)实现对iris(鸢尾花)数据集进行分类并可视化DT结构
- 笔记-项目采购管理-规划采购管理
- 玩转webpack(一)下篇:webpack的基本架构和构建流程
- python解析log文件_python解析基于xml格式的日志文件
- 带Prometheus的Spring Boot和测微表第4部分:基础项目
- vscode连接远程服务器 SSH
- python-环境篇-Anaconda的安装
- [AWDwR4] No JQuery call matches [:html, #cart]
- linux 日志 \var\log
- 几个常用JAVA开源项目的地址荟萃
- 智慧交通day02-车流量检测实现13:基于虚拟线圈法的车辆统计+视频中的车流量统计原理解析
- 让电脑崩溃的100种方式(第四种)——结束csrss.exe进程
- VSCode PIO创建工程失败分析和解决办法
- Java 构造函数的详解
- RNN Transducer(RNN-T)——李宏毅人类语言处理学习笔记
- 蒜头君的藏书(映射)
- 普陀区科技创新型小巨人企业
- linux 8e,有关linux下 安装openssl-0.9.8e问题?