这篇的内容非常easy，获取UI控件，然后使用它。

 

还记得我们在UI编辑器中给三个button分别命名了吧？

如今要用上了。

 

笨木头花心贡献，啥？花心？不呢，是用心~

转载请注明，原文地址： 

文章来源：

 

依据名字查找控件

首先给TollgateScene再include一些头文件，不然等会编译又报错了：

1. #include "editor-support/cocostudio/CCSGUIReader.h"
3. #include "cocostudio/CocoStudio.h"
5. #include "ui/CocosGUI.h"
7. using namespace cocos2d::ui;
9. using namespace cocostudio;

 

上面就是比較完整的使用UI所须要用到的头文件了。

 

然后，获取UI控件的方法例如以下，继续改动createOprUI函数：

1. void TollgateScene::createOprUI()
3. {
5.     auto UI = cocostudio::GUIReader::getInstance()->widgetFromJsonFile("OprUI_1.ExportJson");
7.     this->addChild(UI);
9.  
11.     /* 获取button对象 */
13.     Button* rightBtn = (Button*)Helper::seekWidgetByName(UI, "rightBtn");
15.     Button* quickMoveBtn = (Button*)Helper::seekWidgetByName(UI, "quickMoveBtn");
17.     Button* leftBtn = (Button*)Helper::seekWidgetByName(UI, "leftBtn");
19. }

Helper::seekWidgetByName函数会从UI里面找控件，一层层的找。父控件找不到，就找子控件。如此递归。最后找的名字相符的控件，返回这个控件对象。

 

非常easy，不多解释喇~

 

加入button回调事件

OK，最后一步了，如今button摆在那里什么都做不了，我们给button加入回调事件~

 

先给TollgateScene加入三个函数声明：

1.     void moveToLeft(Ref* sender, TouchEventType type);
3.     void moveToRight(Ref* sender, TouchEventType type);
5.     void quickMove(Ref* sender, TouchEventType type);

这是Button点击事件回调时所须要的函数格式。

 

然后。继续改动createOprUI函数：

1. void TollgateScene::createOprUI()
3. {
5.     auto UI = cocostudio::GUIReader::getInstance()->widgetFromJsonFile("OprUI_1.ExportJson");
7.     this->addChild(UI);
9.  
11.     /* 获取button对象 */
13.     Button* rightBtn = (Button*)Helper::seekWidgetByName(UI, "rightBtn");
15.     Button* quickMoveBtn = (Button*)Helper::seekWidgetByName(UI, "quickMoveBtn");
17.     Button* leftBtn = (Button*)Helper::seekWidgetByName(UI, "leftBtn");
19.  
21.     /* 加入button回调事件 */
23.     leftBtn->addTouchEventListener(this, toucheventselector(TollgateScene::moveToLeft));
25.     rightBtn->addTouchEventListener(this, toucheventselector(TollgateScene::moveToRight));
27.     quickMoveBtn->addTouchEventListener(this, toucheventselector(TollgateScene::quickMove));
29. }

 

利用addTouchEventListener函数就能够绑定button的回调事件了~

 

最后了。看看三个回调函数的实现：

1. void TollgateScene::moveToLeft(Ref* sender, TouchEventType type)
3. {
5.     switch (type)
7.     {
9.     case TOUCH_EVENT_ENDED:
11.         m_player->moveToLeft();
13.         break;
15.  
17.     }
19. }
21.  
23. void TollgateScene::moveToRight(Ref* sender, TouchEventType type)
25. {
27.     switch (type)
29.     {
31.     case TOUCH_EVENT_ENDED:
33.         m_player->moveToRight();
35.         break;
37.  
39.     }
41. }
43.  
45. void TollgateScene::quickMove(Ref* sender, TouchEventType type)
47. {
49.     switch (type)
51.     {
53.     case TOUCH_EVENT_ENDED:
55.         m_player->quickMove();
57.         break;
59.  
61.     }
63. }

是不是感觉有点小复杂？

应该说。有点小麻烦，由于button事件绑定的时候。是没有区分“按下”、“移动”、“松开”的，所以我们要自己推断一下，TOUCH_EVENT_ENDED就是button点击，然后松开的时候的事件。

假设大家认为麻烦，能够自己改源代码，加入一些函数，在绑定button事件的时候。能够指定绑定哪种事件。

以及能够使用std::function来作为參数，这样非常方便，当然，跑题了。为了避免大家混乱，这里就不介绍了。

 

执行測试

OK，如今大家执行游戏。然后点击这三个操作button，看看主角是不是能左右移动以及放屁（向下冲）吧~

 

 

下一篇，加入碰撞检測，让主角碰到墙壁之后，进行加血。

没错，就是加血。不是扣血~由于《别救我》胜利的条件是血量为0。碰到墙是要惩处的~

惩处的方式就是加血~