#131 Add dynamic_poses for static grid

docs_md/changelog.md

@@ -149,6 +149,7 @@ And I should note here are several breaking changes, take a look in changelogs.
 Wanna something more? [Add an issues!](https://github.com/Insality/druid/issues)
 Have a good day.
 
+
 **Changelog 0.6.0**
 ---
 
@@ -202,3 +203,11 @@ Have a good day.
 	- This is basic implementation, it is work not perfect
 - **#124** Add `Scroll:set_click_zone` function. This is just link to `Drag:set_click_zone` function inside scroll component.
 - **#127** The `druid:create` is deprecated. Use `druid:new` for creating custom components
+
+
+**Changelog 0.7.0**
+---
+
+- **#131** [Static Grid] Add style param: IS_DYNAMIC_NODE_POSES (default: false). Always align by content size with node anchor.
+	- If true - Static Grid will by always align to content anchor.
+	- If false (currently behaviour) - all poses for static grid is predefined and not depends on element's count (see example: static grid and static grid with dynamic poses)

druid/base/static_grid.lua

@@ -63,6 +63,17 @@ local function _extend_border(border, pos, size, pivot)
 end
 
 
+--- Component style params.
+-- You can override this component styles params in druid styles table
+-- or create your own style
+-- @table style
+-- @tfield[opt=false] bool IS_DYNAMIC_NODE_POSES If true, always center grid content as grid pivot sets
+function StaticGrid.on_style_change(self, style)
+	self.style = {}
+	self.style.IS_DYNAMIC_NODE_POSES = style.IS_DYNAMIC_NODE_POSES or false
+end
+
+
 --- Component init function
 -- @tparam StaticGrid self
 -- @tparam node parent The gui node parent, where items will be placed
@@ -191,7 +202,7 @@ function StaticGrid.add(self, item, index, shift_policy)
 	self:_update_indexes()
 	self:_update_borders()
 
-	gui.set_position(item, self:get_pos(index))
+	gui.set_position(item, self:get_pos(index) + self:_get_zero_offset())
 
 	self:_update_pos()
 
@@ -385,8 +396,12 @@ end
 -- @tparam bool is_instant If true, node position update instantly, otherwise with set_position_function callback
 -- @local
 function StaticGrid._update_pos(self, is_instant)
+	local zero_offset = self:_get_zero_offset()
+
 	for i, node in pairs(self.nodes) do
 		local pos = self:get_pos(i)
+		pos.x = pos.x + zero_offset.x
+		pos.y = pos.y + zero_offset.y
 
 		if is_instant then
 			gui.set_position(node, pos)
@@ -399,4 +414,23 @@ function StaticGrid._update_pos(self, is_instant)
 end
 
 
+--- Return elements offset for correct posing nodes. Correct posing at
+-- parent pivot node (0:0) with adjusting of node sizes and anchoring
+-- @function static_grid:_get_zero_offset
+-- @treturn vector3 The offset vector
+-- @local
+function StaticGrid:_get_zero_offset()
+	if not self.style.IS_DYNAMIC_NODE_POSES then
+		return const.VECTOR_ZERO
+	end
+
+	-- zero offset: center pos - border size * anchor
+	return vmath.vector3(
+		-((self.border.x + self.border.z)/2 + (self.border.z - self.border.x) * self.pivot.x),
+		-((self.border.y + self.border.w)/2 + (self.border.y - self.border.w) * self.pivot.y),
+		0
+	)
+end
+
+
 return StaticGrid

druid/const.lua

@@ -54,7 +54,8 @@ M.PIVOTS = {
 	[gui.PIVOT_NW] = vmath.vector3(-0.5, 0.5, 0),
 }
 
-
+M.VECTOR_ZERO = vmath.vector3(0)
+M.VECTOR_ONE = vmath.vector3(1)
 M.SYS_INFO = sys.get_sys_info()
 M.CURRENT_SYSTEM_NAME = M.SYS_INFO.system_name
 

druid/styles/default/style.lua

@@ -56,6 +56,11 @@ M["drag"] = {
 }
 
 
+M["static_grid"] = {
+	IS_DYNAMIC_NODE_POSES = false, -- Always align by content size with node anchor
+}
+
+
 M["scroll"] = {
 	ANIM_SPEED = 0.2, -- gui.animation speed to point
 	BACK_SPEED = 0.35, -- Lerp speed of return to soft position

example/example.collection

@@ -869,6 +869,69 @@ embedded_instances {
     z: 1.0
   }
 }
+embedded_instances {
+  id: "grid_static_grid"
+  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: \"grid_static_grid\"\n"
+  "    type: PROPERTY_TYPE_HASH\n"
+  "  }\n"
+  "  properties {\n"
+  "    id: \"popup\"\n"
+  "    value: \"true\"\n"
+  "    type: PROPERTY_TYPE_BOOLEAN\n"
+  "  }\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"collectionfactory\"\n"
+  "  type: \"collectionfactory\"\n"
+  "  data: \"prototype: \\\"/example/examples/grid/static_grid/static_grid.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
+  }
+}
 embedded_instances {
   id: "grid_animations"
   data: "components {\n"
@@ -932,3 +995,66 @@ embedded_instances {
     z: 1.0
   }
 }
+embedded_instances {
+  id: "grid_static_grid_dynamic_pos"
+  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: \"grid_static_grid_dynamic_pos\"\n"
+  "    type: PROPERTY_TYPE_HASH\n"
+  "  }\n"
+  "  properties {\n"
+  "    id: \"popup\"\n"
+  "    value: \"true\"\n"
+  "    type: PROPERTY_TYPE_BOOLEAN\n"
+  "  }\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"collectionfactory\"\n"
+  "  type: \"collectionfactory\"\n"
+  "  data: \"prototype: \\\"/example/examples/grid/static_grid_dynamic_pos/static_grid_dynamic_pos.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
+  }
+}

example/example.gui_script

@@ -116,7 +116,8 @@ local function init_lobby(self)
 	self.lobby_grid:add(get_button_disabled(self, "Without inertion", "scroll_scene"))
 
 	self.lobby_grid:add(get_title(self, "Grids"))
-	self.lobby_grid:add(get_button_disabled(self, "Static grid", "scroll_scene"))
+	self.lobby_grid:add(get_button(self, "Static grid", "grid_static_grid"))
+	self.lobby_grid:add(get_button(self, "Static with dynamic pos", "grid_static_grid_dynamic_pos"))
 	self.lobby_grid:add(get_button_disabled(self, "Dynamic grid", "scroll_scene"))
 	self.lobby_grid:add(get_button_disabled(self, "Scroll binding", "scroll_scene"))
 	self.lobby_grid:add(get_button(self, "Add/Remove animations", "grid_animations"))

example/examples/grid/static_grid/static_grid.collection

@@ -0,0 +1,37 @@
+name: "static_grid"
+scale_along_z: 0
+embedded_instances {
+  id: "go"
+  data: "components {\n"
+  "  id: \"static_grid\"\n"
+  "  component: \"/example/examples/grid/static_grid/static_grid.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"
+  "}\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
+  }
+}