Dear ImGui Getting Started

Dear ImGui for Gideros Mobile

The below are fully functional working demo you can copy/paste.

note: you may have to provide your own assets (fonts, gfx, …)

Gideros Dear ImGui embedded Demo

require "ImGui"

local imgui = ImGui.new()
stage:addChild(imgui)
imgui:setClassicStyle()

function onEnterFrame(e)
	imgui:newFrame(e.deltaTime)

	imgui:showDemoWindow()

	imgui:render()
	imgui:endFrame()
end

stage:addEventListener(Event.ENTER_FRAME, onEnterFrame)

Your first Windows

require "ImGui"

application:setBackgroundColor(0x323232)

local imgui = ImGui.new()
stage:addChild(imgui)

local window01 = true -- this window can be closed
local windowdrawn = false -- boolean to hold our windows status

function onEnterFrame(e)
	-- 1. we start an ImGui frame
	imgui:newFrame(e.deltaTime)

	-- 2. we add some windows
	-- a window you can close
	if window01 then -- if window exists (not closed)
		window01, windowdrawn = imgui:beginWindow("window01", window01) -- title, isexpanded
		if windowdrawn then -- the variable is false when the window is collapsed
			-- its widgets
			imgui:text("Hello Dear ImGui!")
			imgui:newLine()
			imgui:textColored("This window can be moved, resized and closed!", 0x00ff7f, 1)
		end
		-- end of our first window
		imgui:endWindow()
	end

	-- a window to re-open closed windows
	imgui:setNextWindowPos(32*8, 32*8) -- x, y
	imgui:beginWindow("CONTROL", nil, ImGui.WindowFlags_NoResize) -- title, no close, windows flags
	-- and its widgets
	imgui:text("click the button to re-open a closed window")
	if imgui:button("OPEN", 64, 16) then
		window01 = true
	end
	imgui:newLine()
	imgui:textColored("This window cannot be moved, resized or closed!", 0xffff7f, 1)
	-- end of our second window
	imgui:endWindow()

	-- 3. we end the ImGui frame and render to screen
	imgui:endFrame()
	imgui:render()
end

Your first Widgets

require "ImGui"

application:setBackgroundColor(0x323232)

MyClass = Core.class(Sprite)

function MyClass:init()
	self.imgui = ImGui.new()
	self.flags = ImGui.SliderFlags_AlwaysClamp | ImGui.SliderFlags_NoInput
	-- some app variables
	self.ischecked01 = true
	self.ischecked02 = false
	self.fruits = {"apple", "banana", "orange", "apricot"}
	self.currentfruit = 2 -- "orange" ImGui is 0 based
	self.dragvalue01 = 20
	self.slidevalue01 = 0.5
	self.valueangle01 = math.pi/2
	-- order
	self:addChild(self.imgui)
	-- listeners
	self:addEventListener(Event.ENTER_FRAME, self.onEnterFrame, self)
end

-- LOOP
function MyClass:onEnterFrame(e)
	-- 1 we start ImGui
	self.imgui:newFrame(e.deltaTime)

	-- 2 we build our GUI
	local ischanged = false -- has any value changed
	self.imgui:beginWindow("Hello ImGui!") -- this window cannot be closed
	-- some widgets
	self.imgui:text("Here are some Dear ImGui widgets.")
	-- buttons
	self.imgui:dummy(1*32, 0.5*32)
	self.imgui:bullet()
	if self.imgui:button("button##b01", 64, 16) then print("button 01 clicked") end
	self.imgui:sameLine()
	self.imgui:bullet()
	if self.imgui:button("button##b02", 64, 16) then print("button 02 clicked") end
	self.imgui:sameLine()
	self.imgui:bullet()
	if self.imgui:button("button##b03", 64, 16) then print("button 03 clicked") end
	-- checkboxes
	self.imgui:dummy(1*32, 0.5*32)
	self.ischecked01, ischanged = self.imgui:checkbox("cb1", self.ischecked01)
	if ischanged then print("checkbox01 is "..tostring(self.ischecked01)) end
	self.ischecked02, ischanged = self.imgui:checkbox("vb2", self.ischecked02)
	if ischanged then print("checkbox02 is "..tostring(self.ischecked02)) end
	-- combo
	self.imgui:dummy(1*32, 0.5*32)
	self.currentfruit, ischanged = self.imgui:combo("fruits", self.currentfruit, self.fruits)
	if ischanged then print(self.currentfruit+1, self.fruits[self.currentfruit+1]) end -- Lua is 1 based
	-- sliders
	self.imgui:dummy(1*32, 0.5*32)
	self.dragvalue01, ischanged = self.imgui:dragInt("drag int", self.dragvalue01, 0.2, 0, 100, "%d", self.flags)
	if ischanged then print(self.dragvalue01) end
	self.slidevalue01, ischanged = self.imgui:sliderFloat("slider float", self.slidevalue01, 0, 1, "%.2f", self.flags)
	if ischanged then print(self.slidevalue01) end
	self.valueangle01, ischanged = self.imgui:filledSliderAngle("slider angle", false, self.valueangle01, 0, 360, "%.1f", self.flags)
	if ischanged then print(^>self.valueangle01) end -- ^> convert 'rad' into degrees
	self.imgui:dummy(1*32, 0.5*32)
	-- we end our window
	self.imgui:endWindow()

	-- 3 we end ImGui
	self.imgui:endFrame()
	self.imgui:render()
end

-- add MyClass Sprite to stage
stage:addChild(MyClass.new())

Start a Window at a given position

require "ImGui"

application:setBackgroundColor(0x323232)

local imgui = ImGui.new()
stage:addChild(imgui)

local window01 = true -- this window can be closed
local windowdrawn = false -- boolean to hold our windows status

local posx, posy = 32*8, 32*4 -- starting window position
local offsetx, offsety = 0, 0 -- new window position
local dragflag = false

function onEnterFrame(e)
	-- 1. we start ImGui
	imgui:newFrame(e.deltaTime)

	-- 2. we add some windows
	if window01 then -- if window exists (not closed)
		imgui:setNextWindowPos(posx, posy)
		window01, windowdrawn = imgui:beginWindow("window01", window01)
		-- update window new position
		local mouseClicked = imgui:isMouseClicked(KeyCode.MOUSE_LEFT)
		if not dragflag and mouseClicked and imgui:isWindowHovered() then
			dragflag = true
		end
		if imgui:isWindowFocused() and dragflag then
			local mx,my = imgui:getMousePos()
			local wx, wy = imgui:getWindowPos()
			if mouseClicked or imgui:isMouseReleased(KeyCode.MOUSE_LEFT) then
				offsetx, offsety = mx - wx, my - wy
			end
			if imgui:isMouseDragging(KeyCode.MOUSE_LEFT, 0) then
				posx = (mx - offsetx)
				posy = (my - offsety)
			else
				dragflag = false
			end
		end
		-- window widgets
		if windowdrawn then -- the variable is false when main window is collapsed
			imgui:text("Hello Dear ImGui!")
			imgui:newLine()
			imgui:textColored("This window can be moved, resized and closed!", 0x00ff7f, 1)
			imgui:text("its position is: "..posx..", "..posy)
		end
		imgui:endWindow()
	end

	-- 3. we end ImGui frame and render to screen
	imgui:endFrame()
	imgui:render()
end

stage:addEventListener(Event.ENTER_FRAME, onEnterFrame)

beginDisabled/endDisabled

require "ImGui"

local imgui = ImGui.new()
stage:addChild(imgui)

local window01 = true -- the starting state of window01, true = window is visible at start up

function onEnterFrame(e)
	-- 1. we start ImGui
	imgui:newFrame(e.deltaTime)

	-- 2. we add a child window and build our GUI
	if window01 then -- is window visible (not closed)?
		local windowdrawn = false -- is window expanded or colapsed?
		window01, windowdrawn = imgui:beginWindow( -- with close button
			"Hello ImGui v"..ImGui._VERSION, -- window title
			window01 -- returns window visibility
		)
		if windowdrawn then -- the variable is false when main window is collapsed
			imgui:text("This is an ImGui text.") -- we add a text element to our GUI
			imgui:textColored("This is a colored text.", 0xff00ff, 1)

			imgui:beginDisabled(true)
			imgui:text("This text is disabled!") -- the text is greyed out
			imgui:endDisabled()

			imgui:text("This text is not disabled.")
		end
		imgui:endWindow()
	end

	-- 3. we end the frame and render to screen
	imgui:endFrame()
	imgui:render()
end

stage:addEventListener(Event.ENTER_FRAME, onEnterFrame)

TabBar

require "ImGui"

local imgui = ImGui.new()
stage:addChild(imgui)

function onEnterFrame(e)
	imgui:newFrame(e.deltaTime)
	if imgui:beginTabBar("TABBAR") then
		if imgui:beginTabItem("Files") then
			imgui:textColored("File is ready", 0x00ff00, 1)
			imgui:text("Amp min:") imgui:sameLine()
			imgui:text("Amp max:") imgui:sameLine()
			imgui:endTabItem()
		end
		if imgui:beginTabItem("Microphone") then
			imgui:text("xxx min:") imgui:sameLine()
			imgui:text("xxx max:") imgui:sameLine()
			imgui:endTabItem()
		end
		imgui:endTabBar()
	end
	imgui:render()
	imgui:endFrame()
end

stage:addEventListener(Event.ENTER_FRAME, onEnterFrame)

More to come God's willing...

Dear ImGui

---

• Main Page
• Lua API
• Main API
• Plugins