Widgets WIP

This commit is contained in:
Insality
2024-11-18 22:50:42 +02:00
parent 99f75dd626
commit 299f8501e8
15 changed files with 181 additions and 265 deletions

View File

@@ -1,4 +1,3 @@
script: ""
fonts {
name: "text_bold"
font: "/druid/fonts/text_bold.font"
@@ -7,322 +6,135 @@ textures {
name: "druid"
texture: "/druid/druid.atlas"
}
background_color {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
nodes {
position {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 400.0
y: 40.0
z: 0.0
w: 1.0
}
color {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: "druid/empty"
id: "root"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_NW
adjust_mode: ADJUST_MODE_STRETCH
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
custom_type: 0
enabled: true
visible: false
material: ""
}
nodes {
position {
x: 0.0
y: -20.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 0.65
y: 0.65
z: 1.0
w: 1.0
}
size {
x: 200.0
y: 40.0
z: 0.0
w: 1.0
}
color {
x: 0.463
y: 0.475
z: 0.49
w: 1.0
}
type: TYPE_TEXT
blend_mode: BLEND_MODE_ALPHA
text: "Button"
font: "text_bold"
id: "text_name"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_W
outline {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
shadow {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
adjust_mode: ADJUST_MODE_FIT
line_break: false
parent: "root"
layer: ""
inherit_alpha: true
alpha: 1.0
outline_alpha: 0.0
shadow_alpha: 0.0
template_node_child: false
text_leading: 1.0
text_tracking: 0.0
custom_type: 0
enabled: true
visible: true
material: ""
}
nodes {
position {
x: 267.0
y: -20.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 226.0
y: 40.0
z: 0.0
w: 1.0
}
color {
x: 0.463
y: 0.475
z: 0.49
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: "druid/rect_round2_width1"
texture: "druid/rect_round2_width2"
id: "button"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "root"
layer: ""
inherit_alpha: true
slice9 {
x: 4.0
y: 4.0
z: 4.0
w: 4.0
x: 5.0
y: 5.0
z: 5.0
w: 5.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
custom_type: 0
enabled: true
visible: true
material: ""
}
nodes {
position {
x: 0.0
y: -20.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 226.0
y: 4.0
z: 0.0
w: 1.0
}
color {
x: 0.894
y: 0.506
z: 0.333
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: "druid/pixel"
id: "selected"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_S
adjust_mode: ADJUST_MODE_STRETCH
parent: "button"
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
custom_type: 0
enabled: true
visible: true
material: ""
}
nodes {
position {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 0.65
y: 0.65
z: 1.0
w: 1.0
}
size {
x: 250.0
y: 30.0
z: 0.0
w: 1.0
}
color {
x: 0.722
y: 0.741
z: 0.761
w: 1.0
}
type: TYPE_TEXT
blend_mode: BLEND_MODE_ALPHA
text: "Button"
font: "text_bold"
id: "text_button"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
outline {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
shadow {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
adjust_mode: ADJUST_MODE_FIT
line_break: false
parent: "button"
layer: ""
inherit_alpha: true
alpha: 1.0
outline_alpha: 0.0
shadow_alpha: 0.0
template_node_child: false
text_leading: 1.0
text_tracking: 0.0
custom_type: 0
enabled: true
visible: true
material: ""
}
material: "/builtins/materials/gui.material"
adjust_reference: ADJUST_REFERENCE_PARENT
max_nodes: 512

View File

@@ -1,6 +1,6 @@
---@class property_button: druid.base_component
---@class property_button: druid.widget
---@field root node
---@field text_name druid.lang_text
---@field text_name druid.text
---@field button druid.button
---@field text_button druid.text
---@field druid druid_instance
@@ -12,7 +12,7 @@ function M:init(template, nodes)
self.druid = self:get_druid(template, nodes)
self.root = self:get_node("root")
self.text_name = self.druid:new_lang_text("text_name")
self.text_name = self.druid:new_text("text_name")
self.selected = self:get_node("selected")
gui.set_alpha(self.selected, 0)

View File

@@ -1,6 +1,6 @@
---@class property_checkbox: druid.widget
---@field root node
---@field druid druid_instance
---@field root druid.container
---@field text_name druid.lang_text
---@field button druid.button
---@field selected node
@@ -11,7 +11,7 @@ local M = {}
---@param nodes table<hash, node>
function M:init(template, nodes)
self.druid = self:get_druid(template, nodes)
self.root = self.druid:new_container("root")
self.root = self:get_node("root")
self.icon = self:get_node("icon")
gui.set_enabled(self.icon, false)

View File

@@ -1,6 +1,6 @@
---@class property_slider: druid.widget
---@field root node
---@field druid druid_instance
---@field root druid.container
---@field text_name druid.lang_text
---@field text_value druid.text
---@field slider druid.slider
@@ -12,7 +12,7 @@ local M = {}
function M:init(template, nodes)
self.druid = self:get_druid(template, nodes)
self.root = self.druid:new_container("root") --[[@as druid.container]]
self.root = self:get_node("root")
self.selected = self:get_node("selected")
gui.set_alpha(self.selected, 0)
self._value = 0

View File

@@ -2,14 +2,18 @@ fonts {
name: "text_regular"
font: "/druid/fonts/text_regular.font"
}
fonts {
name: "text_bold"
font: "/druid/fonts/text_bold.font"
}
textures {
name: "druid"
texture: "/druid/druid.atlas"
}
nodes {
size {
x: 440.0
y: 350.0
x: 400.0
y: 240.0
}
color {
x: 0.173
@@ -17,19 +21,24 @@ nodes {
z: 0.204
}
type: TYPE_BOX
texture: "druid/pixel"
texture: "druid/ui_circle_16"
id: "root"
adjust_mode: ADJUST_MODE_STRETCH
inherit_alpha: true
slice9 {
x: 8.0
y: 8.0
z: 8.0
w: 8.0
}
}
nodes {
position {
x: -210.0
y: 165.0
x: -196.0
y: 116.0
}
scale {
x: 0.9
y: 0.9
x: 0.8
y: 0.8
}
size {
x: 245.0
@@ -62,12 +71,12 @@ nodes {
}
nodes {
position {
x: -200.0
y: 115.0
x: -196.0
y: 70.0
}
size {
x: 400.0
y: 290.0
x: 392.0
y: 190.0
}
type: TYPE_BOX
texture: "druid/empty"
@@ -81,16 +90,19 @@ nodes {
}
nodes {
size {
x: 400.0
y: 290.0
x: 392.0
y: 186.0
}
type: TYPE_BOX
texture: "druid/empty"
texture: "druid/pixel"
id: "scroll_content"
pivot: PIVOT_NW
adjust_mode: ADJUST_MODE_STRETCH
parent: "scroll_view"
inherit_alpha: true
slice9 {
w: 6.0
}
visible: false
}
nodes {
@@ -280,5 +292,23 @@ nodes {
parent: "property_button/button"
template_node_child: true
}
nodes {
position {
x: 192.0
y: 112.0
}
color {
x: 0.129
y: 0.141
z: 0.157
}
type: TYPE_BOX
texture: "druid/ui_circle_32"
id: "icon_drag"
pivot: PIVOT_NE
parent: "root"
inherit_alpha: true
size_mode: SIZE_MODE_AUTO
}
material: "/builtins/materials/gui.material"
adjust_reference: ADJUST_REFERENCE_PARENT

View File

@@ -4,7 +4,7 @@ local property_button = require("druid.widget.properties_panel.properties.proper
---@class properties_panel: druid.widget
---@field root node
---@field text_no_properties druid.lang_text
---@field text_no_properties node
---@field scroll druid.scroll
---@field druid druid_instance
local M = {}
@@ -16,15 +16,18 @@ function M:init(template, nodes)
--self.root = self.druid:new_container("root")
self.root = self:get_node("root")
self.text_no_properties = self:get_node("text_no_properties")
--self.root:add_container("text_header")
self.properties = {}
self.scroll = self.druid:new_scroll("scroll_view", "scroll_content")
--self.layout = self.druid:new_layout("scroll_content")
self.layout = self.druid:new_layout("scroll_content", "vertical")
:set_hug_content(false, true)
--self.grid = self.druid:new_grid("scroll_content", "item_size", 1)
--self.scroll:bind_grid(self.grid)
self.layout.on_size_changed:subscribe(self.on_size_changed, self)
self.drag_corner = self.druid:new_drag("icon_drag", self.on_drag_corner)
self.property_checkbox_prefab = self:get_node("property_checkbox/root")
gui.set_enabled(self.property_checkbox_prefab, false)
@@ -34,6 +37,18 @@ function M:init(template, nodes)
self.property_button_prefab = self:get_node("property_button/root")
gui.set_enabled(self.property_button_prefab, false)
self.container = self.druid:new_container(self.root)
self.container:add_container("text_header")
self.container:add_container("icon_drag")
local container_scroll_view = self.container:add_container("scroll_view")
container_scroll_view:add_container("scroll_content")
end
function M:on_drag_corner(dx, dy)
local position = self.container:get_position()
self.container:set_position(position.x + dx, position.y + dy)
end
@@ -42,14 +57,15 @@ function M:clear()
self.druid:remove(self.properties[index])
end
self.properties = {}
gui.set_enabled(self.text_no_properties, true)
end
--local nodes = self.grid.nodes
--for index = 1, #nodes do
-- gui.delete_node(nodes[index])
--end
--self.grid:clear()
gui.set_enabled(self.text_no_properties.text.node, true)
function M:on_size_changed(new_size)
new_size.x = new_size.x + 8
new_size.y = new_size.y + 50 + 8
self.container:set_size(new_size.x, new_size.y, gui.PIVOT_N)
end
@@ -59,17 +75,17 @@ end
---@return property_checkbox
function M:add_checkbox(text_id, initial_value, on_change_callback)
local nodes = gui.clone_tree(self.property_checkbox_prefab)
local instance = self.druid:new(property_checkbox, "property_checkbox", nodes) --[[@as property_checkbox]]
instance.text_name:translate(text_id)
local instance = self.druid:new_widget(property_checkbox, "property_checkbox", nodes)
instance.text_name:set_to(text_id)
instance:set_value(initial_value, true)
instance.button.on_click:subscribe(function()
on_change_callback(instance:get_value())
end)
gui.set_enabled(instance.root.node, true)
--self.grid:add(instance.root.node)
gui.set_enabled(instance.root, true)
self.layout:add(instance.root)
table.insert(self.properties, instance)
gui.set_enabled(self.text_no_properties.text.node, false)
gui.set_enabled(self.text_no_properties, false)
return instance
end
@@ -81,14 +97,14 @@ end
---@return property_slider
function M:add_slider(text_id, initial_value, on_change_callback)
local nodes = gui.clone_tree(self.property_slider_prefab)
local instance = self.druid:new(property_slider, "property_slider", nodes) --[[@as property_slider]]
instance.text_name:translate(text_id)
local instance = self.druid:new_widget(property_slider, "property_slider", nodes)
instance.text_name:set_to(text_id)
instance:set_value(initial_value, true)
gui.set_enabled(instance.root.node, true)
--self.grid:add(instance.root.node)
gui.set_enabled(instance.root, true)
self.layout:add(instance.root)
table.insert(self.properties, instance)
gui.set_enabled(self.text_no_properties.text.node, false)
gui.set_enabled(self.text_no_properties, false)
instance.slider.on_change_value:subscribe(function(_, value)
on_change_callback(value)
@@ -99,21 +115,41 @@ end
---@param text_id string
---@param on_click_callback function
function M:add_button(text_id, on_click_callback)
---@param on_click_callback function|nil
---@param callback_context any|nil
function M:add_button(text_id, on_click_callback, callback_context)
local nodes = gui.clone_tree(self.property_button_prefab)
local instance = self.druid:new(property_button, "property_button", nodes) --[[@as property_button]]
instance.text_name:translate(text_id)
local instance = self.druid:new_widget(property_button, "property_button", nodes)
instance.text_name:set_to(text_id)
gui.set_enabled(instance.root, true)
--self.grid:add(instance.root)
self.layout:add(instance.root)
table.insert(self.properties, instance)
gui.set_enabled(self.text_no_properties.text.node, false)
gui.set_enabled(self.text_no_properties, false)
instance.button.on_click:subscribe(on_click_callback)
if on_click_callback then
instance.button.on_click:subscribe(on_click_callback, callback_context)
end
return instance
end
function M:remove(widget)
for index = 1, #self.properties do
if self.properties[index] == widget then
self.druid:remove(widget)
self.layout:remove(widget.root)
gui.delete_node(widget.root)
table.remove(self.properties, index)
break
end
end
if #self.properties == 0 then
gui.set_enabled(self.text_no_properties, true)
end
end
return M