Dear ImGui
Dear ImGui 是一个 C++ 的 Bloat-free 立即模式图形用户界面库。它输出优化的顶点缓冲区,您可以随时在启用 3D 管道的应用程序中渲染。它是快速的、可移植的,渲染器不可知且独立的(无需外部依赖)。
Dear ImGui 旨在实现快速迭代,并允许程序员创建内容创建工具和可视化调试工具(相对于普通终端用户的UI)。它倾向于简单和高效的实现这一目标,因此缺乏通常在更高级别的库中发现的某些功能。
Dear ImGui 特别适合于集成到游戏引擎(用于工具)、实时 3D 应用程序、全屏应用程序、嵌入式应用程序或任何控制台平台上的应用程序(其中操作系统特性是非标准的)。
请参阅 使用 dear imgui, Quotes 和 Gallery 页面以了解它的用例。
Dear ImGui 包含在几个文件中,您可以轻松地将其复制并编译到您的应用程序引擎中
- imgui.cpp
- imgui.h
- imgui_demo.cpp
- imgui_draw.cpp
- imgui_widgets.cpp
- imgui_internal.h
- imconfig.h (默认情况下为空,用户可编辑)
- imstb_rectpack.h
- imstb_textedit.h
- imstb_truetype.h
不需要特定的构建过程。您可以将.cpp文件添加到项目中,或者从现有文件中包含它们。
用法
您的代码将鼠标/键盘/游戏手柄输入和设置传递给 Dear ImGui(有关详细信息,请参阅示例应用程序)。在安装了Dear ImGui之后,您可以在程序循环中的任何位置使用它。
代码
ImGui::Text("Hello, world %d", 123); if (ImGui::Button("Save")) { // do stuff } ImGui::InputText("string", buf, IM_ARRAYSIZE(buf)); ImGui::SliderFloat("float", &f, 0.0f, 1.0f);
结果:
(settings: Dark style (left), Light style (right) / Font: Roboto-Medium, 16px / Rounding: 5)
代码
// Create a window called "My First Tool", with a menu bar. ImGui::Begin("My First Tool", &my_tool_active, ImGuiWindowFlags_MenuBar); if (ImGui::BeginMenuBar()) { if (ImGui::BeginMenu("File")) { if (ImGui::MenuItem("Open..", "Ctrl+O")) { /* Do stuff */ } if (ImGui::MenuItem("Save", "Ctrl+S")) { /* Do stuff */ } if (ImGui::MenuItem("Close", "Ctrl+W")) { my_tool_active = false; } ImGui::EndMenu(); } ImGui::EndMenuBar(); } // Edit a color (stored as ~4 floats) ImGui::ColorEdit4("Color", my_color); // Plot some values const float my_values[] = { 0.2f, 0.1f, 1.0f, 0.5f, 0.9f, 2.2f }; ImGui::PlotLines("Frame Times", my_values, IM_ARRAYSIZE(my_values)); // Display contents in a scrolling region ImGui::TextColored(ImVec4(1,1,0,1), "Important Stuff"); ImGui::BeginChild("Scrolling"); for (int n = 0; n < 50; n++) ImGui::Text("%04d: Some text", n); ImGui::EndChild(); ImGui::End();
工作原理
如果您想了解 IMGUI 范例背后的核心原则,请参阅参考资料部分。IMGUI 试图从用户的角度最小化多余的状态复制、状态同步和状态保留。与传统的保留模式接口相比,它更不容易出错(更少的代码和 bug),并且有助于创建动态用户界面。
Dear ImGui 输出顶点缓冲区和命令列表,您可以在您的应用程序中轻松呈现。绘制调用的数量和呈现它们所需的状态更改相当少。因为 Dear ImGui 不直接知道或触摸图形状态,因此您可以在代码中的任何地方调用它的函数(例如,在运行算法的中间,或者在您自己的呈现过程的中间)。有关如何将 dear imgui 与现有代码库集成的说明,请参考 examples/ 示例文件夹中的示例应用程序。
一个常见的误解是将即时模式gui 误认为即时模式呈现,这通常意味着在调用 gui 函数时,用一堆低效的绘制调用和状态更改来锤击你的驱动程序/GPU。这不是 Dear ImGuid 的做法。Dear ImGui 输出顶点缓冲区和一小部分绘图调用批处理。它从来不直接接触你的 GPU。绘图调用批次是相当理想的,您可以稍后在应用程序中甚至远程呈现它们。
Dear ImGui 允许您创建复杂的工具以及非常短暂的工具。在短暂性的极端方面:使用现代编译器的 Edit&Continue(热代码重新加载)功能,您可以在应用程序运行时添加一些小部件来调整变量,并在一分钟后删除代码!Dear ImGui 不仅仅用于调整值。您可以通过发送文本命令来使用它来跟踪正在运行的算法。您可以将它与您自己的反射数据一起使用,以实时浏览您的数据集。您可以使用它来展示引擎中子系统的内部,创建记录器,检查工具,分析器,调试器,整个游戏制作编辑器/框架等。
演示/二进制
您应该能够从源代码构建示例(在 Windows/Mac/Linux 上进行测试)。如果你不这样做,让我知道!如果您想快速浏览一下 dear imgui 的功能,可以在这里下载演示应用程序的 Windows 二进制文件:
- imgui-demo-binaries-20190715.zip (Windows binaries, Dear ImGui 1.72 WIP built 2019/07/15, master branch, 5 executables)
遗憾的是,演示应用程序尚未识别 DPI,因此预计 4K 屏幕会出现一些模糊现象。对于应用程序中的 DPI 感知,您可以按不同的比例加载/重新加载字体,并使用style.ScaleAllSizes() 缩放样式。
绑定
在您的自定义引擎中集成 Dear ImGui 是一个问题:1)连接鼠标/键盘/游戏手柄输入;2)将一个纹理上传到您的 GPU/渲染引擎;3)提供可以绑定纹理和渲染纹理三角形的渲染功能。examples/ 文件夹中包括了这样做的应用程序。如果您是一位经验丰富的程序员,熟悉这些概念,那么您需要大约一个小时的时间将 Dear ImGui 集成到您的自定义引擎中。请务必花时间阅读常见问题解答、注释和其他文档!
注意:这些第三方绑定可能或多或少得到维护,或多或少贴近原始API的精神,因此我无法对它们提供太多保证。创建语言绑定的人有时并未自己使用C++ API(因为他们不是C++用户)。dear imgui设计时考虑到了C++,其他一些语言在翻译过程中可能会遗失一些微妙之处。如果您的语言支持它,我会建议复制原始中使用的函数重载和默认参数,否则API可能更难以使用。如有疑问,请先查看原始C++版本!
注意:那些第三方绑定可能或多或少地维护,或多或少地接近原始 API(因为创建语言绑定的人有时自己没有使用 C++ API ...因为它们不是 C++ 的充分理由用户)。Dear ImGui 在设计时考虑到了 C++,并且在与其他语言的翻译中可能会丢失一些细微之处。如果您的语言支持它,我建议复制原始中使用的函数重载和默认参数,否则 API 可能更难使用。有疑问,请先查看原始的 C++ 版本!
语言(第三方绑定):
- C: cimgui (2018:现在自动生成!您可以使用其 json 输出生成其他语言的绑定)
- C#/.Net: ImGui.NET
- ChaiScript: imgui-chaiscript
- D: DerelictImgui
- Go: imgui-go or go-imgui
- Haxe/hxcpp: linc_imgui
- Java: jimgui
- JavaScript: imgui-js
- Julia: CImGui.jl
- Lua: LuaJIT-ImGui, imgui_lua_bindings or lua-ffi-bindings
- Odin: odin-dear_imgui
- Pascal: imgui-pas
- PureBasic: pb-cimgui
- Python: pyimgui or bimpy or ogre-imgui
- Ruby: ruby-imgui
- Rust: imgui-rs or imgui-rust
- Swift swift-imgui
框架:
- Renderers: DirectX 9/10/11/12, Metal, OpenGL2, OpenGL3+/ES2/ES3, Vulkan: examples/
- Platform: GLFW, SDL, Win32, OSX, GLUT: examples/
- Framework: Allegro 5, Emscripten, Marmalade: examples/
- Unmerged PR: Android: #421
- bsf: bsfimgui
- Cinder: Cinder-ImGui
- Cocos2d-x: imguix, #551
- Flexium: FlexGUI
- GML/GameMakerStudio2: ImGuiGML
- Irrlicht: IrrIMGUI
- Ogre: ogre-imgui
- OpenFrameworks: ofxImGui
- OpenSceneGraph/OSG: gist
- ORX: ImGuiOrx, #1843
- px_render: px_render_imgui.h, #1935
- LÖVE+Lua: love-imgui
- Magnum: ImGuiIntegration (example)
- NanoRT: syoyo/imgui
- Qt: imgui-qt3d / QOpenGLWindow (qtimgui) / QtDirect3D / qt6
- SFML: imgui-sfml
- Software renderer: imgui_software_renderer
- Unreal Engine 4: segross/UnrealImGui or sronsse/UnrealEngine_ImGui
对于其他绑定:请参阅此页面。 请通过问题跟踪器或 Twitter 与我联系,以修复/更新此列表。
图库
(恕删略)。
参考
即时模式 GUI 范例最初可能对某些用户来说不太常见。这主要是因为保留模式 gui 已经如此广泛和占优势。下面的链接可以让您更好地理解即时模式 gui 是如何工作的。
- Johannes'johno'Norneby 的文章。
- Rickard Gustafsson和Johannes Algelind的演讲
- Jari Komppa 关于构建 ImGui 库的教程。
- Casey Muratori 推广该概念的原创视频。
- Nicolas Guillemot 在 CppCon'16 中关于 Dear ImGui 的 flashtalk 。
- Thierry Excoffier 的 Zero Memory Widget 。
有关到不同语言和框架的第三方绑定的更多引用和绑定,请参阅 Wiki。
许可证
Dear ImGui 根据 MIT 许可证获得许可,请参阅 LICENSE.txt 获取更多信息。
(First version: vz 2019/0805)