Available ImGui widgets
In ImGui, a UI element like a button, input field, or color picker is called a "widget". ERS provides a number of pre-built ImGui widgets that can be used as building blocks to swiftly and easily build an application on top of ERS. The ERS Debugger is made using these pre-built widgets too. This page describes the various pre-built widget that are available.
Widgets vs Windows
Each widget is available as both a widget and a window. The widget consists of the buttons, input fields, etc, while the window is a wrapper around the widget which automatically makes an ImGui window and UI elements like a menu bar to use the widget. The windows can be used to add the widgets without having to create a custom ImGui window each time. The widgets can be used when a custom window is necessary. For example, when a different menu bar is necessary or multiple widgets should be part of one window.
The visualization widget window. The widget itself is within the red area. Surrounding the widget is the default window including a menu bar to provide additional interaction with the widget.
Sometimes widgets may also consist of other widgets. For example, the event inspector widget has internal local- and sync-event details widgets which show details specific to the local- and sync-event respectively.
The widgets
Model Hierarchy
The model hierarchy widget gives a tree view of a ModelContainer with all simulators and entities contained in the ModelContainer.
Each of these can be selected by clicking on them.
The model hierarchy widget.
Run Controls
The run controls widget manages the execution of a ModelContainer. It allows playing and pausing continuous model execution, executing the model until the next event (stepping), and adjusting the execution speed.
The model can be executed in two modes: blocking and non-blocking. In blocking mode, the model is updated as part of the render-loop of the program. In non-blocking mode, the model is updated as fast as possible and simulators are allowed to run apart in time.
Speedup widget
The speedup widget shows a graph of the models speedup over real time. For example, when the models advances one hour in one minute time, the speedup is \(60\times\) realtime.
The speedup widget.
Log widget
The log widget shows a list of all messaged logged in ERS (see logging). These messages can be filtered by keyword, or a minimum log level can be set to only show messages of at least the selected level. By default, the log widget will scroll to the bottom of the list when a new message is logged. This behavior can be toggled via the auto-scroll button.
The log widget.
Event Timeline
The event timeline widget shows a scatter plot of the visualized local- and sync-events. Local-events are shown as circles, sync-events as crosses. The orange vertical line on the left shows the current time of the model. When hovering the mouse cursor over an event, information about it is shown. Events can be selected by clicking on them.
The event timeline widget. One of the events is hovered by the mouse, showing additional information in a tooltip.
Inspectors
There are multiple inspectors, each built to display the data of a different object.
To have one central widget for the inspection of any object,
the InspectorWidget wraps around all specific widgets and dynamically switches to the specified selected type.
ModelContainer Inspector
The model container inspector can be used to inspect and modify the state of a ModelContainer.
Once the simulation has been started,
the model container can not be modified anymore and its data becomes read-only in the inspector.
The model container inspector widget inside the InspectorWidget.
Simulator Inspector
The simulator inspector can be used to inspect and modify the state of a Simulator,
and shows the incoming dependencies to the simulator.
The simulator inspector widget inside the InspectorWidget.
Entity Inspector
The entity inspector can be used to inspect and modify the state of an entity and its attached components.
The entity inspector widget inside the InspectorWidget.
Event Inspector
The event inspector can be used to inspect the state of local- and sync-events. This widget is subdivided into three more widgets:
- The
EventDetailswidget, which shows generic event details. - The
SyncEventDetailswidget, which shows sync-event specific details. - The
LocalEventDetailswidget, which shows local-event specific details.
The event inspector widget inside the InspectorWidget.
Here, the event inspector is using the EventDetails (event information) and LocalEventDetails widgets internally.
Visualization widget
The visualization widget shows the 2D or 3D visualization of an ERS model.
It will show the visualization that is created using a specific RenderContext.
When showing a 2D visualization, the camera can be dragged around using the left mouse button, and zooming in or out can be done using the mouse wheel. In 3D, the same mouse controls apply, but the camera can also be rotated by dragging using the right mouse button.
The visualization widget. Two entities are visualized using the standard render system.
Model Structure
The model structure window shows a graph of the simulators and their dependencies in a ModelContainer.
Additionally, the nodes of the graph can be colored as a heatmap of either the number of scheduled local-events
or the number of incoming sync-events.
The model structure widget. Here using the scheduled local events heatmap mode.
Model Progression
The model progression widget shows a horizontal bar chart of all simulators and their progression. It shows the simulation time for each simulator, allowing one to see how far ahead or behind certain simulators are compared to others. Thanks to this widget, one can find simulators that lag behind too far, creating bottleneck in the model.
The model progression widget.