UI definitions

UI elements can be both loaded from Lua definitions or created on the fly.

-- some_name.ui.lua

register_ui "mywindow"
{
  element "window" { -- id will be mywindow.window
    position  = { 10, 10 },
    dimension = { 400, 100 },
    class     = "mywindow", -- style class
    element { -- unnamed element (mywindow.window.1)
      position = { 10, 10 }, -- relative, dimension auto
      text = "Hello world! Fine day?",
    },
    button "yes" { -- subelement, will be mywindow.window.yes
      rposition  = { 0.1, 0.8 }, -- relative positioning
      rdimension = { 0.3, nil }, -- just one value, other is nil
      dimension  = { nil, 20 }, -- other value not relative
      text       = "Yes!",
    },
    button "no" { -- 
      rposition  = { 0.1, 0.8 }, -- relative positioning
      rdimension = { 0.3 }, -- just one value, other is nil hence can be ommited
      dimension  = { nil, 20 }, -- other value not relative
      text       = "No :(",
    },
  },
}

-- some_script.lua

function run_mywindow()
  ui_element = ui.create( "mywindow" );
  ui_element:find("yes").on_click = function(self) self:destroy(true) end
  ui_element:find("no").on_click  = function(self) self:destroy(false) end
  return ui.run_modal( ui_element )
end

  // C++ invocation
  bool result = lua->call<bool>("run_mywindow");

UI styles

Modeled after CSS but using pure lua.

Each UI element has:

• id value, might not be set
• class value, might be set by user
• special modifier (selected, hover, etc)

-- some_name.style.lua
default = {
  text_color         = { 0.3, 0.3, 0.3, 1.0 },
  background_color   = { 0.0, 0.0, 0.0, 1.0 },
  background_image   = "source:path/name/file.png",
  background_stretch = false,

  -- class definition
  redclass = {
    text_color   = { 1.0, 0.3, 0.3, 1.0 },
    border_color = SILVER, -- constant colors
    -- modifier definition, within type
    [":hover"] = {
      border_color = RED, -- constant colors
    }
  },

  -- id definition (no need for additional because unique!
  mybutton = {
    border_width = 3,
  }
}