Friends,
I am new to cocos2d. I was following this tutorial. The tutorial is very nice and easy to understand, but after following the steps I got a black screen. To be precise, I am getting a Loading screen for a fraction of a second and then I am getting this black screen. I am using Eclipse for coding and resource management, Windows Command Prompt for running projects and Google Chrome for testing. How can I solve this problem and get the expected result?
Do you have any error log ? A black screen signify often a javascript failure, and it will be logged out.
How to collect the error log? Can you point me to an article which describes how to solve this kind of problems?
The problem is we don’t know yet what your problem is. For checking the log, you can open developer tool of google chrome.
The chrome console is empty.
Do you have an online test page ?
I got this:
Uncaught child already added. It can’t be added again
No, I don’t have an online test page.
Do this: run you project in chrome, open Chrome’s console and then reload the page, sometimes logs won’t get printed in the console unless it’s open from the start.
Also, for that error you got, have you looked at what line of what file it’s happening? Could it be that you have created a sprite (or some other element) and you are trying to add it (with AddChild) to a layer after you’ve already called that function with that element?
It’s coming from CCDebugger.js:284 .
I did exactly what was there in the tutorial I followed. I didn’t add/alter anything else to the project. I will investigate the issue further and keep posting here. Meanwhile, if something comes up in your mind share here.
Well, it could really speed things up if you posted your app.js, main.js, etc. files (I mean, any file in your project to which you have added code) so we could take a quick look at it.
you may be missing a tiny thing (or maybe the tutorial has a small error).
Another thing you could do is set a breakpoint with Chrome’s developer tools and try to see where the project is failing (I’m betting on that the game starting and then fails when you are setting up your main scene/layer/sprites).
app.js:
var MenuLayer = cc.Layer.extend({
ctor : function(){
//1. call super class's ctor function
this._super();
},
init:function(){
//call super class's super function
this._super();
//2. get the screen size of your game canvas
var winsize = cc.director.getWinSize();
//3. calculate the center point
var centerpos = cc.p(winsize.width / 2, winsize.height / 2);
//4. create a background image and set it's position at the center of the screen
var spritebg = cc.Sprite.create(res.helloBG_png);
spritebg.setPosition(centerpos);
this.addChild(spritebg);
//5.
cc.MenuItemFont.setFontSize(60);
//6.create a menu and assign onPlay event callback to it
var menuItemPlay= cc.MenuItemSprite.create(
cc.Sprite.create(res.start_n_png), // normal state image
cc.Sprite.create(res.start_s_png), //select state image
this.onPlay, this);
var menu = cc.Menu.create(menuItemPlay); //7. create the menu
menu.setPosition(centerpos);
this.addChild(menu);
},
onPlay : function(){
cc.log("==onplay clicked");
}
});
var MenuScene = cc.Scene.extend({
onEnter:function () {
this._super();
var layer = new MenuLayer();
layer.init();
this.addChild(layer);
}
});
main.js:
cc.game.onStart = function(){
cc.view.setDesignResolutionSize(480, 320, cc.ResolutionPolicy.SHOW_ALL);
cc.view.resizeWithBrowserSize(true);
//load resources
cc.LoaderScene.preload(g_resources, function () {
cc.director.runScene(new MenuScene());
}, this);
};
cc.game.run();
resource.js:
var res = {
helloBG_png : "res/helloBG.png",
start_n_png : "res/start_n.png",
start_s_png : "res/start_s.png"
};
var g_resources = [
//image
res.helloBG_png,
res.start_n_png,
res.start_s_png
];Ok… I don’t really see anything wrong in there 
Please do something. You are my only hope.
'^^
Ok, ok… Just don’t call me Obi Wan please 
I’ll take another look when I get home tonight (I don’t have cocos files with me right now).
Just for checking: in the mean time, have you tried running the sample projects that come with cocos to see if they run fine?
The helloworld project runs fine.
Please help me.
Which version of Cocos2d-JS are you using ?
You can try several things
- remove
layer.init()in MenuScene’s onEnter function - Check whether all images are well placed in
resfolder - Try to comment out all the menu staff to see whether a single sprite works
I am using the latest version. I followed this article during installation.
I just tried all three and I am still getting the same error.
app.js:
var MenuLayer = cc.Layer.extend({
ctor : function(){
//1. call super class's ctor function
this._super();
},
init:function(){
//call super class's super function
this._super();
//2. get the screen size of your game canvas
var winsize = cc.director.getWinSize();
//3. calculate the center point
var centerpos = cc.p(winsize.width / 2, winsize.height / 2);
//4. create a background image and set it's position at the center of the screen
var spritebg = cc.Sprite.create(res.helloBG_png);
spritebg.setPosition(centerpos);
this.addChild(spritebg);
/*
//5.
cc.MenuItemFont.setFontSize(60);
//6.create a menu and assign onPlay event callback to it
var menuItemPlay= cc.MenuItemSprite.create(
cc.Sprite.create(res.start_n_png), // normal state image
cc.Sprite.create(res.start_s_png), //select state image
this.onPlay, this);
var menu = cc.Menu.create(menuItemPlay); //7. create the menu
menu.setPosition(centerpos);
this.addChild(menu);
*/
},
onPlay : function(){
cc.log("==onplay clicked");
}
});
var MenuScene = cc.Scene.extend({
onEnter:function () {
this._super();
var layer = new MenuLayer();
//layer.init();
this.addChild(layer);
}
});
Here is the function call stack from chrome console in case it helps you:
Cocos2d-html5 v3.0 RC0 CCDebugger.js:284
Uncaught child already added. It can't be added again CCDebugger.js:307
cc.assert CCDebugger.js:307
cc.Node.cc.Class.extend.addChild CCNode.js:1191
cc.MenuItemSprite.cc.MenuItem.extend.setDisabledImage CCMenuItem.js:795
cc.MenuItemSprite.cc.MenuItem.extend.initWithNormalSprite CCMenuItem.js:819
cc.MenuItemSprite.cc.MenuItem.extend.ctor CCMenuItem.js:712
Class CCClass.js:128
cc.MenuItemSprite.create CCMenuItem.js:984
cc.Layer.extend.init app.js:28
(anonymous function) CCClass.js:169
cc.Scene.extend.onEnter app.js:49
(anonymous function) CCClass.js:169
cc.Director.cc.Class.extend.setNextScene CCDirector.js:515
cc.Director.cc.Class.extend.drawScene CCDirector.js:217
cc.DisplayLinkDirector.cc.Director.extend.mainLoop CCDirector.js:767
callback CCBoot.js:1497
Hi,
try replacing the following code to set up the disabled image, just to try if passing all the parameters the cc.MenuItemSprite works.
Replace this:
var menuItemPlay= cc.MenuItemSprite.create(
cc.Sprite.create(res.start_n_png), // normal state image
cc.Sprite.create(res.start_s_png), //select state image
this.onPlay, this);
using this:
var menuItemPlay= cc.MenuItemSprite.create(
cc.Sprite.create(res.start_n_png), // normal state image
cc.Sprite.create(res.start_s_png), //select state image
cc.Sprite.create(res.start_s_png), //disabled state image
this.onPlay, this);
1 Like
You have solved the problem. Can you please explain why this worked?
This must be a bug of cocos2d.
Instead of taking the third parameter as a callback it is taking it as the disabled state of the menu item and trying to add it as child, and since it is already added it shows the error message: Uncaught child already added. It can’t be added again CCDebugger.js