想学cocoscreator，请教学习路线，先要学cocos2d-js吗

来源：蜘蛛抓取(WebSpider) 时间：2016-12-09 14:01 标签：
『 不要让任何事情成为你不去学习的理由！』
【Cocos2d-HTML5 开发之一】新建HTML5项目及简单阐述与cocos2d/x引擎关系
本站文章均为
原创,转载务必在明显处注明：
转载自【黑米GameDev街区】 原文链接:
真的是有一段时间没写博了，这段时间呢，发生的事情真的挺多，另外自己呢也闲来做了一些自己的喜欢的东西，主要做的还是基于Mac系统的Cocoa框架的各种编辑器吧。（对了，今年初也出了自己第二本书）
废话少扯，最近又研究了下Cocos2d-HTML5相关引擎，其实说起HTML5，3、4年前Himi就接触过了，那时候的HTML5 Canvas
对我印象很深，但是不论当时还是现在对于HTML5绝大部分公司仍旧处于观望状态，我也不例外，无疑观望期间也不断的有引擎基于HTML5，例当前的Cocos2d-HTML5,还有以后基于Untiy3D的HTML5，这早晚的事情。总体来说，HTML5是个趋势，只是个时间的问题。
那么本篇呢，简单的叙述下Cocos2d-HTML5新创建一个项目过程以及与cocos2d/x之间的关系。
第一步：首先下载Cocos2d-html5的引擎，下载地址：
当前Himi下载的是最新的2.1.5 version.
第二步：解压引擎包，然后目录如下：
第三步：简单以 HelloHTML5World 项目为例，我们可以直接使用浏览器打开HelloHTML5World文件夹中的 index.html，即可运行此示例项目。
运行到浏览器中的效果如下:
运行效果如上，其实这是个错误效果图，先不要着急。（原因只是资源准备失败的原因，后续说明）
我们先不管这个问题，先看下整个的项目结构：(Himi使用的 TextMate 打开的)
简单叙述：
资源存放目录
js脚本存放目录(我们自己的项目源码目录)
3. build.xml : 对cocos2d引擎进行编译成js脚本形式所用文件
4. cocos2d.js: 对cocos2d引擎进行参数设置的配置文件
5. index.html: 对当前视图的配置文件
6. main.js : 主程序入口
那么很多读者疑惑如何下手？
其实很简单，大家可以理解，cocos2d-html5 引擎只是将cocos2d 引擎框架直接映射成应html5 api实现的过程，我们通过js语言书写cocos2d引擎代码的形式，完成cocos2d引擎形式代码掌管整个HTML5项目。大家直接按照写cocos2d/x的代码形式进行书写即可，但是语言要求js格式。
那么如何创建一个新的HTML5项目:
第一步：将cocos2d-html5 引擎目录下的HelloHTML5World 文件夹直接copy一份出来，然后文件名可自定义。
第二步：将引擎目录下的lib文件夹下的 Cocos2d-html5-v2.1.5.min.js 文件copy 到你第一步的项目文件夹下即可。
Cocos2d-html5-v2.1.5.min.js 文件的作用:将cocos2d引擎以HTML5 api形式映射的js库，供我们项目使用，如果你不copy这个项目到你的项目中，你无法运行。
大家疑惑为什么引擎下的 HelloHTML5World 项目下为什么不需要 ？ 其实这个示例项目采用的是相对引擎目录路径下的每个引擎类映射js来使用。如下图：
而这个Cocos2d-html5-v2.1.5.min.js 文件为什么有个min? 这个其实就是以前的Cocos2d-html5-v2.1.5.jsb.js ，简单理解就是将js代码进行一个压缩，将代码中的table 空格等都去除，节省其文件大小的一种形式。
第三步：直接使用浏览器运行项目下的index.html 即可。
当然这时候运行的效果如 HelloHTML5World 项目运行效果相同，此原因主要是由于资源加载收到浏览器限制，因此导致项目无法正常启动。
这个问题其实是浏览器防止被钓鱼、对AJAX的一种防护，而cocos2d-html5 引擎请求图片的方式则采用的就是AJAX.
因此我们解决此问题可以有两种方式：
本地安装web服务器， apache 等，将项目发布在web服务器上即可。
直接使用火狐浏览器进行调试，火狐浏览器是没有限制的。
如下是火狐浏览器运行的结果：
ok，一切正常，剩余的就交给大家了。
? 【Unreal Engine 】 ? 【React Native】 ? 【Cocos Creator】? 【Cocos2dx】? 【C2dx-Lua】
Himi’s Book
小广告先森
小广告先森cocos2d-js（10）
3月30日官方更新了一个最新开发Cocos2d-JS的工具&&Cocos&Creator&1.0（咳咳，我其实盯了好几天了，其实是4月5号左右发布的）
1.新的工具新的未来
体检了一把Cocos Creater,最大的两个特点就是&组件化开发，数据驱动，这两点我觉得非常好，新的工作流程也大大提高了我们开发效率，这也使得独那些立开发者(独行侠)得到受益。下面说说这两个特点
----组件化：组件化编程的关键目的是为了将程序模块化，举个例子就像是&积木一样&一点一点拼凑，高耦合低内聚。这也是未来我们编程语言的一个趋势，编程语言将来会朝着这个方向前进。
----数据驱动：我们进入一个场景不在是有一个入口的函数，而是加载场景中的资源。
一个数据驱动的模块会以一种及时的方式获取、处理和使用数据。
另外还有一个特点，我们可以一键打包发布，特别方便,很适合独立开发者。（之前的cocos studio其实也是这样的）
2.下面我详细说说Cocos&Creator&如何学习
第一步我们先来到官方网站&/&点击下载，然后点击红框
第二步，这是点击下载之后的界面
Windows ：针对windows操作系统下载
Mac ：针对苹果系统下载
文档 ：对于Cocos&Creator工具的一个使用说明
API ：帮助文档，大家可以把这里所有的东西预览一遍，开发必备
教学视频：官方的视频介绍，建议大家一定要多看几遍
游戏实例说明：Github直通车，官方写的一个游戏，大家可以用，可以用工具直接打开运行
第三步，具体安装流程一步，下一步很简单
如果对自己没信心，可以 查看我写过的博客，。&
3.安装之后我们点开运行
启动&Cocos&Creator&并使用&Cocos&开发者帐号登录以后，就会打开&Dashboard&界面，在这里你可以新建项目、打开已有项目或获得帮助信息。
上图所示的就是&Cocos&Creator&的&Dashboard&界面，包括以下几种选项卡：
·&最近打开项目:&列出最近打开项目，第一次运行&Cocos&Creator&时，这个列表是空的，会提示新建项目的按钮。·&新建项目:&选择这个选项卡，会进入到&Cocos&Creator&新项目创建的指引界面。·&打开其他项目:&如果你的项目没有在最近打开的列表里，你也可以点击这个按钮来浏览和选择你要打开的项目。·&帮助:&帮助信息，一个包括各种新手指引信息和文档的静态页面。
仔细看我图中画的几个地方
***01范例集合，这里面是官方的例子，官方写的还不够完善，不过我们需要去学习。
***02帮助，这里面其实就是官网 那个文档，只不过变成本地了，想要学好cocos creater 这个一定是要认真看的。
&&&下次博客我会详细介绍一下官方的帮助文档如何学习，新建一个官方的项目，日后会更新一个小项目分享给大家，现在还在开发中~~~~~
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：27212次
排名：千里之外
原创：47篇
转载：25篇
评论：26条
(9)(5)(9)(4)(5)(14)(17)(6)(1)(3)

我要回帖

 

随机推荐