mirror of
https://github.com/Insality/druid.git
synced 2025-09-27 18:12:19 +02:00
Add new examples
This commit is contained in:
Insality
77
example/examples/basic/checkbox/checkbox.gui
Normal file
77
example/examples/basic/checkbox/checkbox.gui
Normal file
@@ -0,0 +1,77 @@
|
||||
fonts {
|
||||
name: "text_bold"
|
||||
font: "/example/assets/fonts/text_bold.font"
|
||||
}
|
||||
textures {
|
||||
name: "druid"
|
||||
texture: "/example/assets/druid.atlas"
|
||||
}
|
||||
nodes {
|
||||
size {
|
||||
x: 70.0
|
||||
y: 70.0
|
||||
}
|
||||
type: TYPE_BOX
|
||||
id: "root"
|
||||
inherit_alpha: true
|
||||
size_mode: SIZE_MODE_AUTO
|
||||
visible: false
|
||||
}
|
||||
nodes {
|
||||
size {
|
||||
x: 40.0
|
||||
y: 40.0
|
||||
}
|
||||
color {
|
||||
x: 0.463
|
||||
y: 0.475
|
||||
z: 0.49
|
||||
}
|
||||
type: TYPE_BOX
|
||||
texture: "druid/rect_round2_width1"
|
||||
id: "button"
|
||||
parent: "root"
|
||||
inherit_alpha: true
|
||||
slice9 {
|
||||
x: 4.0
|
||||
y: 4.0
|
||||
z: 4.0
|
||||
w: 4.0
|
||||
}
|
||||
}
|
||||
nodes {
|
||||
color {
|
||||
x: 0.722
|
||||
y: 0.741
|
||||
z: 0.761
|
||||
}
|
||||
type: TYPE_BOX
|
||||
texture: "druid/icon_check"
|
||||
id: "icon"
|
||||
parent: "button"
|
||||
inherit_alpha: true
|
||||
size_mode: SIZE_MODE_AUTO
|
||||
}
|
||||
nodes {
|
||||
position {
|
||||
y: -20.0
|
||||
}
|
||||
size {
|
||||
x: 40.0
|
||||
y: 4.0
|
||||
}
|
||||
color {
|
||||
x: 0.894
|
||||
y: 0.506
|
||||
z: 0.333
|
||||
}
|
||||
type: TYPE_BOX
|
||||
texture: "druid/pixel"
|
||||
id: "selected"
|
||||
pivot: PIVOT_S
|
||||
adjust_mode: ADJUST_MODE_STRETCH
|
||||
parent: "button"
|
||||
inherit_alpha: true
|
||||
}
|
||||
material: "/builtins/materials/gui.material"
|
||||
adjust_reference: ADJUST_REFERENCE_PARENT
|
||||
50
example/examples/basic/checkbox/checkbox.lua
Normal file
50
example/examples/basic/checkbox/checkbox.lua
Normal file
@@ -0,0 +1,50 @@
|
||||
local component = require("druid.component")
|
||||
local event = require("druid.event")
|
||||
|
||||
---@class checkbox: druid.base_component
|
||||
---@field druid druid_instance
|
||||
---@field button druid.button
|
||||
local M = component.create("checkbox")
|
||||
|
||||
|
||||
---@param template string
|
||||
---@param nodes table<hash, node>
|
||||
function M:init(template, nodes)
|
||||
self.druid = self:get_druid(template, nodes)
|
||||
|
||||
self.button = self.druid:new_button("root", self.on_checkbox_click) -- Button to handle checkbox
|
||||
self.icon = self:get_node("icon") -- Checkbox icon to hide/show
|
||||
self.selected = self:get_node("selected") -- Selected effect to show when checkbox is changed
|
||||
gui.set_alpha(self.selected, 0)
|
||||
|
||||
self:set_state(false)
|
||||
|
||||
self.on_state_changed = event.create()
|
||||
end
|
||||
|
||||
|
||||
function M:on_checkbox_click()
|
||||
self:set_state(not self.is_enabled)
|
||||
self.on_state_changed:trigger(self.is_enabled)
|
||||
end
|
||||
|
||||
|
||||
function M:set_state(is_enabled)
|
||||
if self.is_enabled == is_enabled then
|
||||
return
|
||||
end
|
||||
|
||||
self.is_enabled = is_enabled
|
||||
gui.set_enabled(self.icon, self.is_enabled)
|
||||
|
||||
gui.set_alpha(self.selected, 1)
|
||||
gui.animate(self.selected, "color.w", 0, gui.EASING_INSINE, 0.16)
|
||||
end
|
||||
|
||||
|
||||
function M:get_state()
|
||||
return self.is_enabled
|
||||
end
|
||||
|
||||
|
||||
return M
|
||||
120
example/examples/basic/checkbox_group/checkbox_group.gui
Normal file
120
example/examples/basic/checkbox_group/checkbox_group.gui
Normal file
@@ -0,0 +1,120 @@
|
||||
fonts {
|
||||
name: "text_bold"
|
||||
font: "/example/assets/fonts/text_bold.font"
|
||||
}
|
||||
textures {
|
||||
name: "druid"
|
||||
texture: "/example/assets/druid.atlas"
|
||||
}
|
||||
nodes {
|
||||
size {
|
||||
x: 200.0
|
||||
y: 100.0
|
||||
}
|
||||
type: TYPE_BOX
|
||||
id: "root"
|
||||
inherit_alpha: true
|
||||
size_mode: SIZE_MODE_AUTO
|
||||
visible: false
|
||||
}
|
||||
nodes {
|
||||
position {
|
||||
x: -100.0
|
||||
}
|
||||
type: TYPE_TEMPLATE
|
||||
id: "checkbox_1"
|
||||
parent: "root"
|
||||
inherit_alpha: true
|
||||
template: "/example/examples/basic/checkbox/checkbox.gui"
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_1/root"
|
||||
parent: "checkbox_1"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_1/button"
|
||||
parent: "checkbox_1/root"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_1/icon"
|
||||
parent: "checkbox_1/button"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_1/selected"
|
||||
parent: "checkbox_1/button"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_TEMPLATE
|
||||
id: "checkbox_2"
|
||||
parent: "root"
|
||||
inherit_alpha: true
|
||||
template: "/example/examples/basic/checkbox/checkbox.gui"
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_2/root"
|
||||
parent: "checkbox_2"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_2/button"
|
||||
parent: "checkbox_2/root"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_2/icon"
|
||||
parent: "checkbox_2/button"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_2/selected"
|
||||
parent: "checkbox_2/button"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
position {
|
||||
x: 100.0
|
||||
}
|
||||
type: TYPE_TEMPLATE
|
||||
id: "checkbox_3"
|
||||
parent: "root"
|
||||
inherit_alpha: true
|
||||
template: "/example/examples/basic/checkbox/checkbox.gui"
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_3/root"
|
||||
parent: "checkbox_3"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_3/button"
|
||||
parent: "checkbox_3/root"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_3/icon"
|
||||
parent: "checkbox_3/button"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_3/selected"
|
||||
parent: "checkbox_3/button"
|
||||
template_node_child: true
|
||||
}
|
||||
material: "/builtins/materials/gui.material"
|
||||
adjust_reference: ADJUST_REFERENCE_PARENT
|
||||
39
example/examples/basic/checkbox_group/checkbox_group.lua
Normal file
39
example/examples/basic/checkbox_group/checkbox_group.lua
Normal file
@@ -0,0 +1,39 @@
|
||||
local event = require("druid.event")
|
||||
local component = require("druid.component")
|
||||
|
||||
-- Require checkbox component from checkbox example
|
||||
local checkbox = require("example.examples.basic.checkbox.checkbox")
|
||||
|
||||
---@class checkbox_group: druid.base_component
|
||||
---@field druid druid_instance
|
||||
---@field button druid.button
|
||||
local M = component.create("checkbox_group")
|
||||
|
||||
|
||||
---@param template string
|
||||
---@param nodes table<hash, node>
|
||||
function M:init(template, nodes)
|
||||
self.druid = self:get_druid(template, nodes)
|
||||
|
||||
self.checkbox_1 = self.druid:new(checkbox, "checkbox_1")
|
||||
self.checkbox_2 = self.druid:new(checkbox, "checkbox_2")
|
||||
self.checkbox_3 = self.druid:new(checkbox, "checkbox_3")
|
||||
|
||||
self.checkbox_1.on_state_changed:subscribe(self.on_checkbox_click, self)
|
||||
self.checkbox_2.on_state_changed:subscribe(self.on_checkbox_click, self)
|
||||
self.checkbox_3.on_state_changed:subscribe(self.on_checkbox_click, self)
|
||||
|
||||
self.on_state_changed = event.create()
|
||||
end
|
||||
|
||||
|
||||
function M:on_checkbox_click()
|
||||
print("Checkbox 1: ", self.checkbox_1:get_state())
|
||||
print("Checkbox 2: ", self.checkbox_2:get_state())
|
||||
print("Checkbox 3: ", self.checkbox_3:get_state())
|
||||
|
||||
self.on_state_changed:trigger(self.checkbox_1:get_state(), self.checkbox_2:get_state(), self.checkbox_3:get_state())
|
||||
end
|
||||
|
||||
|
||||
return M
|
||||
195
example/examples/basic/radio_group/radio_group.gui
Normal file
195
example/examples/basic/radio_group/radio_group.gui
Normal file
@@ -0,0 +1,195 @@
|
||||
fonts {
|
||||
name: "text_bold"
|
||||
font: "/example/assets/fonts/text_bold.font"
|
||||
}
|
||||
textures {
|
||||
name: "druid"
|
||||
texture: "/example/assets/druid.atlas"
|
||||
}
|
||||
nodes {
|
||||
size {
|
||||
x: 200.0
|
||||
y: 100.0
|
||||
}
|
||||
type: TYPE_BOX
|
||||
id: "root"
|
||||
inherit_alpha: true
|
||||
size_mode: SIZE_MODE_AUTO
|
||||
visible: false
|
||||
}
|
||||
nodes {
|
||||
position {
|
||||
x: -100.0
|
||||
}
|
||||
type: TYPE_TEMPLATE
|
||||
id: "checkbox_1"
|
||||
parent: "root"
|
||||
inherit_alpha: true
|
||||
template: "/example/examples/basic/checkbox/checkbox.gui"
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_1/root"
|
||||
parent: "checkbox_1"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
color {
|
||||
x: 0.31
|
||||
y: 0.318
|
||||
z: 0.322
|
||||
}
|
||||
type: TYPE_BOX
|
||||
texture: "druid/ui_circle_32"
|
||||
id: "checkbox_1/button"
|
||||
parent: "checkbox_1/root"
|
||||
slice9 {
|
||||
x: 8.0
|
||||
y: 8.0
|
||||
z: 8.0
|
||||
w: 8.0
|
||||
}
|
||||
overridden_fields: 5
|
||||
overridden_fields: 9
|
||||
overridden_fields: 22
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
texture: "druid/ui_circle_16"
|
||||
id: "checkbox_1/icon"
|
||||
parent: "checkbox_1/button"
|
||||
overridden_fields: 9
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
position {
|
||||
y: -8.0
|
||||
}
|
||||
type: TYPE_BOX
|
||||
texture: "druid/ui_circle_16"
|
||||
id: "checkbox_1/selected"
|
||||
parent: "checkbox_1/button"
|
||||
overridden_fields: 1
|
||||
overridden_fields: 9
|
||||
overridden_fields: 38
|
||||
template_node_child: true
|
||||
size_mode: SIZE_MODE_AUTO
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_TEMPLATE
|
||||
id: "checkbox_2"
|
||||
parent: "root"
|
||||
inherit_alpha: true
|
||||
template: "/example/examples/basic/checkbox/checkbox.gui"
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_2/root"
|
||||
parent: "checkbox_2"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
color {
|
||||
x: 0.31
|
||||
y: 0.318
|
||||
z: 0.322
|
||||
}
|
||||
type: TYPE_BOX
|
||||
texture: "druid/ui_circle_32"
|
||||
id: "checkbox_2/button"
|
||||
parent: "checkbox_2/root"
|
||||
slice9 {
|
||||
x: 8.0
|
||||
y: 8.0
|
||||
z: 8.0
|
||||
w: 8.0
|
||||
}
|
||||
overridden_fields: 5
|
||||
overridden_fields: 9
|
||||
overridden_fields: 22
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
texture: "druid/ui_circle_16"
|
||||
id: "checkbox_2/icon"
|
||||
parent: "checkbox_2/button"
|
||||
overridden_fields: 9
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
position {
|
||||
y: -8.0
|
||||
}
|
||||
type: TYPE_BOX
|
||||
texture: "druid/ui_circle_16"
|
||||
id: "checkbox_2/selected"
|
||||
parent: "checkbox_2/button"
|
||||
overridden_fields: 1
|
||||
overridden_fields: 9
|
||||
overridden_fields: 38
|
||||
template_node_child: true
|
||||
size_mode: SIZE_MODE_AUTO
|
||||
}
|
||||
nodes {
|
||||
position {
|
||||
x: 100.0
|
||||
}
|
||||
type: TYPE_TEMPLATE
|
||||
id: "checkbox_3"
|
||||
parent: "root"
|
||||
inherit_alpha: true
|
||||
template: "/example/examples/basic/checkbox/checkbox.gui"
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
id: "checkbox_3/root"
|
||||
parent: "checkbox_3"
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
color {
|
||||
x: 0.31
|
||||
y: 0.318
|
||||
z: 0.322
|
||||
}
|
||||
type: TYPE_BOX
|
||||
texture: "druid/ui_circle_32"
|
||||
id: "checkbox_3/button"
|
||||
parent: "checkbox_3/root"
|
||||
slice9 {
|
||||
x: 8.0
|
||||
y: 8.0
|
||||
z: 8.0
|
||||
w: 8.0
|
||||
}
|
||||
overridden_fields: 5
|
||||
overridden_fields: 9
|
||||
overridden_fields: 22
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
type: TYPE_BOX
|
||||
texture: "druid/ui_circle_16"
|
||||
id: "checkbox_3/icon"
|
||||
parent: "checkbox_3/button"
|
||||
overridden_fields: 9
|
||||
template_node_child: true
|
||||
}
|
||||
nodes {
|
||||
position {
|
||||
y: -8.0
|
||||
}
|
||||
type: TYPE_BOX
|
||||
texture: "druid/ui_circle_16"
|
||||
id: "checkbox_3/selected"
|
||||
parent: "checkbox_3/button"
|
||||
overridden_fields: 1
|
||||
overridden_fields: 9
|
||||
overridden_fields: 38
|
||||
template_node_child: true
|
||||
size_mode: SIZE_MODE_AUTO
|
||||
}
|
||||
material: "/builtins/materials/gui.material"
|
||||
adjust_reference: ADJUST_REFERENCE_PARENT
|
||||
55
example/examples/basic/radio_group/radio_group.lua
Normal file
55
example/examples/basic/radio_group/radio_group.lua
Normal file
@@ -0,0 +1,55 @@
|
||||
local component = require("druid.component")
|
||||
local event = require("druid.event")
|
||||
|
||||
-- Require checkbox component from checkbox example
|
||||
local checkbox = require("example.examples.basic.checkbox.checkbox")
|
||||
|
||||
---@class radio_group: druid.base_component
|
||||
---@field druid druid_instance
|
||||
---@field button druid.button
|
||||
local M = component.create("radio_group")
|
||||
|
||||
|
||||
---@param template string
|
||||
---@param nodes table<hash, node>
|
||||
function M:init(template, nodes)
|
||||
self.druid = self:get_druid(template, nodes)
|
||||
|
||||
self.state = {}
|
||||
self.checkboxes = {
|
||||
self.druid:new(checkbox, "checkbox_1"),
|
||||
self.druid:new(checkbox, "checkbox_2"),
|
||||
self.druid:new(checkbox, "checkbox_3")
|
||||
}
|
||||
|
||||
for i = 1, #self.checkboxes do
|
||||
self.checkboxes[i].on_state_changed:subscribe(self.on_checkbox_click, self)
|
||||
self.state[i] = false
|
||||
end
|
||||
|
||||
self.checkboxes[1]:set_state(true)
|
||||
self.state[1] = true
|
||||
|
||||
self.on_state_changed = event.create()
|
||||
end
|
||||
|
||||
|
||||
function M:on_checkbox_click()
|
||||
local new_clicked = nil
|
||||
for index = 1, #self.checkboxes do
|
||||
if self.checkboxes[index]:get_state() ~= self.state[index] then
|
||||
new_clicked = index
|
||||
break
|
||||
end
|
||||
end
|
||||
|
||||
for index = 1, #self.state do
|
||||
self.checkboxes[index]:set_state(index == new_clicked)
|
||||
self.state[index] = index == new_clicked
|
||||
end
|
||||
|
||||
self.on_state_changed:trigger(new_clicked)
|
||||
end
|
||||
|
||||
|
||||
return M
|
||||
Reference in New Issue
Block a user