Update data list examples

example/examples/data_list/dynamic_grid/dynamic_grid.gui

@@ -70,7 +70,7 @@ nodes {
 nodes {
   position {
     x: 0.0
-    y: 0.0
+    y: 380.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: "Data List with vertical Dynamic Grid:"
   font: "game"
-  id: "text_hint"
+  id: "text_hint_vertical"
   xanchor: XANCHOR_NONE
   yanchor: YANCHOR_NONE
   pivot: PIVOT_CENTER
@@ -130,6 +130,407 @@ nodes {
   text_leading: 1.0
   text_tracking: 0.0
 }
+nodes {
+  position {
+    x: 0.0
+    y: 350.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: 250.0
+    y: 450.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_vertical"
+  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: 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: 250.0
+    y: 450.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: "kenney/empty"
+  id: "data_list_vertical_content"
+  xanchor: XANCHOR_NONE
+  yanchor: YANCHOR_NONE
+  pivot: PIVOT_N
+  adjust_mode: ADJUST_MODE_FIT
+  parent: "data_list_vertical"
+  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: 0.0
+    y: -162.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: 700.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_TEXT
+  blend_mode: BLEND_MODE_ALPHA
+  text: "Data List with horizontal Dynamic Grid:"
+  font: "game"
+  id: "text_hint_horizontal"
+  xanchor: XANCHOR_NONE
+  yanchor: YANCHOR_NONE
+  pivot: PIVOT_CENTER
+  outline {
+    x: 0.0
+    y: 0.0
+    z: 0.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: 1.0
+  shadow_alpha: 0.0
+  template_node_child: false
+  text_leading: 1.0
+  text_tracking: 0.0
+}
+nodes {
+  position {
+    x: 0.0
+    y: -200.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: 120.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_horizontal"
+  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: -300.0
+    y: -60.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: 120.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: "kenney/empty"
+  id: "data_list_horizontal_content"
+  xanchor: XANCHOR_NONE
+  yanchor: YANCHOR_NONE
+  pivot: PIVOT_W
+  adjust_mode: ADJUST_MODE_FIT
+  parent: "data_list_horizontal"
+  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: 636.0
+    y: -78.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: 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: "prefab"
+  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: 10.0
+    z: 20.0
+    w: 20.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: 200.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: "Record 1"
+  font: "game"
+  id: "text"
+  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"
+  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
+}
 layers {
   name: "image"
 }

example/examples/data_list/dynamic_grid/dynamic_grid.gui_script

@@ -1,7 +1,77 @@
 local druid = require("druid.druid")
 
+
+local buttons = {
+	"button_blue",
+	"button_red",
+	"button_green",
+	"button_yellow",
+}
+
+
+local function create_vertical(self, data, index, data_list)
+	local instance = gui.clone_tree(self.prefab)
+	gui.set_enabled(instance["prefab"], true)
+	gui.set_text(instance["text"], "Record " .. data)
+
+	gui.set_size(instance["prefab"], vmath.vector3(200, 50 + math.random(100), 0))
+	gui.play_flipbook(instance["prefab"], buttons[math.random(#buttons)])
+
+	-- Since we have only 1 component, we can return this one
+	-- If we have several components, we should create custom component to
+	-- union them all
+	local button = self.druid:new_button(instance["prefab"], function()
+		print("Data list element click on", data)
+	end)
+	button:set_click_zone(data_list.scroll.view_node)
+
+	return instance["prefab"], button
+end
+
+
+local function create_horizontal(self, data, index, data_list)
+	local instance = gui.clone_tree(self.prefab)
+	gui.set_enabled(instance["prefab"], true)
+	gui.set_text(instance["text"], "N. " .. data)
+
+	gui.set_size(instance["prefab"], vmath.vector3(120 + math.random(100), 80, 0))
+	gui.play_flipbook(instance["prefab"], buttons[math.random(#buttons)])
+
+	local button = self.druid:new_button(instance["prefab"], function()
+		print("Data list element click on", data)
+	end)
+	button:set_click_zone(data_list.scroll.view_node)
+
+	return instance["prefab"], button
+end
+
+
 function init(self)
 	self.druid = druid.new(self)
+
+	self.data_set = {}
+	for i = 1, 9999 do
+		table.insert(self.data_set, i)
+	end
+
+	self.prefab = gui.get_node("prefab")
+	gui.set_enabled(self.prefab, false)
+
+
+	local scroll_vertical = self.druid:new_scroll("data_list_vertical", "data_list_vertical_content")
+		:set_horizontal_scroll(false)
+	local grid_vertical = self.druid:new_dynamic_grid("data_list_vertical_content")
+
+	self.data_list_vertical = self.druid:new_data_list(scroll_vertical, grid_vertical, create_vertical)
+	self.data_list_vertical:set_data(self.data_set)
+
+
+	local scroll_horizontal = self.druid:new_scroll("data_list_horizontal", "data_list_horizontal_content")
+		:set_vertical_scroll(false)
+	local grid_horizontal = self.druid:new_dynamic_grid("data_list_horizontal_content")
+
+	self.data_list_horizontal = self.druid:new_data_list(scroll_horizontal, grid_horizontal, create_horizontal)
+	self.data_list_horizontal:set_data(self.data_set)
 end
 
 

example/examples/data_list/static_grid/static_grid.gui_script

@@ -1,7 +1,7 @@
 local druid = require("druid.druid")
 
 
-local function create_vertical_element(self, data, index)
+local function create_vertical_element(self, data, index, data_list)
 	local instance = gui.clone_tree(self.prefab)
 	gui.set_enabled(instance["prefab"], true)
 	gui.set_text(instance["text"], "Record " .. data)
@@ -12,12 +12,13 @@ local function create_vertical_element(self, data, index)
 	local button = self.druid:new_button(instance["prefab"], function()
 		print("Data list element click on", data)
 	end)
+	button:set_click_zone(data_list.scroll.view_node)
 
 	return instance["prefab"], button
 end
 
 
-local function create_horizontal_element(self, data, index)
+local function create_horizontal_element(self, data, index, data_list)
 	local instance = gui.clone_tree(self.prefab_square)
 	gui.set_enabled(instance["prefab_square"], true)
 	gui.set_text(instance["text_square"], data)
@@ -25,12 +26,13 @@ local function create_horizontal_element(self, data, index)
 	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
 end
 
 
-local function create_matrix_element(self, data, index)
+local function create_matrix_element(self, data, index, data_list)
 	local instance = gui.clone_tree(self.prefab_square)
 	gui.set_enabled(instance["prefab_square"], true)
 	gui.set_text(instance["text_square"], data)
@@ -38,6 +40,7 @@ local function create_matrix_element(self, data, index)
 	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
 end
@@ -65,7 +68,7 @@ function init(self)
 
 	-- We pass already created scroll and grid components with create function
 	self.data_list_vertical = self.druid:new_data_list(scroll_vertical, grid_vertical, create_vertical_element)
-		:set_data(self.data_set)
+	self.data_list_vertical:set_data(self.data_set)
 
 
 	local scroll_horizontal = self.druid:new_scroll("data_list_horizontal", "data_list_horizontal_content")
@@ -73,7 +76,7 @@ function init(self)
 	local grid_horizontal = self.druid:new_static_grid("data_list_horizontal_content", "prefab_square", 999)
 
 	self.data_list_horizontal = self.druid:new_data_list(scroll_horizontal, grid_horizontal, create_horizontal_element)
-		:set_data(self.data_set)
+	self.data_list_horizontal:set_data(self.data_set)
 
 
 	local scroll_matrix = self.druid:new_scroll("data_list_matrix_vertical", "data_list_matrix_vertical_content")
@@ -81,7 +84,7 @@ function init(self)
 	local grid_matrix = self.druid:new_static_grid("data_list_matrix_vertical_content", "prefab_square", 3)
 
 	self.data_list_matrix = self.druid:new_data_list(scroll_matrix, grid_matrix, create_matrix_element)
-		:set_data(self.data_set)
+	self.data_list_matrix:set_data(self.data_set)
 end