mirror of
https://github.com/Insality/druid
synced 2025-06-27 02:17:52 +02:00
Solve #214 Fix hover on_input return value. Add hover example. Add hover_instance to hover callback
This commit is contained in:
parent
d93823ae6a
commit
8fb41ea8e9
@ -5,10 +5,10 @@
|
||||
-- @within BaseComponent
|
||||
-- @alias druid.hover
|
||||
|
||||
--- On hover callback(self, state)
|
||||
--- On hover callback(self, state, hover_instance)
|
||||
-- @tfield DruidEvent on_hover @{DruidEvent}
|
||||
|
||||
--- On mouse hover callback(self, state)
|
||||
--- On mouse hover callback(self, state, hover_instance)
|
||||
-- @tfield DruidEvent on_mouse_hover @{DruidEvent}
|
||||
|
||||
---
|
||||
@ -81,6 +81,8 @@ function Hover.on_input(self, action_id, action)
|
||||
else
|
||||
hover_function(self, true)
|
||||
end
|
||||
|
||||
return false
|
||||
end
|
||||
|
||||
|
||||
@ -95,7 +97,7 @@ end
|
||||
function Hover.set_hover(self, state)
|
||||
if self._is_hovered ~= state then
|
||||
self._is_hovered = state
|
||||
self.on_hover:trigger(self:get_context(), state)
|
||||
self.on_hover:trigger(self:get_context(), state, self)
|
||||
end
|
||||
end
|
||||
|
||||
@ -105,7 +107,7 @@ end
|
||||
function Hover.set_mouse_hover(self, state)
|
||||
if self._is_mouse_hovered ~= state then
|
||||
self._is_mouse_hovered = state
|
||||
self.on_mouse_hover:trigger(self:get_context(), state)
|
||||
self.on_mouse_hover:trigger(self:get_context(), state, self)
|
||||
end
|
||||
end
|
||||
|
||||
|
@ -2132,3 +2132,68 @@ embedded_instances {
|
||||
z: 1.0
|
||||
}
|
||||
}
|
||||
embedded_instances {
|
||||
id: "general_hover"
|
||||
data: "components {\n"
|
||||
" id: \"screen_factory\"\n"
|
||||
" component: \"/monarch/screen_factory.script\"\n"
|
||||
" position {\n"
|
||||
" x: 0.0\n"
|
||||
" y: 0.0\n"
|
||||
" z: 0.0\n"
|
||||
" }\n"
|
||||
" rotation {\n"
|
||||
" x: 0.0\n"
|
||||
" y: 0.0\n"
|
||||
" z: 0.0\n"
|
||||
" w: 1.0\n"
|
||||
" }\n"
|
||||
" properties {\n"
|
||||
" id: \"screen_id\"\n"
|
||||
" value: \"general_hover\"\n"
|
||||
" type: PROPERTY_TYPE_HASH\n"
|
||||
" }\n"
|
||||
" properties {\n"
|
||||
" id: \"popup\"\n"
|
||||
" value: \"true\"\n"
|
||||
" type: PROPERTY_TYPE_BOOLEAN\n"
|
||||
" }\n"
|
||||
" property_decls {\n"
|
||||
" }\n"
|
||||
"}\n"
|
||||
"embedded_components {\n"
|
||||
" id: \"collectionfactory\"\n"
|
||||
" type: \"collectionfactory\"\n"
|
||||
" data: \"prototype: \\\"/example/examples/general/hover/hover.collection\\\"\\n"
|
||||
"load_dynamically: false\\n"
|
||||
"\"\n"
|
||||
" position {\n"
|
||||
" x: 0.0\n"
|
||||
" y: 0.0\n"
|
||||
" z: 0.0\n"
|
||||
" }\n"
|
||||
" rotation {\n"
|
||||
" x: 0.0\n"
|
||||
" y: 0.0\n"
|
||||
" z: 0.0\n"
|
||||
" w: 1.0\n"
|
||||
" }\n"
|
||||
"}\n"
|
||||
""
|
||||
position {
|
||||
x: 0.0
|
||||
y: 0.0
|
||||
z: 0.0
|
||||
}
|
||||
rotation {
|
||||
x: 0.0
|
||||
y: 0.0
|
||||
z: 0.0
|
||||
w: 1.0
|
||||
}
|
||||
scale3 {
|
||||
x: 1.0
|
||||
y: 1.0
|
||||
z: 1.0
|
||||
}
|
||||
}
|
||||
|
@ -133,6 +133,7 @@ local function init_lobby(self)
|
||||
self.lobby_grid:add(get_button(self, "Checkboxes", "general_checkboxes", "/general/checkboxes/checkboxes.gui_script"))
|
||||
self.lobby_grid:add(get_button(self, "Input text", "general_input", "/general/input/input.gui_script"))
|
||||
self.lobby_grid:add(get_button(self, "Layout", "general_layout", "/general/layout/layout.gui_script"))
|
||||
self.lobby_grid:add(get_button(self, "Hover", "general_hover", "/general/hover/hover.gui_script"))
|
||||
self.lobby_grid:add(get_button(self, "Swipe", "general_swipe", "/general/swipe/swipe.gui_script"))
|
||||
self.lobby_grid:add(get_button(self, "Drag", "general_drag", "/general/drag/drag.gui_script"))
|
||||
self.lobby_grid:add(get_button(self, "Hotkey", "general_hotkey", "/general/hotkey/hotkey.gui_script"))
|
||||
|
39
example/examples/general/hover/hover.collection
Normal file
39
example/examples/general/hover/hover.collection
Normal file
@ -0,0 +1,39 @@
|
||||
name: "hover"
|
||||
scale_along_z: 0
|
||||
embedded_instances {
|
||||
id: "go"
|
||||
data: "components {\n"
|
||||
" id: \"hover\"\n"
|
||||
" component: \"/example/examples/general/hover/hover.gui\"\n"
|
||||
" position {\n"
|
||||
" x: 0.0\n"
|
||||
" y: 0.0\n"
|
||||
" z: 0.0\n"
|
||||
" }\n"
|
||||
" rotation {\n"
|
||||
" x: 0.0\n"
|
||||
" y: 0.0\n"
|
||||
" z: 0.0\n"
|
||||
" w: 1.0\n"
|
||||
" }\n"
|
||||
" property_decls {\n"
|
||||
" }\n"
|
||||
"}\n"
|
||||
""
|
||||
position {
|
||||
x: 0.0
|
||||
y: 0.0
|
||||
z: 0.0
|
||||
}
|
||||
rotation {
|
||||
x: 0.0
|
||||
y: 0.0
|
||||
z: 0.0
|
||||
w: 1.0
|
||||
}
|
||||
scale3 {
|
||||
x: 1.0
|
||||
y: 1.0
|
||||
z: 1.0
|
||||
}
|
||||
}
|
249
example/examples/general/hover/hover.gui
Normal file
249
example/examples/general/hover/hover.gui
Normal file
@ -0,0 +1,249 @@
|
||||
script: "/example/examples/general/hover/hover.gui_script"
|
||||
fonts {
|
||||
name: "game"
|
||||
font: "/example/assets/fonts/game.font"
|
||||
}
|
||||
textures {
|
||||
name: "kenney"
|
||||
texture: "/example/assets/images/kenney.atlas"
|
||||
}
|
||||
background_color {
|
||||
x: 0.0
|
||||
y: 0.0
|
||||
z: 0.0
|
||||
w: 0.0
|
||||
}
|
||||
nodes {
|
||||
position {
|
||||
x: 300.0
|
||||
y: 415.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: 600.0
|
||||
y: 830.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: "kenney/empty"
|
||||
id: "root"
|
||||
xanchor: XANCHOR_NONE
|
||||
yanchor: YANCHOR_NONE
|
||||
pivot: PIVOT_CENTER
|
||||
adjust_mode: ADJUST_MODE_FIT
|
||||
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
|
||||
}
|
||||
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: 200.0
|
||||
y: 100.0
|
||||
z: 0.0
|
||||
w: 1.0
|
||||
}
|
||||
color {
|
||||
x: 1.0
|
||||
y: 1.0
|
||||
z: 1.0
|
||||
w: 1.0
|
||||
}
|
||||
type: TYPE_TEMPLATE
|
||||
id: "hover_node"
|
||||
parent: "root"
|
||||
layer: ""
|
||||
inherit_alpha: true
|
||||
alpha: 1.0
|
||||
template: "/example/templates/button.gui"
|
||||
template_node_child: false
|
||||
custom_type: 0
|
||||
enabled: true
|
||||
}
|
||||
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: 200.0
|
||||
y: 80.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: "kenney/button_blue"
|
||||
id: "hover_node/button"
|
||||
xanchor: XANCHOR_NONE
|
||||
yanchor: YANCHOR_NONE
|
||||
pivot: PIVOT_CENTER
|
||||
adjust_mode: ADJUST_MODE_FIT
|
||||
parent: "hover_node"
|
||||
layer: "image"
|
||||
inherit_alpha: true
|
||||
slice9 {
|
||||
x: 15.0
|
||||
y: 15.0
|
||||
z: 15.0
|
||||
w: 15.0
|
||||
}
|
||||
clipping_mode: CLIPPING_MODE_NONE
|
||||
clipping_visible: true
|
||||
clipping_inverted: false
|
||||
alpha: 1.0
|
||||
overridden_fields: 4
|
||||
template_node_child: true
|
||||
size_mode: SIZE_MODE_MANUAL
|
||||
custom_type: 0
|
||||
enabled: true
|
||||
visible: true
|
||||
}
|
||||
nodes {
|
||||
position {
|
||||
x: 0.0
|
||||
y: 7.0
|
||||
z: 0.0
|
||||
w: 1.0
|
||||
}
|
||||
rotation {
|
||||
x: 0.0
|
||||
y: 0.0
|
||||
z: 0.0
|
||||
w: 1.0
|
||||
}
|
||||
scale {
|
||||
x: 0.7
|
||||
y: 0.7
|
||||
z: 1.0
|
||||
w: 1.0
|
||||
}
|
||||
size {
|
||||
x: 200.0
|
||||
y: 100.0
|
||||
z: 0.0
|
||||
w: 1.0
|
||||
}
|
||||
color {
|
||||
x: 1.0
|
||||
y: 1.0
|
||||
z: 1.0
|
||||
w: 1.0
|
||||
}
|
||||
type: TYPE_TEXT
|
||||
blend_mode: BLEND_MODE_ALPHA
|
||||
text: "Hover me!"
|
||||
font: "game"
|
||||
id: "hover_node/text"
|
||||
xanchor: XANCHOR_NONE
|
||||
yanchor: YANCHOR_NONE
|
||||
pivot: PIVOT_CENTER
|
||||
outline {
|
||||
x: 1.0
|
||||
y: 1.0
|
||||
z: 1.0
|
||||
w: 1.0
|
||||
}
|
||||
shadow {
|
||||
x: 0.101960786
|
||||
y: 0.2
|
||||
z: 0.6
|
||||
w: 1.0
|
||||
}
|
||||
adjust_mode: ADJUST_MODE_FIT
|
||||
line_break: false
|
||||
parent: "hover_node/button"
|
||||
layer: "text"
|
||||
inherit_alpha: true
|
||||
alpha: 1.0
|
||||
outline_alpha: 0.0
|
||||
shadow_alpha: 0.78
|
||||
overridden_fields: 8
|
||||
template_node_child: true
|
||||
text_leading: 1.0
|
||||
text_tracking: 0.0
|
||||
custom_type: 0
|
||||
enabled: true
|
||||
visible: true
|
||||
}
|
||||
layers {
|
||||
name: "image"
|
||||
}
|
||||
layers {
|
||||
name: "text"
|
||||
}
|
||||
material: "/builtins/materials/gui.material"
|
||||
adjust_reference: ADJUST_REFERENCE_PARENT
|
||||
max_nodes: 512
|
41
example/examples/general/hover/hover.gui_script
Normal file
41
example/examples/general/hover/hover.gui_script
Normal file
@ -0,0 +1,41 @@
|
||||
local druid = require("druid.druid")
|
||||
|
||||
|
||||
function init(self)
|
||||
self.druid = druid.new(self)
|
||||
|
||||
local hover = self.druid:new_hover("hover_node/button")
|
||||
|
||||
-- Usual hover respect to touch action on mobiles. On desktop we will use mouse hover
|
||||
hover.on_mouse_hover:subscribe(function(_, is_hover, hover_instance)
|
||||
print("is hover", is_hover)
|
||||
local node = hover_instance.node
|
||||
gui.animate(node, gui.PROP_SCALE, is_hover and vmath.vector3(1.2) or vmath.vector3(1), gui.EASING_OUTSINE, 0.2)
|
||||
end)
|
||||
|
||||
local button = self.druid:new_button("hover_node/button", function()
|
||||
print("Button clicked")
|
||||
end)
|
||||
-- Remove all animations from button, including button hover animations
|
||||
button:set_style()
|
||||
end
|
||||
|
||||
|
||||
function final(self)
|
||||
self.druid:final()
|
||||
end
|
||||
|
||||
|
||||
function update(self, dt)
|
||||
self.druid:update(dt)
|
||||
end
|
||||
|
||||
|
||||
function on_message(self, message_id, message, sender)
|
||||
self.druid:on_message(message_id, message, sender)
|
||||
end
|
||||
|
||||
|
||||
function on_input(self, action_id, action)
|
||||
return self.druid:on_input(action_id, action)
|
||||
end
|
Loading…
x
Reference in New Issue
Block a user