首页 > 代码库 > Cocos2d-x3.0游戏实例之《别救我》第六篇——从代码中获取UI控件

Cocos2d-x3.0游戏实例之《别救我》第六篇——从代码中获取UI控件

2024-07-03 07:40:13   224人阅读

 

这篇的内容很简单，获取UI控件，然后使用它。

 

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

现在要用上了。

 

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

转载请注明，原文地址： http://www.benmutou.com/blog/archives/918

文章来源：笨木头与游戏开发

 

根据名字查找控件

首先给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.     /* 获取按钮对象 */
  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里面找控件，一层层的找，父控件找不到，就找子控件，如此递归，最后找的名字相符的控件，返回这个控件对象。

 

很简单，不多解释喇~

 

添加按钮回调事件

OK，最后一步了，现在按钮摆在那里什么都做不了，我们给按钮添加回调事件~

 

先给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.     /* 获取按钮对象 */
  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.     /* 添加按钮回调事件 */
  23.     leftBtn->addTouchEventListener(this, toucheventselector(TollgateScene::moveToLeft));
  25.     rightBtn->addTouchEventListener(this, toucheventselector(TollgateScene::moveToRight));
  27.     quickMoveBtn->addTouchEventListener(this, toucheventselector(TollgateScene::moveToRight));
  29. }

 

利用addTouchEventListener函数就可以绑定按钮的回调事件了~

 

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

  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. }

是不是感觉有点小复杂？

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

如果大家觉得麻烦，可以自己改源码，添加一些函数，在绑定按钮事件的时候，可以指定绑定哪种事件。以及可以使用std::function来作为参数，这样很方便，当然，跑题了。为了避免大家混乱，这里就不介绍了。

 

运行测试

OK，现在大家运行游戏，然后点击这三个操作按钮，看看主角是不是能左右移动以及放屁（向下冲）吧~

 

 

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

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

惩罚的方式就是加血~

 

 


联系
我们