《Cocos2d 跨平台游戏开发指南(第2版)》一2.4 使用CCMenu向场景添加按钮-阿里云开发者社区

开发者社区> 开发与运维> 正文

《Cocos2d 跨平台游戏开发指南(第2版)》一2.4 使用CCMenu向场景添加按钮

简介:

本节书摘来异步社区《Cocos2d 跨平台游戏开发指南(第2版)》一书中的第2章,第2.1节,作者: 【印度】Siddharth Shekar(谢卡)译者: 武传海 责编: 胡俊英,更多章节内容可以访问云栖社区“异步社区”公众号查看。

2.4 使用CCMenu向场景添加按钮

按钮是用来在不同场景之间进行导航的主要方式。在本部分中,我们将学习如何向场景中添加按钮。

2.4.1 准备工作

按钮与普通精灵类似,但是制作时,需要使用两张图片。一张图片用来在按钮常态下进行显示,即在按钮未按下时显示,另一张图片在按钮按下时显示。

学习本部分时,所需要的资源在本章的资源文件夹中有提供,针对于iPad与iPad HD共有4张图片,其中两张图片用来在按钮正常状态下(未按下)显示,另外两张在按钮按下时显示。复制4张图片到项目的Resource/Publishes-iOS文件夹下。

并且,在MenuScene.m文件顶部添加如下代码,导入Cocos2d-ui.h文件。当添加按钮与布局类时,需要导入该文件。

#import "cocos2d-ui.h"

2.4.2 操作步骤

前面我们已经在MenuScene.m文件中添加了文本描边代码,紧随其后,添加如下代码:

CCButton *playBtn = [CCButton buttonWithTitle:nil

  spriteFrame:[CCSpriteFrame
  frameWithImageNamed:@"playBtn_normal.png"]
  highlightedSpriteFrame:[CCSpriteFrame frameWithImageNamed:@
  "playBtn_pressed.png"]

disabledSpriteFrame:nil];

制作按钮时,我们必须使用CCButton类,它带有4个参数,分别为按钮标题、常态下的spriteFrame参数、高亮或按下时的精灵帧,以及按钮不可用时的精灵帧。

本示例中,我们只传入两张图片:一张是按钮在常态下显示的图片,另一张是按钮按下时要显示的图片。

此时,如果运行项目,我们不会在屏幕上看到按钮。这是因为我们还没有把按钮添加到场景中。在把按钮添加到场景之前,需要先把它们添加到一个CCLayout类型的按钮菜单中,然后再把它们添加到场景之中。

为此,让我们先创建一个CCLayout类型的变量,代码如下:

CCLayoutBox * btnMenu;
   btnMenu = [[CCLayoutBox alloc] init];
   btnMenu.anchorPoint = ccp(0.5f, 0.5f);
   btnMenu.position = CGPointMake(winSize.width/2,
     winSize.height * 0.5);
   [btnMenu addChild:playBtn];

   [self addChild:btnMenu];

在上面代码中,我们创建了一个名称为btnMenu的CCLayout类型的变量,而后为它分配内存并进行初始化。接着,我们把按钮的锚点设置为center,不然所有按钮都会被定位到按钮菜单的左下位置。然后,把按钮菜单放置到屏幕中心。

最后,我们把playBtn按钮添加到btnMenu中,再把btnMenu本身添加到场景中,如图2-4所示。


2_4

现在,我们就可以在屏幕上看到添加好的按钮了。并且,当我们按下按钮时,按钮上的显示图片将被替换为按钮按下时的图片。

为了让按钮执行某个动作,我们需要在按钮按下且被释放时调用一个函数。

首先,在playBtn变量之后,添加如下粗体代码。

CCButton *playBtn = [CCButton buttonWithTitle:nil
  spriteFrame:[CCSpriteFrame frameWithImageNamed:@"playBtn_normal.
png"]
  highlightedSpriteFrame:[CCSpriteFrame frameWithImageNamed:@
  "playBtn_pressed.png"]
  disabledSpriteFrame:nil];

[playBtn setTarget:self selector:@selector(playBtnPressed:)];

然后,再添加如下代码,当按下并释放按钮时将执行它。

-(void)playBtnPressed:(id)sender{

  CCLOG(@"play button pressed");

}

2.4.3 工作原理

在上述代码中,我们把playBtnPressed函数指派给了playBtn按钮。这样一来,当按下并释放按钮时,playBtnPressed函数就会被调用执行,目前它只是在控制台上输出一段文字,用来告诉我们按钮被按下了。

当按下并释放按钮时,你将看到控制台高亮显示,并且在其中看到输出如图2-5所示的文本内容。


2_5

版权声明:本文首发在云栖社区,遵循云栖社区版权声明:本文内容由互联网用户自发贡献,版权归用户作者所有,云栖社区不为本文内容承担相关法律责任。云栖社区已升级为阿里云开发者社区。如果您发现本文中有涉嫌抄袭的内容,欢迎发送邮件至:developer2020@service.aliyun.com 进行举报,并提供相关证据,一经查实,阿里云开发者社区将协助删除涉嫌侵权内容。

分享:
开发与运维
使用钉钉扫一扫加入圈子
+ 订阅

集结各类场景实战经验,助你开发运维畅行无忧

其他文章