Elements

✨ Read the getting started here
Roblox properties are merged with the configuration of an element.

Sliders

Properties

• Label = string
• Format = "%.d" - :format Documentation (Value, MaxValue)
• Value = 0
• MinValue = int
• MaxValue = int
• ReadOnly = false

Methods

• :SetValue(Value: int)
• :FireCallback(...)
• :SetCallback(Callback: function)

Example

Tab:Slider({
	Label = "Slider",
	Format = "%.d/%s", 
	Value = 5,
	MinValue = 1,
	MaxValue = 32,

	Callback = function(self, Value)
		print(self.Name, Value)
	end,
})

Progress sliders

Methods

Same methods and properties as a Slider

Example

Tab:ProgressSlider({
	Label = "Progress Slider",
	Value = 8,
	MinValue = 1,
	MaxValue = 32,
})

Progress bar

Methods

Inherited methods and properties from a Slider

• :SetPercentage(Percentage: float/int)

local ProgressBar = Tab:ProgressBar({
	Label = "Loading...",
	Percentage = 80
})


spawn(function()
	local Percentage = 0
	while wait(.02) do
		Percentage += 1
		ProgressBar:SetPercentage(Percentage % 100)
	end
end)

Checkboxes

Properties

• Value = false
• Callback = function
• Label = string

Methods

• :SetTicked(Value: boolean)
• :Toggle()
• :FireCallback(...)
• :SetCallback(Callback: function)

Example

Tab:Checkbox({
	Label = "Check box",
	Value = true,
	Callback = function(self, Value)
		print(self.Name, Value)
	end,
})

Radio Buttons

Inherited methods and properties from a Checkbox

Example

Tab:RadioButton({
	Label = "Radio button",
	Value = true,
	Callback = function(self, Value)
		print(self.Name, Value)
	end,
})

Viewports

Properties

• Clone = false (Otherwise will parent)
• Model = Model

Methods

• :SetModel(Model: Model, PivotTo?: CFrame): Model
• :SetCamera(Camera: Camera)

Example

local RunService = game:GetService("RunService")
local Viewport = Tab:Viewport({
	Size = UDim2.new(1, 0, 0, 200),
	Clone = true, --// Otherwise will parent
	Model = Rig,
	Border = false
})

local NewRig = Viewport:SetModel(Rig, CFrame.new(0, -2.5, -5))

--// Spin rig
RunService.RenderStepped:Connect(function(deltaTime)
	local YRotation = 30 * deltaTime
	local cFrame = NewRig:GetPivot() * CFrame.Angles(0,math.rad(YRotation),0)
	NewRig:PivotTo(cFrame)
end)

Keybinds

Properties

• Label = string
• IgnoreGameProcessed = false?
• Callback = function
• Value = Enum.KeyCode?
• NullKey = Enum.KeyCode.Backspace

Methods

• :SetValue(Key: Enum.Keycode)
• :FireCallback(...)
• :SetCallback(Callback: function)

Example:

local Checkbox = Tab:Checkbox({
	Label = "Check box",
	Value = true
})

Tab:Keybind({
	Label = "Toggle checkbox",
	Value = Enum.KeyCode.Q,
	Callback = function(self, KeyCode)
		print("Activated:", KeyCode)
		Checkbox :Toggle()
	end,
})

Console

Properties

• ReadOnly = false
• LineNumbers = false
• Border = true
• Fill = false
• RichText = false
• TextWrapped = false
• AutoScroll = false
• Enabled = false
• MaxLines = 100

Methods

• :Clear()
• :AppendText(...)
• :UpdateLineNumbers()
• :UpdateScroll()
• :SetText(Value: string)

Example

local Console = Tab:Console({
	Text = "Console example",
	ReadOnly = true,
	Border = false,
	Fill = true,
	RichText = true,
	Enabled = true, 
	AutoScroll = true,
	MaxLines = 50
})

Tab:Button({ --// Toggle to enable the console
	Text = "Pause",
	Callback = function(self)
		local Paused = shared.Pause
		Paused = not (Paused or false)
		shared.Pause = Paused
		
		self.Text = Paused and "Paused" or "Pause"
		Console.Enabled = not Paused
	end,
})

spawn(function()
	while wait() do
		Console:AppendText( --// Passed parameters will be concatenated 
			`<font color="rgb(240, 40, 10)">[Random Math]</font>`, 
			math.random()
		)
	end
end)

Buttons

Properties

• Text = string (Roblox property)
• Callback = function

Methods

• :FireCallback(...)
• :SetCallback(Callback: function)

Example

Tab:Button({
	Text = "Enter",
	Callback = function(self)
		print("Hello world from", self.Name)
	end,
})

Rows

Properties

• Spacing = int

Methods

• :Fill()

Example

local ButtonsRow = Tab:Row()
for i = 1,5 do
	ButtonsRow:Button({
		Text = "Hello"
	})
end
ButtonsRow:Fill()

Labels

Properties

• Text = string (Roblox property)
• RichText = false (Roblox property)
• TextWrapped = false (Roblox property)

Example

Tab:Label({
	Text = "Hello from Depso's ImGui!"
})

Separators

Properties

• Text = string (Roblox property)

Example

Tab:Separator({
	Text = "Console Example:"
})
Tab:Separator()

Collapsing headers

Properties

• Title = string
• NoAnimation = false
• Open = false
• Image = string (Example: rbxassetid://6403436054)

Example

local Header = Tab:CollapsingHeader({
	Title = "Click me"
})
Header:Label({
	Text = "Boo! 👻"
})

TreeNodes

Inherited methods and properties from a CollapsingHeader

Example

local TreeNode = Tab:TreeNode({
	Title = "Tree node",
})

TreeNode:Label({
	Text = "Hello from Depso's ImGui!"
})

Images

Properties

• Image = int/string
• Callback = function

Methods

• :FireCallback(...)
• :SetCallback(Callback: function)

Example

Tab:Image({
	Image = 8825666803,
	Ratio = 16 / 9,
	AspectType = Enum.AspectType.FitWithinMaxSize,
	Size = UDim2.fromScale(1, 1)
})

Tables

Properties

• Border = true
• Fill = false
• RowBackground = false
• RowsFill = false
• Align = "Center" (Enum.VerticalAlignment)

Methods

• :ClearRows()
• :UpdateRows()

:CreateRow()

Methods

• :CreateColumn()
• :UpdateColumns()

Example

local Table = Tab:Table({
	RowBackground = true,
	Border = true,
	RowsFill = false,
	Size = UDim2.fromScale(1, 0)
})

coroutine.wrap(function()
	local Rows = 10
	local random = Random.new()
	while wait(1) do
		Table:ClearRows()
		
		for i = 1,Rows do
			local Row = Table:CreateRow()

			local Columns = random:NextInteger(1, 8)
			for x = 1, Columns do
				local Column = Row:CreateColumn()
				Column:Label({
					Text = `#{x}`
				})
			end
		end
	end
end)()

Combos/Dropdowns

Properties

• Placeholder = string
• Callback = function
• Items = Dict/Array
• NoAnimation = false
• Value = string (Previously .Selected)

Methods

• :SetOpen(Open: boolean)
• :SetValue(Item: string)
• :GetValue()
• :FireCallback(...)
• :SetCallback(Callback: function)

Example

Tab:Combo({
	Selected = "Car", --// Cancels Placeholder 
	Label = "Vehicle",
	Items = {
		"Car",
		"Bus",
		"Train",
		"Plane",
		"Boat"
	},
	Callback = function(self, Value)
		print("Selected:", Value)
	end,
})

Tab:Combo({
	Placeholder = "Select object",
	Label = "Food",
	Items = {
		["Apple"] = "Good",
		["Banana"] = "Bad",
		["Mango"] = "Okay"
	},
	Callback = function(self, Value)
		print("Selected:", Value, "Value:", self.Items[Value])
	end,
})

Modals

Properties & Methods

Inherited properties from a Window
Inherited methods from a Tab

Example

local ModalWindow = ImGui:CreateModal({ --// Returns a Tab class
	Title = "Modal Example",
	AutoSize = "Y"
})

ModalWindow:Label({
	Text = "Hello, this is a modal."
})
ModalWindow:Separator()

ModalWindow:Button({
	Text = "Okay",
	Callback = function()
		ModalWindow:Close()
	end,
})