Dear ImGui

Supported platforms:
Available since: Gideros 2020.9

Description

This is an implementation of the Dear ImGui library.

See full original documentation here: https://pthom.github.io/imgui_manual_online/manual/imgui_manual.html

This is a brand new plugin in Gideros Studio so it may take some time to document it thoroughly.

In the meantime, the author's GitHub is the best place to get info regarding Dear ImGui Gideros functions.

https://github.com/MultiPain/Gideros_ImGui

require 'ImGui'

And of course, Gideros Wiki is here to help as well. You will find below some Dear ImGui examples implemented in Gideros Studio. Enjoy!

DEAR IMGUI TEXT

Let's start with a text example

require "ImGui"

-- a Dear ImGui instance
local imgui = ImGui.new()
stage:addChild(imgui)

-- we scale the font up
imgui:ioSetFontGlobalScale(2)

-- we choose a style (default = Dark)
--imgui:setLightStyle()
--imgui:setDarkStyle()
imgui:setClassicStyle()

-- we create 2 variables to hold our main window status
local mainWindowOpen, mainWindowDrawn

-- Dear ImGui runs on the game loop
function enterFrame(e)
	-- 1 we start ImGui
	imgui:newFrame(e)

	-- 2 we build our GUI
	mainWindowOpen, mainWindowDrawn =
		imgui:beginWindow(
			"Hello ImGui v"..ImGui._VERSION, -- main window title
			true -- main window is expanded
		)
	if (mainWindowDrawn) then -- the variable is false when main window is collapsed
		imgui:text("Hello Dear ImGui!") -- we add a text element to our GUI
	end
	imgui:endWindow()

	-- 3 we render our window
	imgui:endFrame()
	imgui:render()
end

-- this wouldn't work without listeners
stage:addEventListener("mouseDown", function(e) imgui:onMouseDown(e) end)
stage:addEventListener("mouseUp", function(e) imgui:onMouseUp(e) end)
stage:addEventListener("mouseHover", function(e) imgui:onMouseHover(e) end)
stage:addEventListener("mouseMove", function(e) imgui:onMouseMove(e) end)
stage:addEventListener("mouseWheel", function(e) imgui:onMouseWheel(e) end)
stage:addEventListener("keyDown", function(e) imgui:onKeyDown(e) end)
stage:addEventListener("keyUp", function(e) imgui:onKeyUp(e) end)
stage:addEventListener("keyChar", function(e) imgui:onKeyChar(e) end)
stage:addEventListener("enterFrame", enterFrame)

DEAR IMGUI CENTERED TEXT & COLORED TEXT

Here we center our text and introduce some more functionalities

require "ImGui"

local imgui = ImGui.new()
stage:addChild(imgui)
-- some imgui params
imgui:ioSetFontGlobalScale(2.5)
--imgui:setLightStyle()
--imgui:setClassicStyle()
-- our window + some params
local mainWindowOpen, mainWindowDrawn
local window_flags = -- a full screen window
		ImGui.WindowFlags_NoTitleBar |
		ImGui.WindowFlags_NoCollapse |
		ImGui.WindowFlags_NoResize |
		ImGui.WindowFlags_NoMove |
		ImGui.WindowFlags_NoBringToFrontOnFocus |
		ImGui.WindowFlags_NoNavFocus
-- some vars
local xtext, xtext2 = "Centered Text", "Colored Text"
local textW, textH, textMid -- for centered texts

-- the loop
function enterFrame(e)
	-- 1 begin
	imgui:newFrame(e)

	-- 2 our GUI
	imgui:setNextWindowPos(0, 0)
	imgui:setNextWindowSize(myappwidth, myappheight)
	mainWindowOpen, mainWindowDrawn = imgui:beginWindow("Hello ImGui", true, window_flags)
	-- some spacing
	imgui:dummy(application:getContentWidth(), 32 * 2) -- imgui:dummy(w, h)
	-- a centered text
	textW, _ = imgui:calcTextSize(xtext)
	textMid = (application:getContentWidth() - textW) / 2
	imgui:dummy(textMid, 0)
	imgui:sameLine(0, 0) -- puts the next element on the same line with no gap, for gaps use imgui:sameLine()
	imgui:text(xtext)
	-- some spacing
	imgui:dummy(application:getContentWidth(), 32 * 4)
	-- a colored text
	imgui:textColored(xtext2, 0xff00ff)
	imgui:endWindow()

	-- 3 end
	imgui:endFrame()
	imgui:render()
end

-- the listeners
stage:addEventListener("mouseDown", function(e) imgui:onMouseDown(e) end)
stage:addEventListener("mouseUp", function(e) imgui:onMouseUp(e) end)
stage:addEventListener("mouseHover", function(e) imgui:onMouseHover(e) end)
stage:addEventListener("mouseMove", function(e) imgui:onMouseMove(e) end)
stage:addEventListener("mouseWheel", function(e) imgui:onMouseWheel(e) end)
stage:addEventListener("keyDown", function(e) imgui:onKeyDown(e) end)
stage:addEventListener("keyUp", function(e) imgui:onKeyUp(e) end)
stage:addEventListener("keyChar", function(e) imgui:onKeyChar(e) end)
stage:addEventListener("enterFrame", enterFrame)

DEAR IMGUI BUTTONS

Here we make some buttons

require "ImGui"

local imgui = ImGui.new()
stage:addChild(imgui)
-- some imgui params
imgui:ioSetFontGlobalScale(2.5)
imgui:setClassicStyle()
-- our window + some params
local mainWindowOpen, mainWindowDrawn
local window_flags =
		ImGui.WindowFlags_NoTitleBar |
		ImGui.WindowFlags_NoCollapse |
		ImGui.WindowFlags_NoResize |
		ImGui.WindowFlags_NoMove |
		ImGui.WindowFlags_NoBringToFrontOnFocus |
		ImGui.WindowFlags_NoNavFocus
-- some vars
local xtext = "Centered Text"
local textW, textH, textMid -- for centered texts
local column = 0

-- the loop
function enterFrame(e)
	-- 1 begin
	imgui:newFrame(e)

	-- 2 our GUI
	imgui:setNextWindowPos(0, 0)
	imgui:setNextWindowSize(myappwidth, myappheight)
	mainWindowOpen, mainWindowDrawn =
		imgui:beginWindow(
			"Hello ImGui", -- window title
			true, -- window is expanded
			window_flags -- window flags
		)
		-- some spacing
		imgui:dummy(application:getContentWidth(), 32 * 2)
		-- a centered text?
		textW, _ = imgui:calcTextSize(xtext)
		textMid = (application:getContentWidth() - textW) / 2
		imgui:dummy(textMid, 0) imgui:sameLine(0, 0) imgui:text(xtext)
		-- some spacing
		imgui:dummy(application:getContentWidth(), 32 * 2)
		-- a button
		imgui:text("A button")
		imgui:pushStyleVar(ImGui.StyleVar_ButtonTextAlign, 0.5, 0.5)
		imgui:button(("x"), 128, 64) -- text, w, h
		imgui:popStyleVar()
		-- some spacing
		imgui:dummy(application:getContentWidth(), 32 * 1)
		-- a grid of buttons
		imgui:text("A grid of buttons")
		for x = 0,1,0.5 do
			for y = 0,1,0.5 do
				imgui:pushStyleVar(ImGui.StyleVar_ButtonTextAlign, x, y)
				if(imgui:button(("[%.1f, %.1f]"):format(x,y), application:getContentWidth() / 3, 100)) then
					print(x, y)
				end
				imgui:popStyleVar()
				column += 1
				if column < 3 then imgui:sameLine()
				else column = 0
				end
			end
		end
		-- some spacing
		imgui:dummy(application:getContentWidth(), 32 * 1)
		-- an image button with text
		imgui:text("An image button \nwith text")
		if(imgui:imageButtonWithText(Texture.new("gfx/image.png"), "button", 16, 16)) then
			print("pressed")
		end
	imgui:endWindow()

	-- 3 end
	imgui:endFrame()
	imgui:render()
end

-- the listeners
stage:addEventListener("mouseDown", function(e) imgui:onMouseDown(e) end)
stage:addEventListener("mouseUp", function(e) imgui:onMouseUp(e) end)
stage:addEventListener("mouseHover", function(e) imgui:onMouseHover(e) end)
stage:addEventListener("mouseMove", function(e) imgui:onMouseMove(e) end)
stage:addEventListener("mouseWheel", function(e) imgui:onMouseWheel(e) end)
stage:addEventListener("keyDown", function(e) imgui:onKeyDown(e) end)
stage:addEventListener("keyUp", function(e) imgui:onKeyUp(e) end)
stage:addEventListener("keyChar", function(e) imgui:onKeyChar(e) end)
stage:addEventListener("enterFrame", enterFrame)

YOU WANT MORE?

Soon, God's willing

Methods

Events Constants

---

• Main Page
• Lua API
• Main API
• Plugins