欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Cocos2d-x上适合做工具的UI库:ImGui

程序员文章站 2022-05-13 22:53:29
Cocos2d-x的控件类型仅限于基础的几种,如label、button、listview等,做游戏开发时基本够用了。但如果想用cocos2dx来做工具的话,那就有点困难了。 这里介绍一个适合做工具的UI库:ImGui, 地址:https://github.com/ocornut/imgui。核心文 ......

  cocos2d-x的控件类型仅限于基础的几种,如label、button、listview等,做游戏开发时基本够用了。但如果想用cocos2dx来做工具的话,那就有点困难了。

  这里介绍一个适合做工具的ui库:imgui, 地址:https://github.com/ocornut/imgui。核心文件仅有ui逻辑部分,可接入opengl/dx/cocos2d-x等多种渲染库。Cocos2d-x上适合做工具的UI库:ImGui核心只有4个文件,也是够小的了。

  github上有一个cocos2d-x lua版+imgui的库:https://github.com/c0i/imguix。由于此库年久失修,在这儿上传一个imgui1.6+cocos2d-x3.16的可用工程。地址:https://pan.baidu.com/s/1irnyw1pupvotie1kv06xkw, 效果如下图:Cocos2d-x上适合做工具的UI库:ImGui

   

  中文支持: 为imgui指定一个中文字库

imguiio& io = imgui::getio();
io.fonts->addfontfromfilettf("res/fzcuyuan-m03s.ttf", 18.0f, null, io.fonts->getglyphrangeschinese());

  渲染方式: 在cocos2dx中创建一个特殊的layer,所有imgui的内容显示在此layer之上。由于scene会在lua层指定,所以此处用了一个定时器来创建layer

director::getinstance()->getscheduler()->schedule([](float)
    {
        auto runningscene = director::getinstance()->getrunningscene();
        if (runningscene && !runningscene->getchildbyname("imguilayer"))
        {
            runningscene->addchild(imguilayer::create(), int_max, "imguilayer");
        }
    }, this, 0, false, "checkimgui");

  imgui lua版用法简介:

  在lua层创建一个imgui.draw函数,cocos2dx每帧渲染时都会来执行此函数,所有的imgui操作都需要在此函数内执行。所以如果在此函数内打印日志的话,将会惨不忍睹...

  lua层目前导出了button、text、 popupmodal、treenodeex等各种控件,更多可参见imgui_lua.cpp,imgui示例可参见imgui_demo.cpp。

  窗口和控件:成对出现。

  在imgui中,监听点击事件非常简单,判断函数的返回值即可:

if imgui.button("按钮") then
    print("点击按钮")
end

  在imgui中,控件创建时不需要指定位置,系统会自动排列位置并对齐。当然也可以调用imgui.setcursorpos或imgui.setnextwindowpos来指定位置。