Difference between revisions of "Dear ImGui"

From GiderosMobile
(wip)
(DONE)
 
(One intermediate revision by the same user not shown)
Line 9: Line 9:
 
Dear ImGui is licensed under the '''MIT License''', see '''https://github.com/ocornut/imgui/blob/master/LICENSE.txt''' for more information.
 
Dear ImGui is licensed under the '''MIT License''', see '''https://github.com/ocornut/imgui/blob/master/LICENSE.txt''' for more information.
  
To use Dear ImGui in your project you need to add the ImGui plugin and call require like so:
+
To use Dear ImGui in your project you need to add the ImGui plugin and call ''require'' like so:
 
<syntaxhighlight lang="lua">
 
<syntaxhighlight lang="lua">
 
require "ImGui"
 
require "ImGui"
Line 37: Line 37:
  
 
==== Widgets ====
 
==== Widgets ====
'''Widgets: Color Editor/Picker'''
+
'''Widgets: Color Editor/Picker'''
 
  * tip: the ColorEdit* functions have a little color square that can be left-clicked to open a picker, and right-clicked to open an option menu
 
  * tip: the ColorEdit* functions have a little color square that can be left-clicked to open a picker, and right-clicked to open an option menu
  
'''Widgets: Input with Keyboard'''
+
'''Widgets: Input with Keyboard'''
 
  * If you want to use InputText() with std::string or any custom dynamic string type, see misc/cpp/imgui_stdlib.h and comments in imgui_demo.cpp.
 
  * If you want to use InputText() with std::string or any custom dynamic string type, see misc/cpp/imgui_stdlib.h and comments in imgui_demo.cpp.
 
  * Most of the ImGuiInputTextFlags flags are only useful for InputText() and not for InputFloatX, InputIntX, InputDouble etc.
 
  * Most of the ImGuiInputTextFlags flags are only useful for InputText() and not for InputFloatX, InputIntX, InputDouble etc.
  
'''Widgets: Regular Sliders'''
+
'''Widgets: Regular Sliders'''
 
  * CTRL+Click on any slider to turn them into an input box. Manually input values aren't clamped and can go off-bounds.
 
  * CTRL+Click on any slider to turn them into an input box. Manually input values aren't clamped and can go off-bounds.
 
  * Adjust format string to decorate the value with a prefix, a suffix, or adapt the editing and display precision e.g. "%.3f" -> 1.234; "%5.2f secs" -> 01.23 secs; "Biscuit: %.0f" -> Biscuit: 1; etc.
 
  * Adjust format string to decorate the value with a prefix, a suffix, or adapt the editing and display precision e.g. "%.3f" -> 1.234; "%5.2f secs" -> 01.23 secs; "Biscuit: %.0f" -> Biscuit: 1; etc.
Line 51: Line 51:
 
  If you get a warning converting a float to ImGuiSliderFlags, read https://github.com/ocornut/imgui/issues/3361
 
  If you get a warning converting a float to ImGuiSliderFlags, read https://github.com/ocornut/imgui/issues/3361
  
'''Widgets: Drag Sliders'''
+
'''Widgets: Drag Sliders'''
 
  * CTRL+Click on any drag box to turn them into an input box. Manually input values aren't clamped and can go off-bounds.
 
  * CTRL+Click on any drag box to turn them into an input box. Manually input values aren't clamped and can go off-bounds.
 
  * For all the Float2/Float3/Float4/Int2/Int3/Int4 versions of every functions, note that a 'float v[X]' function argument is the same as 'float* v', the array syntax is just a way to document the number of elements that are expected to be accessible. You can pass address of your first element out of a contiguous set, e.g. &myvector.x
 
  * For all the Float2/Float3/Float4/Int2/Int3/Int4 versions of every functions, note that a 'float v[X]' function argument is the same as 'float* v', the array syntax is just a way to document the number of elements that are expected to be accessible. You can pass address of your first element out of a contiguous set, e.g. &myvector.x
Line 71: Line 71:
 
</div>
 
</div>
  
===== '''OLD DOC TO BE MERGED SOMEHOW''' =====
 
<div style="column-count:3;-moz-column-count:3;-webkit-column-count:3">
 
'''[[ImGui|ImGui.Core (ImGui)]]'''<br/><!--GIDEROSOBJ:ImGui-->
 
'''[[ImGui.DrawList]]'''<br/><!--GIDEROSOBJ:ImGui.DrawList-->
 
'''[[ImGui.Style]]'''<br/><!--GIDEROSOBJ:ImGui.Style-->
 
</div>
 
 
<!--introduction documentation (c++): https://pixtur.github.io/mkdocs-for-imgui/site/-->
 
<!--introduction documentation (c++): https://pixtur.github.io/mkdocs-for-imgui/site/-->
 
<!--Dear ImGui demo (c++): https://pthom.github.io/imgui_manual_online/manual/imgui_manual.html-->
 
<!--Dear ImGui demo (c++): https://pthom.github.io/imgui_manual_online/manual/imgui_manual.html-->
Line 786: Line 780:
 
<!--GIDEROSMTD:ErrorMarkers:get(line) message = ErrorMarkers:get(line)-->
 
<!--GIDEROSMTD:ErrorMarkers:get(line) message = ErrorMarkers:get(line)-->
 
<!--GIDEROSMTD:ErrorMarkers:getSize() number = ErrorMarkers:getSize()-->
 
<!--GIDEROSMTD:ErrorMarkers:getSize() number = ErrorMarkers:getSize()-->
 
+
<!--GIDEROSMTD:ImGuiBreakpoints.new() Breakpoints = ImGuiBreakpoints.new()-->
 
+
<!--GIDEROSMTD:Breakpoints:add(line)-->
 
+
<!--GIDEROSMTD:Breakpoints:remove(line)-->
 
+
<!--GIDEROSMTD:Breakpoints:get(line) bool = Breakpoints:get(line)-->
 
+
<!--GIDEROSMTD:Breakpoints:getSize() number = Breakpoints:getSize()-->
 
+
<!--GIDEROSMTD:ImGui:getWindowDrawList() local list = ImGui:getWindowDrawList()-->
 
+
<!--GIDEROSMTD:ImGui:getBackgroundDrawList() local list = ImGui:getBackgroundDrawList()-->
 
+
<!--GIDEROSMTD:ImGui:getForegroundDrawList() local list = ImGui:getForegroundDrawList()-->
 
+
<!--GIDEROSMTD:DrawList:pushClipRect(clip_rect_min_x, clip_rect_min_y, clip_rect_max_x, clip_rect_max_y [, intersect_with_current_clip_rect = false])-->
 
+
<!--GIDEROSMTD:DrawList:pushClipRectFullScreen()-->
 
+
<!--GIDEROSMTD:DrawList:popClipRect()-->
 
+
<!--GIDEROSMTD:DrawList:pushTextureID(texture)-->
 +
<!--GIDEROSMTD:DrawList:popTextureID()-->
 +
<!--GIDEROSMTD:DrawList:getClipRectMin() x, y = DrawList:getClipRectMin()-->
 +
<!--GIDEROSMTD:DrawList:getClipRectMax() x, y = DrawList:getClipRectMax()-->
 +
<!--GIDEROSMTD:DrawList:addLine(p1_x, p1_y, p2_x, p2_y, color [, alpha = 1, thickness = 1])-->
 +
<!--GIDEROSMTD:DrawList:addRect(p_min_x, p_min_y, p_max_x, p_max_y, color [, alpha = 1, rounding = 0, rounding_corners = ImGui.DrawFlags_RoundCornersAll, thickness = 1])-->
 +
<!--GIDEROSMTD:DrawList:addRectFilled(p_min_x, p_min_y, p_max_x, p_max_y, color [, alpha = 1, rounding = 0, rounding_corners = ImGui.DrawFlags_RoundCornersAll])-->
 +
<!--GIDEROSMTD:DrawList:addRectFilledMultiColor(p_min_x, p_min_y, p_max_x, p_max_y, color_upr_left, color_upr_right, color_bot_right, color_bot_left)-->
 +
<!--GIDEROSMTD:DrawList:addQuad(p1_x, p1_y, p2_x, p2_y, p3_x, p3_y, p4_x, p4_y, color [, alpha = 1, thickness = 1])-->
 +
<!--GIDEROSMTD:DrawList:addQuadFilled(p1_x, p1_y, p2_x, p2_y, p3_x, p3_y, p4_x, p4_y, color)-->
 +
<!--GIDEROSMTD:DrawList:addTriangle(p1_x, p1_y, p2_x, p2_y, p3_x, p3_y, color [, alpha = 1, thickness = 1])-->
 +
<!--GIDEROSMTD:DrawList:addTriangleFilled(p1_x, p1_y, p2_x, p2_y, p3_x, p3_y, color)-->
 +
<!--GIDEROSMTD:DrawList:addCircle(center_x, center_y, radius, color [, alpha = 1, num_segments = 12, thickness = 1])-->
 +
<!--GIDEROSMTD:DrawList:addCircleFilled(center_x, center_y, radius, color [, alpha = 1, num_segments = 12])-->
 +
<!--GIDEROSMTD:DrawList:addNgon(center_x, center_y, radius, color [, alpha = 1, num_segments = 12, thickness = 1])-->
 +
<!--GIDEROSMTD:DrawList:addNgonFilled(center_x, center_y, radius, color [, alpha = 1, num_segments = 12])-->
 +
<!--GIDEROSMTD:DrawList:addText(x, y, color, alpha, text) -- x, y (number), text_begin (string), text_end (string)-->
 +
<!--GIDEROSMTD:DrawList:addFontText(font, font_size, pos_x, pos_y, color, alpha, text [, wrap_with = 0, cpu_fine_clip_rect_x, cpu_fine_clip_rect_y, cpu_fine_clip_rect_w, cpu_fine_clip_rect_h])-->
 +
<!--GIDEROSMTD:DrawList:addPolyline(points_table, color, alpha, closed, thickness) points_table (table), color (number), closed (bool), thickness (number)-->
 +
<!--GIDEROSMTD:DrawList:addConvexPolyFilled(points_table, color) points_table (table), color (number)-->
 +
<!--GIDEROSMTD:DrawList:addBezierCubic(p1_x, p1_y, p2_x, p2_y, p3_x, p3_y, p4_x, p4_y, color, alpha, thickness [, num_segments = 0])-->
 +
<!--GIDEROSMTD:DrawList:addBezierQuadratic(p1_x, p1_y, p2_x, p2_y, p3_x, p3_y, color, alpha, thickness [, num_segments = 0])-->
 +
<!--GIDEROSMTD:DrawList:addImage(texture, x, y, x + w, y + h [, tint_color = 0xffffff, tint_alpha = 1])-->
 +
<!--GIDEROSMTD:DrawList:addImageUV(texture, x, y, x + w, y + h, uv0x, uv0y, uv1x, uv1y [, tint_color = 0xffffff, tint_alpha = 1])-->
 +
<!--GIDEROSMTD:DrawList:addImageQuad(texture, x, y, x + w, y, x + w, y + h, x, y + h [, tint_color = 0xffffff, tint_alpha = 1, uv0x = 0, uv0y = 0, uv1x = 1, uv1y = 0, uv2x = 1, uv2y = 1, uv3x = 0, uv3y = 1])-->
 +
<!--GIDEROSMTD:DrawList:addImageRounded(texture, x, y, x + w, y + h, tint_color, tint_alpha, round_radius [, corner_flags = ImGui.CorenerFlags_All])-->
 +
<!--GIDEROSMTD:DrawList:addImageRoundedUV(texture, x, y, x + w, y + h, uv0x, uv0y, uv1x, uv1y, tint_color, tint_alpha, round_radius [, corner_flags = ImGui.CorenerFlags_All])-->
 +
<!--GIDEROSMTD:DrawList:pathClear()-->
 +
<!--GIDEROSMTD:DrawList:pathLineTo(x, y)-->
 +
<!--GIDEROSMTD:DrawList:pathLineToMergeDuplicate(x, y)-->
 +
<!--GIDEROSMTD:DrawList:pathFillConvex(color)-->
 +
<!--GIDEROSMTD:DrawList:pathStroke(color, alpha, closed [, thickness = 1])-->
 +
<!--GIDEROSMTD:DrawList:pathArcTo(center_x, center_y, radius, a_min, a_max [, num_segments = 10])-->
 +
<!--GIDEROSMTD:DrawList:pathArcToFast(center_x, center_y, radius, a_min, a_max)-->
 +
<!--GIDEROSMTD:DrawList:pathBezierCubicCurveTo(p2x, p2y, p3x, p3y, p4x, p4y [, num_segments = 0])-->
 +
<!--GIDEROSMTD:DrawList:pathBezierQuadraticCurveTo(p2x, p2y, p3x, p3y [, num_segments = 0])-->
 +
<!--GIDEROSMTD:DrawList:pathRect(min_x, min_y, max_x, max_y [, rounding = 0, ImGui.DrawFlags = 0])-->
 +
<!--GIDEROSMTD:DrawList:rotateBegin() rotate any draw list item around its center point-->
 +
<!--GIDEROSMTD:DrawList:rotateEnd(radians)-->
 
<!--=== Events ===-->
 
<!--=== Events ===-->
 
<!--GIDEROSEVT:ImGui.KeyChar-->
 
<!--GIDEROSEVT:ImGui.KeyChar-->

Latest revision as of 01:46, 11 October 2024

Supported platforms: Platform android.pngPlatform ios.pngPlatform mac.pngPlatform pc.pngPlatform html5.pngPlatform winrt.pngPlatform win32.png
Available since: Gideros 2020.9

Description

This is an implementation of the Dear ImGui library: https://github.com/ocornut/imgui.

Dear ImGui is licensed under the MIT License, see https://github.com/ocornut/imgui/blob/master/LICENSE.txt for more information.

To use Dear ImGui in your project you need to add the ImGui plugin and call require like so:

require "ImGui"

Current Gideros Dear ImGui version: 1.89.6.

User Guide

  • Double-click on title bar to collapse window
  • Click and drag on lower corner to resize window (double-click to auto fit window to its contents)
  • CTRL+Click on a slider or drag box to input value as text
  • TAB/SHIFT+TAB to cycle through keyboard editable fields
  • CTRL+Tab to select a window
  • CTRL+Mouse Wheel to zoom window contents if io.FontAllowUserScaling is enabled
  • While inputing text:
    • CTRL+Left/Right to word jump
    • CTRL+A or double-click to select all
    • CTRL+X/C/V to use clipboard cut/copy/paste
    • CTRL+Z,CTRL+Y to undo/redo
    • ESCAPE to revert
  • With keyboard navigation enabled:
    • Arrow keys to navigate
    • Space to activate a widget
    • Return to input text into a widget
    • Escape to deactivate a widget, close popup, exit child window
    • Alt to jump to the menu layer of a window

Widgets

Widgets: Color Editor/Picker

* tip: the ColorEdit* functions have a little color square that can be left-clicked to open a picker, and right-clicked to open an option menu

Widgets: Input with Keyboard

* If you want to use InputText() with std::string or any custom dynamic string type, see misc/cpp/imgui_stdlib.h and comments in imgui_demo.cpp.
* Most of the ImGuiInputTextFlags flags are only useful for InputText() and not for InputFloatX, InputIntX, InputDouble etc.

Widgets: Regular Sliders

* CTRL+Click on any slider to turn them into an input box. Manually input values aren't clamped and can go off-bounds.
* Adjust format string to decorate the value with a prefix, a suffix, or adapt the editing and display precision e.g. "%.3f" -> 1.234; "%5.2f secs" -> 01.23 secs; "Biscuit: %.0f" -> Biscuit: 1; etc.
* Format string may also be set to NULL or use the default format ("%f" or "%d").

If you get a warning converting a float to ImGuiSliderFlags, read https://github.com/ocornut/imgui/issues/3361

Widgets: Drag Sliders

* CTRL+Click on any drag box to turn them into an input box. Manually input values aren't clamped and can go off-bounds.
* For all the Float2/Float3/Float4/Int2/Int3/Int4 versions of every functions, note that a 'float v[X]' function argument is the same as 'float* v', the array syntax is just a way to document the number of elements that are expected to be accessible. You can pass address of your first element out of a contiguous set, e.g. &myvector.x
* Adjust format string to decorate the value with a prefix, a suffix, or adapt the editing and display precision e.g. "%.3f" -> 1.234; "%5.2f secs" -> 01.23 secs; "Biscuit: %.0f" -> Biscuit: 1; etc.
* Format string may also be set to NULL or use the default format ("%f" or "%d").
* Speed are per-pixel of mouse movement (v_speed=0.2f: mouse needs to move by 5 pixels to increase value by 1). For gamepad/keyboard navigation, minimum speed is Max(v_speed, minimum_step_at_given_precision).
* Use v_min < v_max to clamp edits to given limits. Note that CTRL+Click manual input can override those limits.
* Use v_max = FLT_MAX / INT_MAX etc to avoid clamping to a maximum, same with v_min = -FLT_MAX / INT_MIN to avoid clamping to a minimum.
* We use the same sets of flags for DragXXX() and SliderXXX() functions as the features are the same and it makes it easier to swap them.

Gideros Dear ImGui Documentation