本页面介绍了 Dear ImGui 中除基本按钮、复选框和文本输入框之外的更复杂的小部件组件。高级小部件提供更丰富的交互模式、复杂的数据可视化和专用输入方法。这些组件通常结合了多个基本小部件,或实现了更复杂的交互状态和行为。
有关按钮、复选框和基本文本输入框等基本小部件的信息,请参阅 基本小部件。有关表格的特定文档,请参阅 表格系统。有关详细的文本输入和编辑功能,请参阅 文本输入与编辑。
Dear ImGui 提供了多种高级小部件,可按以下类别划分:
来源:imgui_widgets.cpp395-413 imgui_demo.cpp76-100
拖动控件和滑块提供了一种在指定范围内调整数值的交互方式。它们支持各种数据类型(浮点数、整数等),并可以配置不同的标志来定制行为。
拖动控件具有格式、速度控制和幂曲线选项
拖动控件和滑块共享通用架构
DragScalar、SliderScalar)提供核心功能ButtonBehavior 进行交互检测DragBehavior 或 SliderBehavior 实现对于滑块,视觉外观是表示范围内值的填充矩形,而拖动控件默认仅显示文本。
Dear ImGui 提供了全面的颜色处理小部件,支持 RGB 和 HSV 色彩空间,并带有可选的 Alpha 通道。
颜色小部件使用浮点数值数组(RGB/RGBA 为 3 或 4 个分量)进行工作。数值范围为 0.0f 到 1.0f。
树节点提供 UI 元素的层次化组织,支持可折叠部分、选择和各种显示样式。
树节点需要匹配的函数调用对
拖放系统允许在小部件之间传输数据,并在操作过程中提供视觉反馈。
拖放系统是有状态的,具有源和目标双方操作的独特开始/结束函数对。载荷数据被复制以确保正确帧之间的传输。
Dear ImGui 包括基本的绘图功能,可用于在不依赖外部库的情况下可视化数据。
这些绘图小部件接受数值数组或函数回调
这些小部件针对数据的快速显示进行了优化,而不是交互式操作。它们支持刻度、叠加和尺寸的基本自定义。
多选功能允许用户从列表中选择多个项目,支持键盘导航、Shift 选择和其他常见的选择模式。
此系统与其他小部件(如 Selectable()、列表框和树节点)集成,在不同类型的小部件中提供一致的多选行为。
标签页提供了一种将内容组织成可切换页面的方法。
标签页系统使用与树相似的模式,即仅在标签激活时才渲染标签内容。
了解小部件的内部架构对于创建自定义小部件或调试问题很有帮助。
来源:imgui_internal.h170-180 imgui_widgets.cpp130-150
下图展示了小部件如何与输入、状态跟踪和渲染系统进行交互。
来源:imgui_internal.h180-200 imgui.cpp8600-8700
您可以将标准小部件行为与自定义渲染相结合。
Dear ImGui 提供函数来查询最后一个项目的状态。
IsItemHovered():检查鼠标是否悬停在最后一个项目上IsItemActive():检查最后一个项目当前是否处于活动状态(正在交互)IsItemFocused():检查最后一个项目是否具有键盘焦点IsItemClicked():检查最后一个项目是否被点击IsItemEdited():检查最后一个项目是否被编辑(值已更改)GetItemRectMin()/Max():获取最后一个项目的边界这些函数对于创建复合小部件或添加自定义行为非常有用。
来源: imgui_internal.h200-220 imgui.h400-450
通过组合多个基本控件并管理它们的状,可以创建复杂的控件。
Dear ImGui 中的高级控件提供了比基本 UI 元素更丰富的交互模式和专门的功能。通过了解它们的用户界面应用程序接口、行为和内部结构,您可以有效地使用这些组件,甚至创建自定义控件来构建复杂的界面。