Skip to content

Widgets

John O'Sullivan edited this page Oct 28, 2026 · 15 revisions

Terminology

cspec: cache specifier. cspecs may be "value" or "address". Examples of value cspecs include title, font and step. In the original JSON the right hand side (RHS) of the assignment is a literal value. Address cspecs have the key of a top level member of data as the value. Think of the RHS as being like a pointer; hence the term address.

Native widgets

Native widgets are the thinnest wrappers around ImGui's own widget APIs.

InputInt: an edit field constrained to integer input only. Immediately to the right of the edit field are plus and minus buttons. And finally, after the plus and minus buttons, there's a label.

Value cspecs: label, step, step_fast, flags, tooltip
Address cspecs: cname

InputDouble: an edit field constrained to double input only. Immediately to the right of the edit field are plus and minus buttons. And finally, after the plus and minus buttons, there's a label.

Value cspecs: label, step, step_fast, flags, tooltip, format
Address cspecs: cname

InputString: an unconstrained edit field permitting any text. To the right of the edit field there's a label.

Value cspecs: label, text_flags, tooltip, buffer_size
Address cspecs: cname

InputTextArea: an unconstrained multi-line text area.

Value cspecs: label, text_flags, tooltip, buffer_size, line_height
Address cspecs: cname

Combo: a drop down style combo box selection.

Value cspecs: label, step, tooltip, buffer_size
Address cspecs: cname, cindex

Checkbox: a checkbox with text label

Value cspecs: tooltip
Address cspecs: cname, text

Text: a simple read only string

Address cspecs: text

Button: a clickable button, with text label, that can be enabled or disabled.

Value cspecs: tooltip
Address cspecs: disabled, text

Compound widgets

Compound widgets compose several ImGui widget function invocations to create a larger widget.

BulkTable: render the contents of a BulkCache result set as a scrollable table with column headers.

Value cspecs: title, title_font, title_font_size, body_font, body_font_size, table_flags, window_flags, column_flags, selectable_col
Address cspecs: query_id, menu_pop

LiveTable: render the contents of the LiveCache as a scrollable table with column headers.

Value cspecs: title, title_font, title_font_size, body_font, body_font_size, table_flags, window_flags, column_flags, buffer_size, line_height, selectable_col
Address cspecs: cname, menu_pop, formats, xforms

Footer: a horizontal footer with a DB traffic light, a frames/sec indicator, a font scaling control and a style switch.

Value cspecs: show_footer_db, show_footer_fps, show_footer_font_scale, show_footer_style
Address cspecs:

DebugFooter: a horizontal footer with a DLC button and ID Stack and Metrics checkboxes.

Value cspecs:
Address cspecs:

DatePicker

Value cspecs: label, year_month_font, year_month_font_size, day_date_font, day_date_font_size, table_flags, combo_flags
Address cspecs: cname

DuckTableSummaryModal

Value cspecs: title, title_font, title_font_size, body_font, body_font_size, table_flags, window_flags, column_flags, button_font, button_font_size
Address cspecs: query_id

LoadingModal

Value cspecs: title, title_font, title_font_size, body_font, body_font_size, spinner_thickness, spinner_radius, window_flags
Address cspecs: query_id

Grouping widgets

Home: is a special widget. All NoDOM apps must have one, and one only, Home instance.

Value cspecs: title, title_font, title_font_size, window_flags
Address cspecs: menu_bar, menu_pop

BeginChild: begin a child window

Value cspecs: title, height, width, window_flags
Address cspecs:

EndChild: end a child window

Value cspecs: 
Address cspecs:

BeginGroup: being a group. A group collects child widgets as a single item with a single bounding box.

Value cspecs: 
Address cspecs:

EndGroup: end a group

Value cspecs: 
Address cspecs:

PushFont: start the use of a specific font

Value cspecs: font, font_size
Address cspecs:

PopFont: end the use of a specific font

Value cspecs: 
Address cspecs:

Layout widgets

Imgui uses a simple flow based layout model. The layout widgets enable UI developers to control that model flow. None of them have any cspecs.

Separator: a vertical break. Use one to force layout to the "next row".

SameLine: try and put the next widget on the same line as previous.

NewLine: the opposite of SameLine.

Spacing: inject vertical spacing.

AlignTextToFramePadding: vertically align next text with FramePadding.y

Clone this wiki locally