现在，我们已经在菜单上面做了大量文章了。可能你会问，我们还能干嘛？耐心点，我的朋友！今天我们将接触menu item的图片。很期待吧？呵呵
老实说，如果你没有图片资源，你啥事也做不好。你真的需要一些教程来教你如果为菜单定制图片，这也是这篇教程的来由。
这里有本教程的完整源代码。
好了，我们这次要完成哪些内容呢---下面是今天的日程表：
- 为所有已经存在的Layer添加一个BaseLayer作为背景。
- 给“Start Game”和“Credits”按钮添加“on”和“off”状态。也就是normal状态和selected状态。
我们将在上一篇教程的基础上完成工作，所以确保你有上一个教程的工程。首先，创建一个“BaseLayer”.h和.m文件，现在这个对你来说是小菜一碟了。但是，可别太得意哈，记住在“Classes”分组上面右击，选择“Add”，然后是”New Fild“。
一旦加好之后，首先打开BaseLayer.h：
#import "cocos2d.h" @interface BaseLayer : CCLayer { } @end
然后修改BaseLayer.m文件：
#import "BaseLayer.h" @implementation BaseLayer -(id) init{ self = [super init]; if(nil == self){ return nil; } self.isTouchEnabled = YES; CCSprite *bg = [CCSprite spriteWithFile: @"backgroud.png"]; bg.position = ccp(160,240); [self addChild: bg z:0]; return self; } @end
你可能看到了，这里用了“background.png”来创建精灵，所以，为了保证代码能够工作，你需要把这个背景图片添加到工程里面来。右击“Resources”分组，然后选择Add，到点击“Existing files”，然后从弹出的对话框里选择你需要的png文件，如下图所示：
如果这个文件不在实际的Resources目录下面，那么就要复选上“copy。。。”选项，把那个文件拷贝进来，如果本来就在Resources目录下面，那么就不用了。
然后，我们在每个Layer中导入BaseLayer。
MenuLayer.h:
#import "BaseLayer.h" @interface MenuLayer : BaseLayer {
PlayLayer.h:
#import "BaseLayer.h" @interface PlayLayer : BaseLayer {
CreditsLayer.h:
#import "BaseLayer.h" @interface CreditsLayer : BaseLayer {
在你完成之后，你将会看到每一层的背景显示下面的图片：（Credits，Menu和Play屏幕）
好，现在我们有背景了，那么菜单按钮呢？
我们首先需要创建它们，你可以使用Photoshop或者Fireworks去完成，但是，今天来说，这种方式有点过时了。今天，我将向大家介绍一个在线创建按钮图片的工具：
Button Generator
我使用上面的站点创建了四个图片了，每个菜单项对应两张图片：（对应两种状态）
- newGameBtn.png
- newGameBtn_over.png
- creditsBtn.png
- creditsBtn_over.png
因此，我们项目中有图片了，接下来呢？
首先，找到MenuLayer.m文件，把startNew从文本形式：
CCMenuItemFont *startNew = [CCMenuItemFont itemFromString:@"New Game" target:self selector: @selector(onNewGame:)];
改成图片形式：
CCMenuItemImage *startNew = [CCMenuItemImage itemFromNormalImage:@"newGameBtn.png" selectedImage:@"newGameBtn_over.png" disabledImage:@"newGameBtn.png" target:self selector:@selector(onNewGame:)];
disabledImage是可选的，如果你有一个disabled图片就更好了，其它我完全可以输入一个nil，但是，这里我只是向你展示，可以这样使用。
现在，编译并运行代码，玩一玩吧！：）
下篇教程见！
ps:如果大家有什么意见或建议，请在下方留言，谢谢！
最新评论