基礎教程所有代碼地址在:https://github.com/makeapp/cocoseditor-samples
接着上一節,我們已經創建了一個主遊戲場景MainLayer,現在我們需要創建一個開始場景StartLayer,包括StartLayer.ccbx和StartLayer.js兩個文件,點擊StartLayer上的開始按鈕,遊戲切換到主遊戲場景。
先看運行效果;
代碼下載地址:http://www.kuaipan.cn/file/id_25348935635744469.htm?source=1
首先創建StartLayer.ccbx和StartLayer.js文件,如下圖操作(sources右擊----new---layer)(sources右擊---new---controller)
創建成功後,指定控制器;
我們設計開始場景,一個顏色背景層,一個MenuItem按鈕;
添加MenuItem時候主要把參數target=doc選上
場景設計完畢,我們開始編程StartLayer.js ,只需要加入一個函數onPlayClicked(),點擊player後跳轉到MainLayer.js;
//
// CleanerScoreScene class
//
var StartLayer = function () {
cc.log("StartLayer")
};
StartLayer.prototype.onDidLoadFromCCB = function () {
// this.rootNode.onUpdate = function (dt)
// {
// this.controller.onUpdate();
// };
// this.rootNode.schedule(this.rootNode.onUpdate);
if (sys.platform == 'browser') {
this.onEnter();
}
else {
this.rootNode.onEnter = function () {
this.controller.onEnter();
};
}
this.rootNode.onExit = function () {
this.controller.onExit();
};
};
StartLayer.prototype.onEnter = function () {
}
StartLayer.prototype.onUpdate = function () {
}
StartLayer.prototype.onPlayClicked = function () {
cc.BuilderReader.runScene("", "MainLayer");
}
StartLayer.prototype.onExit = function () {
}
然後再去設置Main.js,讓主函數先啓動StartLayer; 也別忘記加入這行代碼require("StartLayer.js");
if (sys.platform == 'browser') {
var require = function (file) {
var d = document;
var s = d.createElement('script');
s.src = file;
d.body.appendChild(s);
}
} else {
require("jsb.js");
}
cc.debug = function (msg) {
cc.log(msg);
}
cc.BuilderReader.replaceScene = function (path, ccbName) {
var scene = cc.BuilderReader.loadAsSceneFrom(path, ccbName);
cc.Director.getInstance().replaceScene(scene);
return scene;
}
cc.BuilderReader.loadAsScene = function (file, owner, parentSize) {
var node = cc.BuilderReader.load(file, owner, parentSize);
var scene = cc.Scene.create();
scene.addChild(node);
return scene;
};
cc.BuilderReader.loadAsSceneFrom = function (path, ccbName) {
cc.BuilderReader.setResourcePath(path + "/");
return cc.BuilderReader.loadAsScene(path + "/" + ccbName);
}
cc.BuilderReader.loadAsNodeFrom = function (path, ccbName, owner) {
cc.BuilderReader.setResourcePath(path + "/");
return cc.BuilderReader.load(path + "/" + ccbName, owner);
}
cc.BuilderReader.runScene = function (module, name) {
var director = cc.Director.getInstance();
var scene = cc.BuilderReader.loadAsSceneFrom(module, name);
var runningScene = director.getRunningScene();
if (runningScene === null) {
cc.log("runWithScene");
director.runWithScene(scene);
}
else {
cc.log("replaceScene");
director.replaceScene(scene);
}
}
var ccb_resources = [
{type: 'image', src: "Resources/HelloWorld.png"},
{type: 'image', src: "Resources/CloseNormal.png"},
{type: 'image', src: "Resources/CloseSelected.png"}
];
require("MainLayer.js");
require("StartLayer.js");
if (sys.platform == 'browser') {
var Cocos2dXApplication = cc.Application.extend({
config: document['ccConfig'],
ctor: function () {
this._super();
cc.COCOS2D_DEBUG = this.config['COCOS2D_DEBUG'];
cc.initDebugSetting();
cc.setup(this.config['tag']);
cc.AppController.shareAppController().didFinishLaunchingWithOptions();
},
applicationDidFinishLaunching: function () {
var director = cc.Director.getInstance();
// director->enableRetinaDisplay(true);
// director.setDisplayStats(this.config['showFPS']);
// set FPS. the default value is 1.0/60 if you don't call this
director.setAnimationInterval(1.0 / this.config['frameRate']);
var glView = director.getOpenGLView();
glView.setDesignResolutionSize(1280, 720, cc.RESOLUTION_POLICY.SHOW_ALL);
cc.Loader.preload(ccb_resources, function () {
cc.BuilderReader.runScene("", "StartLayer");
}, this);
return true;
}
});
var myApp = new Cocos2dXApplication();
} else {
cc.BuilderReader.runScene("", "StartLayer");
}
一切都好了,點擊運行;先進入開始界面,點擊play跳入遊戲主界面
下一篇文章 我會介紹cocos2d-x editor的字體設計 筆者(李元友)
資料來源:cocos2d-x editor