Skip to main content
The Dialog class allows you to create custom UI dialogs with various widgets.

Constructor

Dialog([title])

title
string
Dialog window title.
local dlg = Dialog("My Dialog")
local dlg2 = Dialog()

Properties

bounds
Rectangle
Dialog window bounds.
data
table
Table containing all widget values by ID.

Methods

dlg:button(options)

options
table
required
Button configuration.
Adds a button to the dialog.
dlg:button{
  id = "ok",
  text = "OK",
  onclick = function()
    print("OK clicked")
  end
}

dlg:label(options)

options
table
required
Label configuration.
Adds a text label.
dlg:label{
  id = "info",
  text = "Enter your name:"
}

dlg:entry(options)

options
table
required
Text entry configuration.
Adds a text input field.
dlg:entry{
  id = "username",
  label = "Name:",
  text = "Default",
  onchange = function()
    print("Text changed to:", dlg.data.username)
  end
}

dlg:number(options)

options
table
required
Number field configuration.
Adds a numeric input field.
dlg:number{
  id = "count",
  label = "Count:",
  text = "10",
  decimals = 0
}

dlg:slider(options)

options
table
required
Slider configuration.
Adds a slider widget.
dlg:slider{
  id = "opacity",
  label = "Opacity:",
  min = 0,
  max = 255,
  value = 255
}

dlg:combobox(options)

options
table
required
Combobox configuration.
Adds a dropdown combobox.
dlg:combobox{
  id = "mode",
  label = "Mode:",
  option = "Normal",
  options = {"Normal", "Multiply", "Screen"}
}

dlg:check(options)

options
table
required
Checkbox configuration.
Adds a checkbox.
dlg:check{
  id = "enabled",
  label = "Enabled",
  selected = true
}

dlg:radio(options)

options
table
required
Radio button configuration.
Adds a radio button.
dlg:radio{
  id = "format",
  label = "PNG",
  selected = true
}
dlg:radio{
  id = "format",
  label = "JPG",
  selected = false
}

dlg:file(options)

options
table
required
File picker configuration.
Adds a file picker.
dlg:file{
  id = "filename",
  label = "File:",
  open = true,
  filetypes = {"png", "jpg"}
}

dlg:color(options)

options
table
required
Color picker configuration.
Adds a color picker.
dlg:color{
  id = "color",
  label = "Color:",
  color = Color{ r=255, g=0, b=0 }
}

dlg:shades(options)

options
table
required
Color shades configuration.
Adds a color shades widget.
dlg:shades{
  id = "shades",
  label = "Shades:",
  colors = {Color{r=255,g=0,b=0}, Color{r=0,g=255,b=0}}
}

dlg:separator(options)

options
table
Separator configuration.
Adds a visual separator.
dlg:separator()
dlg:separator{ text="Options" }

dlg:newrow()

Starts a new row for widgets.
dlg:entry{ id="name", label="Name:" }
dlg:newrow()
dlg:entry{ id="email", label="Email:" }

dlg:show([options])

options
table
Show options.
Shows the dialog.
-- Modal dialog (blocks until closed)
dlg:show()

-- Non-blocking dialog
dlg:show{ wait=false }

-- Custom bounds
dlg:show{ bounds=Rectangle(100, 100, 300, 200) }

dlg:close()

Closes the dialog.
dlg:close()

dlg:modify(options)

options
table
required
Widget modifications.
Modifies widget properties.
dlg:modify{
  id = "username",
  text = "New text",
  visible = true,
  enabled = true
}

Examples

Simple Input Dialog

local dlg = Dialog("Enter Name")
dlg:entry{
  id = "name",
  label = "Your Name:",
  text = "John Doe"
}
dlg:button{
  id = "ok",
  text = "OK",
  onclick = function()
    print("Hello, " .. dlg.data.name)
    dlg:close()
  end
}
dlg:button{ id="cancel", text="Cancel" }
dlg:show()

Dialog with Multiple Widgets

local dlg = Dialog("Export Settings")

dlg:file{
  id = "filename",
  label = "Output:",
  save = true,
  filetypes = {"png", "jpg"}
}

dlg:slider{
  id = "quality",
  label = "Quality:",
  min = 1,
  max = 100,
  value = 90
}

dlg:check{
  id = "transparent",
  label = "Transparent Background",
  selected = false
}

dlg:separator()

dlg:button{
  id = "export",
  text = "Export",
  onclick = function()
    local data = dlg.data
    print("Exporting to:", data.filename)
    print("Quality:", data.quality)
    print("Transparent:", data.transparent)
    dlg:close()
  end
}

dlg:button{ id="cancel", text="Cancel" }
dlg:show()

Dynamic Dialog

local dlg = Dialog("Dynamic Options")

dlg:combobox{
  id = "type",
  label = "Type:",
  option = "Color",
  options = {"Color", "Grayscale"},
  onchange = function()
    local isColor = dlg.data.type == "Color"
    dlg:modify{
      id = "colorpicker",
      visible = isColor
    }
  end
}

dlg:color{
  id = "colorpicker",
  label = "Color:",
  color = Color{r=255, g=0, b=0}
}

dlg:button{ id="ok", text="OK" }
dlg:show()

Non-Modal Dialog

local dlg = Dialog("Tool Settings")

dlg:slider{
  id = "size",
  label = "Size:",
  min = 1,
  max = 64,
  value = 1,
  onchange = function()
    app.brush = Brush{ size=dlg.data.size }
  end
}

dlg:button{
  id = "close",
  text = "Close",
  onclick = function()
    dlg:close()
  end
}

-- Show non-blocking
dlg:show{ wait=false }