【地球人..学习cocos2d-x】学习实践之逐步变强的HelloWorld(上集)

 

 

1.       在HelloWorld之前

因为我准备按照第一篇教程里教我的东西，一步步从简单到难写成多个Demo，于是我又不想新建那么多项目，所以，是的~我们需要一个菜单界面。

要创建很难，很多步，别激动，慢慢来，噗：

1. 首先我们需要一个CCMenu对象，它是一个菜单对象，当然菜单是可以包含子菜单的。
2. 然后我们需要子菜单，在cocos2d-x里子菜单就是CCMenuItem，但是Item的类别有很多，在这里，我选择文字标签Item：CCMenuItemLabel
3. CCMenu需要一个CCMenuItemLabel，同样CCMenuItemLabel它只是一个Item，而它又要作为一个标签Item，所以它需要一个标签对象：CCLabelTTF
4. 于是，整个步骤就是，一个CCLabelTTF对象添加到一个CCMenuItemLabel对象，然后CCMenuItemLabel对象再添加到CCMenu里。

 

好了，废话多了，看代码：

/* 创建一个Label对象 */ CCLabelTTF* helloWorldLab1 = CCLabelTTF::create("HelloWorld1", "Arial", 35);          /* 创建一个CCMenuItemLabel对象，需要Label对象作为参数 */ CCMenuItemLabel* helloWorldItem1 = CCMenuItemLabel::create(             helloWorldLab1,             this,             menu_selector(MenuScene::showHelloWorld1));   /* 创建一个CCMenu对象，需要Item对象作为参数 */ CCMenu* menu = CCMenu::create(helloWorldItem1, NULL);   /* 最后将CCMenu菜单添加到场景中 */ this->addChild(menu);

 

menu_selector，没有人想好奇一下这个是什么吗？虽然它的内在原理我现在还没懂，但是我知道它相当于一个回调功能。当菜单的Item对象被点击之后，会调用

showHelloWorld1函数。也就是说，我们可以在这里设置点击菜单项之后要做的事情。

 

2.    第一个HelloWorld

现在来一个最简单的吧：

CCSprite* backgroundSprite = CCSprite::create("HelloWorld.png"); this->addChild(backgroundSprite);

就这样，最普通的创建一个精灵的方式。

 

友情提示：如果对C++语法也不熟悉的朋友（比如我，噗），最好自己一点点写，重新写一个场景类，包括它的头文件，cpp文件。

 

3.       第二个-使用TexturePacker打包后的图片创建精灵

关于TexturePacker的使用我就不说了，大牛的教程里讲得很详细了。另外一提，TexturePacker并不是万能的，千万不要过度依赖，本人亲测，如果用TexturePacker打包的图片有过多空白冗余的地方，将会适得其反地使得图片更加占用内存（和打包之前相比）。所以，打包的时候一定要用心，尽量减少空白的地方。

 

嗯，然后，为了添加第二个Demo，我需要在菜单里加入第二个Item对象，于是，看看：

/* 获取屏幕大小*/ CCSize size = CCDirector::sharedDirector()->getWinSize(); CCLabelTTF* itemLab = NULL;   /* Demo1-最简单的方式创建一个精灵*/ itemLab = CCLabelTTF::create("HelloWorld1", “Arial”, 30); CCMenuItemLabel* helloWorldItem1 = CCMenuItemLabel::create(        itemLab,        this,        menu_selector(MenuScene::showHelloWorld1));   /* Demo2-使用TexturePacker打包后的图片创建一个精灵*/ itemLab = CCLabelTTF::create("HelloWorld2", “Arial”, 30); CCMenuItemLabel * helloWorldItem2 = CCMenuItemLabel::create( itemLab,         this,         menu_selector(MenuScene::showHelloWorld2));   /* 创建菜单*/ CCMenu* menu = CCMenu::create(); menu->setPosition(ccp(size.width / 2, size.height / 2));   /* 添加所有Item到菜单中*/ menu->addChild(helloWorldItem1); menu->addChild(helloWorldItem2);   /* 自动按垂直方向排列子Item */ menu->alignItemsVertically();         this->addChild(menu);

前面的创建Item就不说了，我想说说红色加粗的部分，向菜单添加Item对象和向场景添加精灵的方式是一样的，用addChild就可以了，很方便。

然后，刚开始我发现直接这样add进入的Item全都挤在一起了，于是我首先想到用setPosition

，当然，结果是成功的。可是，后来我想，cocos2d-x这么强大，应该有自动排列才对的，于是我找了一下CCMenu的函数，发现了这个alignItemsVertically()，让子Item按垂直方向自动排队~很好用，噗。

 

然后进入正题，先打包好图片，得到两个文件：images.plist、images.png。我比较懒，直接从大牛的教程里下载的…然后看代码：

/* 将图片加载到缓存池中*/ CCSpriteFrameCache* cache = CCSpriteFrameCache::sharedSpriteFrameCache(); cache->addSpriteFramesWithFile("images.plist", "images.png");   CCSize size = CCDirector::sharedDirector()->getWinSize();   /* 使用TexturePacker打包图片后创建精灵的方式*/ CCSprite* people = CCSprite::spriteWithSpriteFrameName("p6.png"); people->setPosition(ccp(size.width / 2, size.height / 2));   this->addChild(people);

好了，你懂了，不说了。

噗，开玩笑的。CCSpriteFrameCache是缓存池，存放所有CCSpriteFrame对象的地方，用addSpriteFramesWithFile方法把打包好的图片解析成CCSpriteFrame对象，然后放到缓存池里。

于是，创建精灵的时候就直接用图片打包前各自的名字就可以了，比如下图中的箭头所指的那个图片（由于怕你们看不到它，所以我稍微多用了2个箭头，是2个么？应该是的= =）：

 

它在打包前有自己的文件名的，叫做”p6.png”，于是，我想用这个小人图片创建一个精灵，就这样：

CCSprite* people = CCSprite::spriteWithSpriteFrameName("p6.png");

 

 

好了，这就是第二个HelloWorld了。

 

待续…