首页 > 代码库 > 《开发之旅》学习笔记:游戏界面手动打造菜单基础元素

《开发之旅》学习笔记:游戏界面手动打造菜单基础元素

one,two,three,four,five为menu上的不同的item创建方法。
alignItemsVerticallyWithPadding为当中一种对齐方式,其它对齐方式包含:
menm.alignItemsHorizontally()
menm.alignItemsHorizontallyWithPadding()
menu.alignItemsInColumns()
menu.alignItemsInRows()
menm.alignItemsVertically()



DEMO代码例如以下:
/**
 * Created by Administrator on 2015/7/21.
 */

var interFaceLayer = cc.Layer.extend({
ctor: function () {
this._super();

var one = new cc.MenuItemFont(‘one‘,this.gogame,this);
var two = new cc.MenuItemImage(res.CloseNormal_png,res.CloseSelected_png,this.gogame,this);
var three = new cc.MenuItemSprite(new cc.Sprite(res.CloseNormal_png),new cc.Sprite(res.CloseSelected_png),this.gogame,this);
var four = new cc.MenuItemLabel(new cc.LabelTTF(‘startgame‘,‘Arial‘,32),this.gogame,this);
var five = new cc.MenuItemToggle(new cc.MenuItemFont(‘off‘),new cc.MenuItemFont(‘on‘),this.gogame,this);

var menu = new cc.Menu(one,two,three,four,five);
menu.alignItemsVerticallyWithPadding(20);    //对齐方式
this.addChild(menu);

    },
gogame: function () {
cc.log(‘game‘);
    }
});

var interFaceScene = cc.Scene.extend({
onEnter: function () {
this._super();
var iface = new interFaceLayer();
this.addChild(iface);
    }
});




《开发之旅》学习笔记:游戏界面手动打造菜单基础元素