文本菜单类cc.MenuItemFont,它的其中一个构造函数定义如下:
ctor(value,//要显示的文本 callback,//菜单操作的回调函数指针 target)文本菜单类cc.MenuItemAtlasFont是基于图片集的文本菜单项,它的其中一个构造函数定义如下:
ctor (value,//要显示的文本 charMapFile,//图片集文件 itemWidth,//要截取的文字在图片中的宽度 itemHeight,//要截取的文字在图片中的高度 startCharMap //开始字符 callback ) //菜单操作的回调函数指针本节我们会通过一个实例介绍一下文本菜单的使用,这个实例如图4-12所示,其中菜单Start是使用cc.MenuItemFont实现的,菜单Help是使用cc.MenuItemAtlasFont实现的。
文本菜单实例
下面我们看看app.js 中HelloWorldLayer中初始化代码如下:
var HelloWorldLayer = cc.Layer.extend({ ctor:function () { this._super(); var size = cc.director.getWinSize(); var bg = new cc.Sprite(res.background_png); bg.x = size.width/2; bg.y = size.height/2; this.addChild(bg); cc.MenuItemFont.setFontName("Times New Roman"); ① cc.MenuItemFont.setFontSize(86); ② var item1 = new cc.MenuItemFont("Start",this.menuItem1Callback,this); ③ var item2 = new cc.MenuItemAtlasFont("Help",res.charmap_png,48,65,' ',this.menuItem2Callback,this); ④ var mn = new cc.Menu(item1,item2); ⑤ mn.alignItemsVertically(); ⑥ this.addChild(mn); ⑦ return true; },menuItem1Callback:function (sender) { cc.log("Touch Start Menu Item " + sender); },menuItem2Callback:function (sender) { cc.log("Touch Help Menu Item " + sender); } });上述代码第①和②行是设置文本菜单的文本字体和字体大小。第③行代码是创建cc.MenuItemFont菜单项对象,它是一个一般文本菜单项,构造函数的第一个参数是菜单项的文本内容,第二个参数是点击菜单项回调的函数指,this.menuItem1Callback是函数指针,this代表函数所在的对象。
第④行代码是创建一个cc.MenuItemAtlasFont菜单项对象,这种菜单项是基于图片集的菜单项。res.charmap_png变量也是在resource.js文件中定义的,表示"res/menu/tuffy_bold_italic-charmap.png"路径。
还有第⑤行代码var mn = new cc.Menu(item1,item2)是创建菜单对象,把之前创建的菜单项添加到菜单中。第⑥行代码mn.alignItemsVertically()是设置菜单项垂直对齐。第⑦行代码是this.addChild(mn)是把菜单对象添加到当前层中。
注意 上述代码第④行cc.MenuItemAtlasFont类在Web平台下运行正常作用,但是在JSB本地运行显示有误,我们可以使用下面代码替换。
var labelAtlas = new cc.LabelAtlas("Help",' '); var item2 = new cc.MenuItemLabel(labelAtlas,this );
更多内容请关注最新Cocos图书《
Cocos2d-x实战:JS卷——Cocos2d-JS开发》
本书交流讨论网站:http://www.c
欢迎加入Cocos2d-x技术讨论群:257760386
更多精彩视频课程请关注智捷课堂Cocos课程:http://v.51w智捷课堂现推出Cocos会员,敬请关注: http://v.51w