关闭

闲得无聊 之 Cocos2d html5引擎 显示一张图片

3637人阅读 评论(0) 收藏 举报
分类:

http://www.cocos2d-x.org/projects/cocos2d-x/wiki/Download 下载cocos2d html5发布包,

在Demo目录中按照HelloDomMenu例子建立相同文件结构的helloworld目录,cocos2d.js和main.js就直接复制好了,之后再做修改。

准备一张图片mogu_bg.jpg复制到res中,图片大小无所谓

在src中创建MenuLayer.js

var MenuLayer = cc.Layer.extend({
	init:function(){
		var self = this;
		var bRet = false;
        if (this._super()) {
			var winSize = cc.Director.getInstance().getWinSize();
			
			//create background
			var bg = cc.Sprite.create(s_begin_bg);
			bg.setPosition(cc.p(winSize.width/2, winSize.height/2));
			bg.setVisible(true);
			self.addChild(bg, 0);
			
			bRet = true;
		}
		return bRet;
	}
});

var MenuScene = cc.Scene.extend({
	onEnter:function(){
		var self = this;
		self._super();
		var layer = new MenuLayer();
		layer.init();
		self.addChild(layer);
	}
});
首先从s_begin_bg(图片)创建一个sprite,然后把sprite添加到创建的layer中, 图片资源可以在资源文件中配置好,

在src中创建Resources.js

var dirImg = "res/";
//image
var s_begin_bg = dirImg + "mogu_bg.jpg";

//sound

var g_resources = [
	{type:"image", src:s_begin_bg}
];
创建完简单的layer之后, 在cocos2d.js和main.js中做相关的修改

cocos2d.js中修改appFiles 的值,把Resources.js和MenuLayer.js都加进去

main.js中修改 var myApp = new cocos2dApp(MenuScene); MenuScene是MenuLayer.js中创建的Scene


一切就绪之后把cocos2d html5整个目录拷贝到任意的apache服务器,http://localhost/cocos2d-html5/Demo/helloworld/ 就会出现这张图片了。^ ^


0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:328813次
    • 积分:3794
    • 等级:
    • 排名:第9396名
    • 原创:77篇
    • 转载:16篇
    • 译文:0篇
    • 评论:100条
    最新评论