今天要说的内容比较轻松, 重要的知识点不多.
目标是实现Menus & Items
, Sprites & 9 Slice
, Buttons & Labels
.
1
首先我们在CocosBuilder中建立一个新的Header.ccb
.具体请参见CocosBuilder的项目.
在创建的时候,勾选Full Sceen
, 并且将分辨率的Height
都修改为40.
这个文件很简单, 根节点下只包含一个CCLayerColor
,根节点的Custom class
设置为HeaderLayer
.
CCLayerColor
下面包含一个CCLabelTTF
和CCMenu
.
CCLabelTTF
的变量绑定为类型Owner var
, 值为mTitleLabelTTF
.
CCMenu
包含一个CCMenuItemImage
. CCMenuItemImage
的Selector
属性设置为onBackClicked
.
这个ccb作为一个公用的元素被其他ccb文件所引用. 是属于模块化的一个例子.
然后我们在Xcode中新建一个HeaderLayer
类, 并同时声明一个HeaderLayerLoader
类.
HeaderLayer.h
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
| class HeaderLayer
: public cocos2d::CCLayer
, public cocos2d::extension::CCBSelectorResolver
{
public:
CCB_STATIC_NEW_AUTORELEASE_OBJECT_WITH_INIT_METHOD(HeaderLayer, create);
virtual cocos2d::SEL_MenuHandler onResolveCCBCCMenuItemSelector(CCObject * pTarget, const char* pSelectorName);
virtual cocos2d::extension::SEL_CCControlHandler onResolveCCBCCControlSelector(CCObject * pTarget, const char* pSelectorName);
void onBackClicked(CCObject *pSender);
};
class HeaderLayerLoader : public cocos2d::extension::CCLayerLoader
{
public:
CCB_STATIC_NEW_AUTORELEASE_OBJECT_METHOD(HeaderLayerLoader, loader);
protected:
CCB_VIRTUAL_NEW_AUTORELEASE_CREATECCNODE_METHOD(HeaderLayer);
};
|
HeaderLayer.cpp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| SEL_MenuHandler HeaderLayer::onResolveCCBCCMenuItemSelector(cocos2d::CCObject *pTarget, const char *pSelectorName)
{
CCB_SELECTORRESOLVER_CCMENUITEM_GLUE(this, "onBackClicked", HeaderLayer::onBackClicked);
return NULL;
}
SEL_CCControlHandler HeaderLayer::onResolveCCBCCControlSelector(cocos2d::CCObject *pTarget, const char *pSelectorName)
{
return NULL;
}
void HeaderLayer::onBackClicked(cocos2d::CCObject *pSender)
{
CCDirector::sharedDirector()->popScene();
}
|
2
在CocosBuilder中新建一个Menus.ccb
, 并将根节点Custom class
设置为MenuLayer
.
再加入几个CCMenuItemImage
, Selector分别设置为onPressA
, onPressB
, onPressC
.
再加入一个CCLabelBMFont
, 绑定Doc root var
, 值为mMessageLabelBMFont
.
在Xcode中新建一个类MenuLayer
, 并且在MenuLayer.h
中同时声明一个MenuLayerLoader
类.
MenuLayer.h
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
| class MenuLayer
: public cocos2d::CCLayer
, public cocos2d::extension::CCBMemberVariableAssigner
, public cocos2d::extension::CCBSelectorResolver
{
public:
MenuLayer();
~MenuLayer();
CCB_STATIC_NEW_AUTORELEASE_OBJECT_WITH_INIT_METHOD(MenuLayer, create);
virtual bool onAssignCCBMemberVariable(CCObject* pTarget, const char* pMemberVariableName, CCNode* pNode);
virtual cocos2d::SEL_MenuHandler onResolveCCBCCMenuItemSelector(CCObject * pTarget, const char* pSelectorName);
virtual cocos2d::extension::SEL_CCControlHandler onResolveCCBCCControlSelector(CCObject * pTarget, const char* pSelectorName);
void onPressA(cocos2d::CCObject *pSender);
void onPressB(cocos2d::CCObject *pSender);
void onPressC(cocos2d::CCObject *pSender);
private:
cocos2d::CCLabelBMFont *mMessageLabelBMFont;
};
class MenuLayerLoader : public cocos2d::extension::CCNodeLoaderLibrary
{
public:
CCB_STATIC_NEW_AUTORELEASE_OBJECT_METHOD(MenuLayerLoader, loader);
protected:
CCB_VIRTUAL_NEW_AUTORELEASE_CREATECCNODE_METHOD(MenuLayer);
};
|
MenuLayer.cpp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
| MenuLayer::MenuLayer()
: mMessageLabelBMFont(NULL)
{}
MenuLayer::~MenuLayer()
{
CC_SAFE_DELETE(mMessageLabelBMFont);
}
bool MenuLayer::onAssignCCBMemberVariable(cocos2d::CCObject *pTarget, const char *pMemberVariableName, cocos2d::CCNode *pNode)
{
CCB_MEMBERVARIABLEASSIGNER_GLUE(this, "mMessageLabelBMFont", CCLabelBMFont*, this->mMessageLabelBMFont);
return false;
}
SEL_MenuHandler MenuLayer::onResolveCCBCCMenuItemSelector(cocos2d::CCObject *pTarget, const char *pSelectorName)
{
CCB_SELECTORRESOLVER_CCMENUITEM_GLUE(this, "onPressA", MenuLayer::onPressA);
CCB_SELECTORRESOLVER_CCMENUITEM_GLUE(this, "onPressB", MenuLayer::onPressB);
CCB_SELECTORRESOLVER_CCMENUITEM_GLUE(this, "onPressC_NO_Match", MenuLayer::onPressC);
//注意这里, 我们给第三个绑定了一个不存在的SelectorName.
return NULL;
}
SEL_CCControlHandler MenuLayer::onResolveCCBCCControlSelector(cocos2d::CCObject *pTarget, const char *pSelectorName)
{
return NULL;
}
void MenuLayer::onPressA(cocos2d::CCObject *pSender)
{
this->mMessageLabelBMFont->setString("A pressed.");
}
void MenuLayer::onPressB(cocos2d::CCObject *pSender)
{
this->mMessageLabelBMFont->setString("B pressed.");
}
void MenuLayer::onPressC(cocos2d::CCObject *pSender)
{
this->mMessageLabelBMFont->setString("C pressed.");
}
|
3
或许有点着急了吧, 我们如何让这个运行起来呢?
首先给MainScene
增加一个新函数的声明及定义, 还需要增加一个变量用于和Header.ccb
中的mTitleLabelTTF
绑定.
MainScene.h
1
2
3
4
| public:
void openTest(const char * pCCBFileName, const char * pCCNodeName = NULL, cocos2d::extension::CCNodeLoader * pCCNodeLoader = NULL);
private:
cocos2d::CCLabelTTF *mTitleLabelTTF;
|
MainScene.cpp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
| void MainScene::openTest(const char * pCCBFileName, const char * pCCNodeName, cocos2d::extension::CCNodeLoader * pCCNodeLoader)
{
CCScene *scene = CCScene::create();
CCNodeLoaderLibrary *lib = CCNodeLoaderLibrary::newDefaultCCNodeLoaderLibrary();
lib->registerCCNodeLoader("HeaderLayer", HeaderLayerLoader::loader());
lib->registerCCNodeLoader(pCCNodeName, pCCNodeLoader);
CCBReader *reader = new CCBReader(lib);
CCNode *node = reader->readNodeGraphFromFile(pCCBFileName, this);
reader->autorelease();
if (node != NULL)
{
scene->addChild(node);
}
this->mTitleLabelTTF->setString(pCCBFileName);
CCDirector::sharedDirector()->pushScene(scene);
}
bool MainScene::onAssignCCBMemberVariable(cocos2d::CCObject *pTarget, const char *pMemberVariableName, cocos2d::CCNode *pNode)
{
CCB_MEMBERVARIABLEASSIGNER_GLUE(this, "mLabelText", CCLabelBMFont*, this->mLabelText);
CCB_MEMBERVARIABLEASSIGNER_GLUE(this, "mTitleLabelTTF", CCLabelTTF*, this->mTitleLabelTTF);
return false;
}
void MainScene::onButtonTest(cocos2d::CCObject *pSender, cocos2d::extension::CCControlEvent pCCControlEvent)
{
this->openTest("ccb/Menus.ccbi", "MenuLayer", MenuLayerLoader::loader());
}
|
4
Sprites & 9 Slice
这个比较简单, 只是靠CocosBuilder就能完成任务了.
![](http://young40.github.com/upload/2012-12/ccb-sbs-3-001.png)
我拼的不太好, 嘿嘿. 主要是着重代码, 并非设计, 漂亮的事情交给美术妹纸吧.
5
Buttons
这块主要是研究了CCControlEvent
的各种情况. 我们只贴出核心代码.
ButtonsLayer.cpp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
| void ButtonsLayer::onBtnClicked(cocos2d::CCObject *pSender, cocos2d::extension::CCControlEvent pCCControlEvent)
{
switch (pCCControlEvent) {
case CCControlEventTouchCancel:
this->mEventLabelBMFont->setString("Cancel");
break;
case CCControlEventTouchDown:
this->mEventLabelBMFont->setString("Touch Down");
break;
case CCControlEventTouchDragEnter:
this->mEventLabelBMFont->setString("Drag Enter");
break;
case CCControlEventTouchDragExit:
this->mEventLabelBMFont->setString("Drag Exit");
break;
case CCControlEventTouchDragInside:
this->mEventLabelBMFont->setString("Drag Inside");
break;
case CCControlEventTouchDragOutside:
this->mEventLabelBMFont->setString("Drag OutSide");
break;
case CCControlEventTouchUpInside:
this->mEventLabelBMFont->setString("Up Inside");
break;
case CCControlEventTouchUpOutside:
this->mEventLabelBMFont->setString("Up Outside");
break;
default://所有的定义都在上面了,TestCPP里面有句经典的点评, 想看的可以去翻一下.
break;
}
}
|
![](http://young40.github.com/upload/2012-12/ccb-sbs-3-002.png)
代码打包下载:下载点
谢谢您耐心看完此文, 希望能对您有些帮助.如果有什么问题, 意见, 建议, 拍砖, 欢迎留言或者联系我.
新浪微博: @杨世玲 http://weibo.com/young40