[计算机] cocos2D-x初探学习笔记(32)-cocos2d-x & javascript跨平台初体验

查看:1378 |回复:30 | 2017-6-23 12:27:48

您需要 登录 才可以下载或查看,没有账号?注册

x

近日,cocos2d家族开始了版本的联合发布,也就是说从cocos2d-x的2.1版本开始,终于可以实现广大开发者期盼已久的一套代码横跨ios,android和html5的梦想了,这次联合发布的包括cocosBuilder,cocos2d-iphone,cocos2d-x和cocos2d-html5版本,这篇文章就是笔者对这套开发工具的初体验经验总结。使用的是第二次联合发布的cocos2d-x的2.1.1版本。

    首先是从cocosbuilder中创建项目工程,然后导出的过程,首先创建工程,如图所示:

1360776633_8761.jpg

这个模板工程是这样一个界面,带有写好的js逻辑,点击按钮标题会旋转,然后在菜单中选择导出设置,设置导出的类型和支持的分辨率。

                            1360776708_2353.jpg

可以选择的包括android,ios和html5,然后在菜单中选择“Publish”就可以分别导出这三种平台需要的资源目录了,如图

                    


然后就是把这三个文件夹中的资源文件分别在三个平台上运行,首先是ios平台,直接使用cocos2d-x就可以,首先创建cocos2d-x的js项目

            

   然后就是把xcode的cocos2dx-js模板项目中的js文件和ccb文件替成新的就可以了,这里有几个地方是需要注意的。

1)这个项目里只有一个启动类AppDelegate,但是替换js时AppDelegate的入口js文件需要修改的,位置很容易找到。

2) 在项目里引入js文件时,xcode不会自动把js文件打入到包里,这样就会出现找不到js文件的情况,我们需要做的就是手动的修改一下,在项目的Build Phase设置里面,有个Copy Bundle Resources项目,手动把js文件添加进去。

               

  

编译运行,效果如图所示

         


接下来是android平台上的运行,关于android平台开发环境的搭建,请参考cocos2d-x的官方文档

http://www.cocos2d-x.org/projects/cocos2d-x/wiki/Setting_up_Android_Development_Environment_on_Mac_OSX#Setup-Eclipse-in-MBP-Retina

值得一提的是,google在eclipse的基础上为android创建了一个集成的开发环境Android Developer Tools,虽然就是以前的eclipse+adt插件+sdk的集合,但是这样的集合也省去了我们配置的时间,另外需要说明的是文档中提到的定义环境变量的问题,需要首先运行pico .bash_profile命令,另外第一行的环境变量名称应该是ANDROID_SDK_ROOT。配置好了环境以后我们就可以运行build_native来编译,需要注意的就是

1)编译的Android.mk文件和Application.mk都需要修改,可以参考Sample下的javascript项目,需要增加一些内容。

2)assert文件夹虽然是自动生成的,但是需要做一项额外的工作,就是把引擎目录或者是lib目录下,“scripting\javascript\bindings\js”目录下的js文件拷入到你的assert目录下,如果你觉得这样麻烦,也可以修改build_native,可以参考Sample下的javascript项目的build_native写法自动把这些文件拷近来,总之这一步是必须的。

3)最后便可以像文档中所说的,在elipse做最后的联机调试,需要说明的是,我在模拟器上运行是报错的,需要用真机调试,我使用的是HTC-G7调试,这个页面的帧率在58左右,跑cocos2dxjs自带的模板时,有很多西瓜的那个页面帧率基本是30-40,可以看出js在android上的效率还是不错的。

                              


最后是html5版本,关于cocos2D-html5的环境搭建,请参照我之前的文章:

http://blog.csdn.net/bill_man/article/details/7668516

在mac上的搭建也是大同小异,下载最新的cocos2D-html5版本然后解压,将目录下的全部文件拷贝到xampp的目录htdocs下,然后在CocosDragonJS同级的目录下创建一个GameClientJS目录,并把Published-html5文件夹拷入,然后启动xampp,输入地址运行cocos2d-html5目录下的index.html页面:

                       

我加了一个GameClientJS的链接,点击这个链接运行ameClientJS\Published-html5目录下的index.html页面。

                        

评分

参与人数 3元素币 +10 活跃度 +55 展开 理由
巡山小妖 + 15 这个帖子很棒,继续更哦
古拉加斯 + 5 + 20 这个帖子很强势,可以从小白开始学诶
伊卜星 + 5 + 20 这帖是原创的吗?不管如何先鼓励一下。不懂这些不过欣赏努力的人。

查看全部评分

2017-6-23 12:27:48  
 赞 赞 0

使用道具 登录

30个回答,把该问题分享到群,邀请大神一起回答。
2#
看看cocos2d
回复 收起回复
2017-6-23 13:12:57   回复
 赞 赞 0

使用道具 登录

3#
跨平台初体验
回复 收起回复
2017-6-23 23:03:10   回复
 赞 赞 0

使用道具 登录

4#
这帖是原创的吗?不管如何先鼓励一下。不懂这些不过欣赏努力的人。
回复 收起回复
2017-6-27 08:50:25   回复
 赞 赞 0

使用道具 登录

5#
非常好的东西,谢谢分享
回复 收起回复
2017-7-13 12:38:47   回复
 赞 赞 0

使用道具 登录

6#
6eaq
回复 收起回复
2017-7-24 10:19:52   回复
 赞 赞 0

使用道具 登录

7#
回复 收起回复
2018-10-16 10:39:56   回复
 赞 赞 0

使用道具 登录

8#
11111111111111111
回复 收起回复
2018-10-17 16:06:08   回复
 赞 赞 0

使用道具 登录

9#
带你赚币带你飞,元素里面有正妹
回复 收起回复
2018-10-18 10:19:01   回复
 赞 赞 0

使用道具 登录

10#
回复 收起回复
2018-10-18 11:40:16   回复
 赞 赞 0

使用道具 登录

11#
不错的资源
回复 收起回复
2018-10-19 09:37:37   回复
 赞 赞 0

使用道具 登录

12#
非常好的东西,谢谢分享
回复 收起回复
2018-10-19 09:40:10   回复
 赞 赞 0

使用道具 登录

13#
非常好的东西,谢谢分享
回复 收起回复
2018-10-19 16:07:02   回复
 赞 赞 0

使用道具 登录

14#
这么好的资源只有微元素才会有!感谢楼主分享!
回复 收起回复
2018-10-24 23:11:27   回复
 赞 赞 0

使用道具 登录

15#
谢谢分享
回复 收起回复
2018-10-25 09:18:43   回复
 赞 赞 0

使用道具 登录

16#
感谢楼主分享
回复 收起回复
2018-10-27 13:40:40   回复
 赞 赞 0

使用道具 登录

17#

谢谢分享
回复 收起回复
2018-10-28 00:35:01   回复
 赞 赞 0

使用道具 登录

18#
很好
回复 收起回复
2018-10-28 17:44:59   回复
 赞 赞 0

使用道具 登录

19#
感谢分享
回复 收起回复
2018-10-31 12:25:23   回复
 赞 赞 0

使用道具 登录

20#
从业不识微元素,做遍项目也枉然
回复 收起回复
2018-10-31 14:38:05   回复
 赞 赞 0

使用道具 登录

CG 游戏行业专业问题

其他引擎技术程序逻辑文章算法
12下一页
您需要登录后才可以回帖 登录 | 注册

本版积分规则

快速回复 返回顶部 返回列表