哀家发现一个游戏如果不记录（复习）一下的话，不算真正记在脑子里了，也可以理解为我是一个手写记忆型。
我目前的水平，对cocos2d-x有了一些了解，对cocos2d-Js没有接触过，看了一下泡泡龙的视频。但是两者是一个妈妈生的，很多东西都是相同的，就好理解的许多，我仅对cocos2d-Js的内容多做一些记录。
开始。
打开刚刚下载的cocos2d-Js的时候里面的东西少得可怜，HelloWorld.png,还有一个Json文件，一个index文件，一个coco2d-Js的Js，第一步就copy到我的编译器上了。
cut掉index文件里关于Js的代码，建立一个main.Js文件，copy进去。
现在的index文件
<!DOCTYPE HTML><HTML><head> <Title>Hello Cocos2d-Js</Title> <script type="text/JavaScript" src="Js/cocos2d-Js-v3.3-lite.Js" charset="UTF-8"></script></head><body><canvas ID="gameCanvas" wIDth="360px" height="640px"></canvas><script type="text/JavaScript" src="Js/main.Js"></script></body></HTML>
main.Js文件
window.onload = function(){ cc.game.onStart = function(){ //load resources cc.LoaderScene.preload(["HelloWorld.png"],function () { var MyScene = cc.Scene.extend({ onEnter:function () { this._super(); var size = cc.director.getWinSize(); var sprite = cc.Sprite.create("HelloWorld.png"); sprite.setposition(size.wIDth / 2,size.height / 2); sprite.setScale(0.8); this.addChild(sprite,0); var label = cc.LabelTTF.create("Hello World","Arial",40); label.setposition(size.wIDth / 2,size.height / 2); this.addChild(label,1); } }); cc.director.runScene(new MyScene()); },this); }; cc.game.run("gameCanvas");};
cc.LoaderScene.preload(["HelloWorld.png"] 是指在场景加载之前预加载游戏资源，这里的资源就只有一张HelloWorld.png图片。
extend函数是干嘛的。我一如了cocos2d文件夹到工程里，ctrl+鼠标左键点进去看了看：它其中一项内容是把prototype封装在里面了，没有框架的时候，prototype是对象实例化的过程，那么这个extend就是创建Node的入口函数吧。onEnter:function () { this._super(); var size = director.getWinSize(); sprite = Sprite.create("HelloWorld.png"); sprite.setposition(size.wIDth / 2,height / 2); setScale(0.8); this.addChild(sprite,0); label = LabelTTF.create("Hello World",0)">"Arial",255)">40); label.2); label,255)">1); }这个函数是cocos2d-x中移植来的吧，没什么区别，this._super();对象的父级对象初始化。cc.getWinSize();获取屏幕宽高。"HelloWorld.png"); 建立一个精灵图片2);设置位置0.8); 设置大小0); 添加到层中LabelTTF.create(1); 创建文本，大小，添加。
后来建立了一个StartScene类，把extend直接cut过去。在main.Js里extend位置放一句话cc.director.runScene(new StartScene()); 创建一个场景把它在main.Js中运行。这样就拥有了游戏场景类。为了资源管理问题。自己写了一个recourse.Js类，模版代码如下var res={ Start_BG:"res/StartScene.jpg",Play_BG:"res/background4.jpg",Bubble_0:"res/bubble_0.png",Bubble_1:"res/bubble_1.png",Bubble_2:"res/bubble_2.png",Bubble_3:"res/bubble_3.png",Bubble_4:"res/bubble_4.png",Bubble_5:"res/bubble_5.png",Bubble_6:"res/bubble_6.png",Bubble_7:"res/bubble_7.png",Start_Btn:"res/rate_app_button.png",Shooter:"res/bubble_shooter.png" };//把所有的图片push到数组里一起加载 var g_resources=[];for(var i in res){ g_resources.push(res[i]);}目的就是在预加载游戏资源的时候直接加载这个resources类里的资源，避免游戏过程中因为家在资源而出现卡顿的问题，影响用户的游戏体验。
在StartScene类中就直接加载res中的Start_BG 图片啦。//开始页面 var StartScene = cc.Scene.extend({ onEnter: function () { this._super(); var size = cc.director.getWinSize(); var sprite = cc.Sprite.create(res.Start_BG); sprite.setposition(size.wIDth / 2,size.height / 2); sprite.setScale(0.8); this.addChild(sprite,0); });
后来在最后又加了一个按钮：
var startItem = new cc.MenuItemImage( res.Start_Btn,res.Start_Btn,function () { cc.log("click"); cc.director.runScene( new BubbleScene()); });startItem.attr( { x:size.wIDth/2,y:size.height/2-100,anchorX:0.5,anchorY:0.5 });var menu = new cc.Menu(startItem);menu.x=0;menu.y=0;this.addChild(menu);
与cocos2d-x的代码基本一致，总结MenuItemImage一个小按钮先。Menu(startItem);在加到menu里面统一管理。呈现的结果就是
以上是内存溢出为你收集整理的cocos-js web开发泡泡龙游戏【一 加载游戏场景】全部内容，希望文章能够帮你解决cocos-js web开发泡泡龙游戏【一 加载游戏场景】所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）