作者:Allenice
原地址: http://blog.csdn.net/allenice1/article/details/7745227
本笔记只写文字菜单,其他种类的菜单与文字菜单差不多。
1.菜单的创建
复制代码
效果如图:
再添加一个菜单项,文字颜色设成黑色
复制代码
复制代码
认真看一下,其实这两个菜单重叠了。现在移动一下menuItem2的位置
复制代码
这里又要讲一下锚点和坐标原点,不过,先设置一下menu的位置
复制代码
通过这三张图片可以看出,menu一开始的位置是屏幕的中间,锚点是自身的中间,坐标原点是左下角。menuItem的锚点也是自身的中间,但是坐标的原点是menu的锚点,初始位置是0,0。
现在还原成第二张图,然后设置一下位置:
复制代码
2. 菜单选中后的操作我们需要处理某菜单选中后的操作。比如menuItem1被选中(点击或触摸),这要改一下代码,和添加一个处理操作的方法:
MenuTest添加一个方法,方法的e参数是该菜单项,即menuItem1
复制代码
复制代码
点击menuItem1 ,效果如图:
3. 场景转换cocos2d有很多种类的场景转换,使用方法也差不多,我只写一种,其他的就要自己看API了(cc.Scene)。
第一个场景是现在这个绿色场景,第二个是我之前做的黄色场景。我们的目的是点击menuItem2,然后第二个场景用0.5秒从左到右出来。主要代码如下:
复制代码
复制代码
原地址: http://blog.csdn.net/allenice1/article/details/7745227
本笔记只写文字菜单,其他种类的菜单与文字菜单差不多。
1.菜单的创建
- var MenuTest=cc.Layer.extend({
- init:function () {
-
- //创建一个绿色层
- var greenLayer=cc.LayerColor.create(cc.ccc4(0,255,0,255),320,480);
-
- //创建菜单文字菜单要用到的Label
- var menuLabel1=cc.LabelTTF.create("menuItem1","Arial",20);
-
- //创建菜单项(MenuItem)
- var menuItem1=cc.MenuItemLabel.create(menuLabel1);
-
- //创建游戏菜单(Menu)
- var menu=cc.Menu.create(menuItem1);
-
- //将菜单添加到绿色层里
- greenLayer.addChild(menu);
- this.addChild(greenLayer);
-
- return true;
- }
- });
再添加一个菜单项,文字颜色设成黑色
- var menuLabel2=cc.LabelTTF.create("menuItem2","Arial",20);
- var menuItem2=cc.MenuItemLabel.create(menuLabel2);
- menuLabel2.setColor(cc.ccc3(0,0,0));
cc.Menu.create要改一下,将menuItem2添加到Menu中
- var menu=cc.Menu.create(menuItem1,menuItem2);
效果如图:
认真看一下,其实这两个菜单重叠了。现在移动一下menuItem2的位置
- menuItem2.setPosition(cc.ccp(100,100));
效果如图
这里又要讲一下锚点和坐标原点,不过,先设置一下menu的位置
- menu.setPosition(cc.ccp(100,100));
效果如图:
通过这三张图片可以看出,menu一开始的位置是屏幕的中间,锚点是自身的中间,坐标原点是左下角。menuItem的锚点也是自身的中间,但是坐标的原点是menu的锚点,初始位置是0,0。
现在还原成第二张图,然后设置一下位置:
- menuItem1.setPosition(cc.ccp(0,30));
- menuItem2.setPosition(cc.ccp(0,-30));
效果如下:
2. 菜单选中后的操作我们需要处理某菜单选中后的操作。比如menuItem1被选中(点击或触摸),这要改一下代码,和添加一个处理操作的方法:
MenuTest添加一个方法,方法的e参数是该菜单项,即menuItem1
- menu1Selected:function (e) {
- window.alert(e.getLabel().getString());
- }
- var menuItem1=cc.MenuItemLabel.create(menuLabel1,this,this.menu1Selected);
3. 场景转换cocos2d有很多种类的场景转换,使用方法也差不多,我只写一种,其他的就要自己看API了(cc.Scene)。
第一个场景是现在这个绿色场景,第二个是我之前做的黄色场景。我们的目的是点击menuItem2,然后第二个场景用0.5秒从左到右出来。主要代码如下:
- var scene2=Yellow.scene();
- var tranScene=cc.TransitionMoveInL.create(0.5,scene2);
- cc.Director.sharedDirector().replaceScene(tranScene);
- var MenuTest=cc.Layer.extend({
- init:function () {
-
- //创建一个绿色层
- var greenLayer=cc.LayerColor.create(cc.ccc4(0,255,0,255),320,480);
-
- //创建菜单文字菜单要用到的Label
- var menuLabel1=cc.LabelTTF.create("menuItem1","Arial",20);
- var menuLabel2=cc.LabelTTF.create("menuItem2","Arial",20);
-
-
- //创建菜单项(MenuItem)
- var menuItem1=cc.MenuItemLabel.create(menuLabel1,this,this.menu1Selected);
- var menuItem2=cc.MenuItemLabel.create(menuLabel2,this,this.menu2Selected);
-
- //创建游戏菜单(Menu)
- var menu=cc.Menu.create(menuItem1,menuItem2);
-
- //将菜单添加到绿色层里
- greenLayer.addChild(menu);
- this.addChild(greenLayer);
-
- //设置
- menuLabel2.setColor(cc.ccc3(0,0,0));
- menuItem1.setPosition(cc.ccp(0,30));
- menuItem2.setPosition(cc.ccp(0,-30));
-
- return true;
- },
- menu1Selected:function (e) {
- window.alert(e.getLabel().getString());
- },
- menu2Selected:function (e) {
- var scene2=Yellow.scene();
- var tranScene=cc.TransitionMoveInL.create(0.5,scene2);
- cc.Director.sharedDirector().replaceScene(tranScene);
- }
- });