Update navigate example

This commit is contained in:
Insality 2021-04-05 21:57:54 +03:00
parent b3e7f63e64
commit 4f621274c1
6 changed files with 881 additions and 20 deletions

View File

@ -105,7 +105,7 @@ nodes {
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
adjust_mode: ADJUST_MODE_STRETCH
parent: "root"
layer: "image"
inherit_alpha: true
@ -160,7 +160,7 @@ nodes {
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
adjust_mode: ADJUST_MODE_STRETCH
parent: "C_Anchor"
layer: ""
inherit_alpha: true
@ -215,7 +215,7 @@ nodes {
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_N
adjust_mode: ADJUST_MODE_FIT
adjust_mode: ADJUST_MODE_STRETCH
parent: "lobby"
layer: ""
inherit_alpha: true
@ -270,7 +270,7 @@ nodes {
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_N
adjust_mode: ADJUST_MODE_FIT
adjust_mode: ADJUST_MODE_STRETCH
parent: "lobby_view"
layer: ""
inherit_alpha: true

View File

@ -118,7 +118,7 @@ local function init_lobby(self)
self.lobby_grid:add(get_button(self, "With static grid", "data_list_static_grid"))
self.lobby_grid:add(get_button(self, "With dynamic grid", "data_list_dynamic_grid"))
self.lobby_grid:add(get_button_disabled(self, "Add/remove elements", "scroll_scene"))
self.lobby_grid:add(get_button_disabled(self, "Navigate over elements", "data_list_navigate"))
self.lobby_grid:add(get_button(self, "Navigate over elements", "data_list_navigate"))
self.lobby_grid:add(get_title(self, "System"))
self.lobby_grid:add(get_button_disabled(self, "Styles"))

View File

@ -70,7 +70,7 @@ nodes {
nodes {
position {
x: 0.0
y: 0.0
y: 387.0
z: 0.0
w: 1.0
}
@ -81,14 +81,14 @@ nodes {
w: 1.0
}
scale {
x: 1.0
y: 1.0
x: 0.75
y: 0.75
z: 1.0
w: 1.0
}
size {
x: 200.0
y: 100.0
x: 700.0
y: 60.0
z: 0.0
w: 1.0
}
@ -100,9 +100,9 @@ nodes {
}
type: TYPE_TEXT
blend_mode: BLEND_MODE_ALPHA
text: "Hello!"
text: "Simple navigate, static grid"
font: "game"
id: "text_hint"
id: "text_hint_horizontal"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
@ -130,6 +130,827 @@ nodes {
text_leading: 1.0
text_tracking: 0.0
}
nodes {
position {
x: -2.0
y: 280.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: 100.0
z: 0.0
w: 1.0
}
color {
x: 0.8
y: 1.0
z: 1.0
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "data_list_simple"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_N
adjust_mode: ADJUST_MODE_FIT
parent: "root"
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_STENCIL
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: -200.0
y: -50.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: 100.0
z: 0.0
w: 1.0
}
color {
x: 0.8
y: 1.0
z: 0.8
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "data_list_simple_content"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_W
adjust_mode: ADJUST_MODE_FIT
parent: "data_list_simple"
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
}
nodes {
position {
x: 450.0
y: 300.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: 90.0
y: 70.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: "prefab_square"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "root"
layer: "image"
inherit_alpha: true
slice9 {
x: 20.0
y: 0.0
z: 20.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
}
nodes {
position {
x: 0.0
y: 4.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 0.75
y: 0.75
z: 1.0
w: 1.0
}
size {
x: 70.0
y: 50.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: "001"
font: "game"
id: "text_square"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
outline {
x: 0.3019608
y: 0.4
z: 0.8
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: "prefab_square"
layer: "text"
inherit_alpha: true
alpha: 1.0
outline_alpha: 1.0
shadow_alpha: 0.0
template_node_child: false
text_leading: 1.0
text_tracking: 0.0
}
nodes {
position {
x: -110.0
y: 320.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: "button_simple_first"
parent: "root"
layer: ""
inherit_alpha: true
alpha: 1.0
template: "/example/templates/button.gui"
template_node_child: false
}
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: 90.0
y: 60.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: "button_simple_first/button"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "button_simple_first"
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
}
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: 100.0
y: 50.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: "First"
font: "game"
id: "button_simple_first/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: "button_simple_first/button"
layer: "text"
inherit_alpha: true
alpha: 1.0
outline_alpha: 0.0
shadow_alpha: 0.78
overridden_fields: 4
overridden_fields: 8
template_node_child: true
text_leading: 1.0
text_tracking: 0.0
}
nodes {
position {
x: 0.0
y: 320.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: "button_simple_hundred"
parent: "root"
layer: ""
inherit_alpha: true
alpha: 1.0
template: "/example/templates/button.gui"
template_node_child: false
}
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: 90.0
y: 60.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: "button_simple_hundred/button"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "button_simple_hundred"
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
}
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: 5.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: "100"
font: "game"
id: "button_simple_hundred/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: "button_simple_hundred/button"
layer: "text"
inherit_alpha: true
alpha: 1.0
outline_alpha: 0.0
shadow_alpha: 0.78
overridden_fields: 4
overridden_fields: 8
template_node_child: true
text_leading: 1.0
text_tracking: 0.0
}
nodes {
position {
x: 110.0
y: 320.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: "button_simple_last"
parent: "root"
layer: ""
inherit_alpha: true
alpha: 1.0
template: "/example/templates/button.gui"
template_node_child: false
}
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: 90.0
y: 60.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: "button_simple_last/button"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "button_simple_last"
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
}
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: 100.0
y: 50.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: "Last"
font: "game"
id: "button_simple_last/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: "button_simple_last/button"
layer: "text"
inherit_alpha: true
alpha: 1.0
outline_alpha: 0.0
shadow_alpha: 0.78
overridden_fields: 4
overridden_fields: 8
template_node_child: true
text_leading: 1.0
text_tracking: 0.0
}
nodes {
position {
x: 0.0
y: 164.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: 4.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/slider_back"
id: "scroll_slider"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "root"
layer: "image"
inherit_alpha: true
slice9 {
x: 10.0
y: 0.0
z: 10.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
}
nodes {
position {
x: -200.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.7
y: 0.7
z: 1.0
w: 1.0
}
size {
x: 36.0
y: 36.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/slider_move"
id: "grid_scroll_pin"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "scroll_slider"
layer: "image"
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_AUTO
}
layers {
name: "image"
}

View File

@ -1,7 +1,51 @@
local druid = require("druid.druid")
local function create_simple_element(self, data, index, data_list)
-- Here we will create elements without druid components, just nodes
local instance = gui.clone_tree(self.prefab_square)
gui.set_enabled(instance["prefab_square"], true)
gui.set_text(instance["text_square"], data)
return instance["prefab_square"]
end
function init(self)
self.druid = druid.new(self)
self.data_set = {}
for i = 1, 999 do
table.insert(self.data_set, i)
end
self.prefab_square = gui.get_node("prefab_square")
gui.set_enabled(self.prefab_square, false)
local scroll_simple = self.druid:new_scroll("data_list_simple", "data_list_simple_content")
:set_vertical_scroll(false)
--- The 999999 number in row - is kind of hack for single line static grid
local grid_simple = self.druid:new_static_grid("data_list_simple_content", "prefab_square", 999999)
self.data_list_simple = self.druid:new_data_list(scroll_simple, grid_simple, create_simple_element)
self.data_list_simple:set_data(self.data_set)
self.slider_simple = self.druid:new_slider("grid_scroll_pin", vmath.vector3(200, 0, 0))
-- Disable slider input, now we can not use slider with data list
self.slider_simple:set_input_enabled(false)
self.data_list_simple.on_scroll_progress_change:subscribe(function(_, progress)
self.slider_simple:set(progress)
end)
self.druid:new_button("button_simple_first/button", function()
self.data_list_simple:scroll_to_index(1)
end)
self.druid:new_button("button_simple_hundred/button", function()
self.data_list_simple:scroll_to_index(100)
end)
self.druid:new_button("button_simple_last/button", function()
self.data_list_simple:scroll_to_index(#self.data_set)
end)
end

View File

@ -273,7 +273,8 @@ nodes {
}
type: TYPE_TEXT
blend_mode: BLEND_MODE_ALPHA
text: "Data List with horizontal Static Grid:"
text: "Data List with horizontal Static Grid,\n"
"without buttons:"
font: "game"
id: "text_hint_horizontal"
xanchor: XANCHOR_NONE

View File

@ -19,16 +19,11 @@ end
local function create_horizontal_element(self, data, index, data_list)
-- Here we will create elements without druid components, just nodes
local instance = gui.clone_tree(self.prefab_square)
gui.set_enabled(instance["prefab_square"], true)
gui.set_text(instance["text_square"], data)
local button = self.druid:new_button(instance["prefab_square"], function()
print("Data list element click on", data)
end)
button:set_click_zone(data_list.scroll.view_node)
return instance["prefab_square"], button
return instance["prefab_square"]
end