Partydeck/Extension-Druid
3
0
Fork 0
mirror of https://github.com/Insality/druid.git synced 2025-09-27 10:02:18 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add new examples

Browse Source
This commit is contained in:
Insality
2024-10-19 10:59:13 +03:00
parent 8d409b8062
commit ebd7f94354
24 changed files with 1029 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
example/examples/widgets/examples_list.lua Normal file
View File

@@ -0,0 +1,59 @@
local M = {}
function M.get_examples()
---@type druid.example.data[]
return {
{
name_id = "ui_example_widget_hover_hint",
information_text_id = "ui_example_widget_hover_hint_description",
template = "hover_hint_example",
root = "hover_hint_example/root",
code_url = "example/examples/widgets/hover_hint/hover_hint_example.lua",
component_class = require("example.examples.widgets.hover_hint.hover_hint_example"),
},
{
name_id = "ui_example_widget_property_button",
information_text_id = "ui_example_widget_property_button_description",
template = "property_button",
root = "property_button/root",
code_url = "example/components/properties_panel/properties/property_button.lua",
component_class = require("example.components.properties_panel.properties.property_button"),
on_create = function(instance, output_list)
---@cast instance property_button
instance.button.on_click:subscribe(function()
output_list:add_log_text("Button clicked")
end)
end,
},
{
name_id = "ui_example_widget_property_slider",
information_text_id = "ui_example_widget_property_slider_description",
template = "property_slider",
root = "property_slider/root",
code_url = "example/components/properties_panel/properties/property_slider.lua",
component_class = require("example.components.properties_panel.properties.property_slider"),
on_create = function(instance, output_list)
---@cast instance property_slider
instance.slider.on_change_value:subscribe(function(_, value)
output_list:add_log_text("Slider value: " .. value)
end)
end,
},
{
name_id = "ui_example_widget_property_checkbox",
information_text_id = "ui_example_widget_property_checkbox_description",
template = "property_checkbox",
root = "property_checkbox/root",
code_url = "example/components/properties_panel/properties/property_checkbox.lua",
component_class = require("example.components.properties_panel.properties.property_checkbox"),
on_create = function(instance, output_list)
---@cast instance property_checkbox
instance.button.on_click:subscribe(function()
output_list:add_log_text("Checkbox clicked")
end)
end,
},
}
end
return M

76
example/examples/widgets/hover_hint/hover_hint.gui Normal file
View File

@@ -0,0 +1,76 @@
fonts {
name: "text_regular"
font: "/example/assets/fonts/text_regular.font"
}
textures {
name: "druid"
texture: "/example/assets/druid.atlas"
}
nodes {
size {
x: 200.0
y: 90.0
}
type: TYPE_BOX
id: "root"
inherit_alpha: true
visible: false
}
nodes {
size {
x: 250.0
y: 90.0
}
color {
x: 0.129
y: 0.141
z: 0.157
}
type: TYPE_BOX
texture: "druid/ui_circle_32"
id: "panel_hint"
parent: "root"
inherit_alpha: true
slice9 {
x: 16.0
y: 16.0
z: 16.0
w: 16.0
}
}
nodes {
scale {
x: 0.65
y: 0.65
}
size {
x: 350.0
y: 150.0
}
color {
x: 0.463
y: 0.475
z: 0.49
}
type: TYPE_TEXT
text: "Show hint on hover"
font: "text_regular"
id: "text_hint"
outline {
x: 1.0
y: 1.0
z: 1.0
}
shadow {
x: 1.0
y: 1.0
z: 1.0
}
line_break: true
parent: "panel_hint"
inherit_alpha: true
outline_alpha: 0.0
shadow_alpha: 0.0
}
material: "/builtins/materials/gui.material"
adjust_reference: ADJUST_REFERENCE_PARENT

139
example/examples/widgets/hover_hint/hover_hint.lua Normal file
View File

@@ -0,0 +1,139 @@
local helper = require("druid.helper")
local druid_const = require("druid.const")
local component = require("druid.component")
---@class hover_hint: druid.base_component
---@field druid druid_instance
---@field root node
---@field panel_hint node
---@field text_hint druid.text
---@field hovers druid.hover[]
---@field is_shown boolean
---@field private _hint_text string
---@field private _hover_timer_id hash
local M = component.create("hover_hint")
local TIMER_DELAY = 0.5
local MIN_PANEL_WIDTH = 100
local MIN_PANEL_HEIGHT = 50
local PANEL_MARGIN = 40
local HINT_OFFSET = 20
---@param template string
function M:init(template, nodes)
self.druid = self:get_druid(template, nodes)
self.root = self:get_node("root")
self.panel_hint = self:get_node("panel_hint")
self.text_hint = self.druid:new_text("text_hint")
self.hovers = {}
self._timer_id = nil
self.is_shown = false
gui.set_enabled(self.root, false)
end
---@param node node|string
---@param hint_text string
---@param pivot_point constant
---@param content_pivot constant
function M:add_hover_hint(node, hint_text, pivot_point, content_pivot)
local hover = self.druid:new_hover(node, nil, function(_, is_hover)
self:hide_hint()
if is_hover then
self._timer_id = timer.delay(TIMER_DELAY, false, function()
self._timer_id = nil
self:show_hint(node, hint_text, pivot_point, content_pivot)
end)
end
end)
table.insert(self.hovers, hover)
end
function M:hide_hint()
if self._timer_id then
timer.cancel(self._timer_id)
self._timer_id = nil
end
if self.is_shown then
self.is_shown = false
gui.animate(self.root, "color.w", 0, gui.EASING_OUTSINE, 0.2, 0, function()
gui.set_enabled(self.root, false)
end)
end
end
---@param hint_text string
---@param pivot_point constant
---@param content_pivot constant
function M:show_hint(node, hint_text, pivot_point, content_pivot)
self:refresh_content(node, hint_text, pivot_point, content_pivot)
self.is_shown = true
do -- Animate appear
gui.set_enabled(self.root, true)
gui.set_alpha(self.root, 0)
gui.animate(self.root, "color.w", 1, gui.EASING_OUTSINE, 0.2)
end
end
---@private
function M:refresh_content(node, hint_text, pivot_point, content_pivot)
self.text_hint:set_to(hint_text)
local text_width, text_height = self.text_hint:get_text_size()
local panel_width = math.max(text_width, MIN_PANEL_WIDTH) + PANEL_MARGIN
local panel_height = math.max(text_height, MIN_PANEL_HEIGHT) + PANEL_MARGIN
gui.set(self.root, "size.x", panel_width)
gui.set(self.root, "size.y", panel_height)
gui.set(self.panel_hint, "size.x", panel_width)
gui.set(self.panel_hint, "size.y", panel_height)
self:refresh_position(node, pivot_point, content_pivot)
end
---@private
---@param node node
---@param pivot_point constant
---@param content_pivot constant
function M:refresh_position(node, pivot_point, content_pivot)
local screen_position = gui.get_screen_position(node)
local node_size = gui.get_size(node)
node_size.x = node_size.x + HINT_OFFSET * 2
node_size.y = node_size.y + HINT_OFFSET * 2
-- Offset for trigger node
local offset = -vmath.mul_per_elem(node_size, druid_const.PIVOTS[gui.get_pivot(node)])
-- Offset from center to pivot pointi
offset = offset + vmath.mul_per_elem(node_size, druid_const.PIVOTS[pivot_point])
-- Offset for hint component
local hint_size = gui.get_size(self.root)
offset = offset - vmath.mul_per_elem(hint_size, druid_const.PIVOTS[content_pivot])
-- Position
local world_scale = helper.get_scene_scale(self.root)
local local_pos = gui.screen_to_local(self.root, screen_position) / world_scale.x
gui.set_position(self.root, local_pos)
local position = gui.get_position(self.root)
if offset then
position = position + offset
end
gui.set_position(self.root, position)
end
return M

155
example/examples/widgets/hover_hint/hover_hint_example.gui Normal file
View File

@@ -0,0 +1,155 @@
textures {
name: "druid"
texture: "/example/assets/druid.atlas"
}
nodes {
size {
x: 1000.0
y: 1000.0
}
color {
x: 0.173
y: 0.184
z: 0.204
}
type: TYPE_BOX
texture: "druid/ui_circle_64"
id: "root"
inherit_alpha: true
slice9 {
x: 32.0
y: 32.0
z: 32.0
w: 32.0
}
}
nodes {
position {
y: 270.0
}
type: TYPE_TEMPLATE
id: "hover_hint"
parent: "root"
inherit_alpha: true
template: "/example/examples/widgets/hover_hint/hover_hint.gui"
}
nodes {
type: TYPE_BOX
id: "hover_hint/root"
parent: "hover_hint"
template_node_child: true
}
nodes {
type: TYPE_BOX
id: "hover_hint/panel_hint"
parent: "hover_hint/root"
template_node_child: true
}
nodes {
type: TYPE_TEXT
id: "hover_hint/text_hint"
parent: "hover_hint/panel_hint"
template_node_child: true
}
nodes {
position {
y: 100.0
}
size {
x: 140.0
y: 140.0
}
color {
x: 0.902
y: 0.875
z: 0.624
}
type: TYPE_BOX
texture: "druid/ui_circle_32"
id: "node_yellow"
parent: "root"
inherit_alpha: true
slice9 {
x: 16.0
y: 16.0
z: 16.0
w: 16.0
}
}
nodes {
position {
x: 200.0
}
size {
x: 140.0
y: 140.0
}
color {
x: 0.957
y: 0.608
z: 0.608
}
type: TYPE_BOX
texture: "druid/ui_circle_32"
id: "node_red"
parent: "root"
inherit_alpha: true
slice9 {
x: 16.0
y: 16.0
z: 16.0
w: 16.0
}
}
nodes {
position {
x: -200.0
}
size {
x: 140.0
y: 140.0
}
color {
x: 0.631
y: 0.843
z: 0.961
}
type: TYPE_BOX
texture: "druid/ui_circle_32"
id: "node_blue"
parent: "root"
inherit_alpha: true
slice9 {
x: 16.0
y: 16.0
z: 16.0
w: 16.0
}
}
nodes {
position {
y: -100.0
}
size {
x: 140.0
y: 140.0
}
color {
x: 0.557
y: 0.835
z: 0.62
}
type: TYPE_BOX
texture: "druid/ui_circle_32"
id: "node_green"
parent: "root"
inherit_alpha: true
slice9 {
x: 16.0
y: 16.0
z: 16.0
w: 16.0
}
}
material: "/builtins/materials/gui.material"
adjust_reference: ADJUST_REFERENCE_PARENT

23
example/examples/widgets/hover_hint/hover_hint_example.lua Normal file
View File

@@ -0,0 +1,23 @@
local hover_hint = require("example.examples.widgets.hover_hint.hover_hint")
local component = require("druid.component")
---@class hover_hint_example: druid.component
---@field druid druid_instance
local M = component.create("hover_hint_example")
---@param template string
---@param nodes table<hash, node>
function M:init(template, nodes)
self.druid = self:get_druid(template, nodes)
self.hover_hint = self.druid:new(hover_hint, "hover_hint")
self.hover_hint:add_hover_hint(self:get_node("node_yellow"), "Yellow box", gui.PIVOT_N, gui.PIVOT_S)
self.hover_hint:add_hover_hint(self:get_node("node_green"), "Green box", gui.PIVOT_S, gui.PIVOT_N)
self.hover_hint:add_hover_hint(self:get_node("node_red"), "Red box", gui.PIVOT_E, gui.PIVOT_W)
self.hover_hint:add_hover_hint(self:get_node("node_blue"), "And this is definitely a blue box", gui.PIVOT_W, gui.PIVOT_E)
end
return M