add layers example (#42)

examples/_main/loader.go

@@ -1162,3 +1162,21 @@ embedded_components {
     w: 1.0
   }
 }
+embedded_components {
+  id: "gui/layouts"
+  type: "collectionproxy"
+  data: "collection: \"/examples/gui/layouts/layouts.collection\"\n"
+  "exclude: false\n"
+  ""
+  position {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+  }
+  rotation {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+}

examples/_main/menu.gui_script

@@ -70,7 +70,7 @@ local function show_categories(self)
 
 	for i, cat in ipairs(self.categories) do
 		gui.set_enabled(cat.node, true)
-		gui.set_position(cat.node, cat.pos)		
+		gui.set_position(cat.node, cat.pos)
 	end
 end
 
@@ -93,7 +93,7 @@ local function show_category(self, category)
 			pos.x = pos.x + cat.size.x / 2 + 20
 			gui.animate(cat.node, "position", pos, gui.EASING_INOUTQUAD, 0.3, 0, cat_expand)
 		else
-			gui.set_enabled(cat.node, false)			
+			gui.set_enabled(cat.node, false)
 		end
 	end	
 end
@@ -105,7 +105,7 @@ function init(self)
 	self.index["movement"] = { "simple_move", "follow", "move_to", "move_forward", "movement_speed", "look_at" }
 	self.index["physics"] = { "dynamic", "kinematic", "raycast", "trigger", "hinge_joint", "pendulum", "knockback"}
 	self.index["animation"] = { "spinner", "flipbook", "chained_tween", "basic_tween", "spine", "cursor", "easing" }
-	self.index["gui"] = { "button", "stencil", "load_texture", "progress", "pointer_over", "color", "slice9", "drag" }
+	self.index["gui"] = { "button", "stencil", "load_texture", "progress", "pointer_over", "color", "slice9", "drag", "layouts" }
 	self.index["input"] = { "move", "text", "down_duration", "mouse_and_touch" }
 	self.index["material"] = { "vertexcolor" }
 	self.index["particles"] = { "particlefx", "modifiers", "fire_and_smoke" }

examples/gui/layouts/change_canvas/change_resolution.go

@@ -0,0 +1,68 @@
+components {
+  id: "change_resolution"
+  component: "/examples/gui/layouts/change_canvas/change_resolution.script"
+  position {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+  }
+  rotation {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+}
+embedded_components {
+  id: "label"
+  type: "label"
+  data: "size {\n"
+  "  x: 800.0\n"
+  "  y: 120.0\n"
+  "  z: 0.0\n"
+  "  w: 0.0\n"
+  "}\n"
+  "color {\n"
+  "  x: 0.0\n"
+  "  y: 0.0\n"
+  "  z: 0.0\n"
+  "  w: 1.0\n"
+  "}\n"
+  "outline {\n"
+  "  x: 0.0\n"
+  "  y: 0.0\n"
+  "  z: 0.0\n"
+  "  w: 1.0\n"
+  "}\n"
+  "shadow {\n"
+  "  x: 0.0\n"
+  "  y: 0.0\n"
+  "  z: 0.0\n"
+  "  w: 1.0\n"
+  "}\n"
+  "leading: 1.0\n"
+  "tracking: 0.0\n"
+  "pivot: PIVOT_CENTER\n"
+  "blend_mode: BLEND_MODE_ALPHA\n"
+  "line_break: false\n"
+  "text: \"Click me to change layout\"\n"
+  "font: \"/assets/text64.font\"\n"
+  "material: \"/builtins/fonts/label.material\"\n"
+  ""
+  position {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+  }
+  rotation {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+  scale {
+    x: 0.9
+    y: 0.9
+    z: 1.0
+  }
+}

examples/gui/layouts/change_canvas/change_resolution.script

@@ -0,0 +1,23 @@
+local init_width, init_height = 0, 0
+
+function init(self)
+	msg.post(".", "acquire_input_focus")
+	init_width, init_height = window.get_size()
+	self.curr_width, self.curr_height = init_width, init_height
+
+
+	timer.delay(1, true, function()
+		msg.post("/go#layoutsui", "update_score", {score = math.random(1, 3)})
+	end)
+end
+
+function on_input(self, action_id, action)
+	if action_id == hash("touch") and action.released then
+		if self.curr_width == init_width then
+			self.curr_width = self.curr_width + 20
+		else
+			self.curr_width = init_width
+		end
+		msg.post("@render:", "resize", { width = self.curr_width, height = self.curr_height } )
+	end
+end

examples/gui/layouts/layouts.collection

@@ -0,0 +1,59 @@
+name: "slice"
+instances {
+  id: "change_resolution"
+  prototype: "/examples/gui/layouts/change_canvas/change_resolution.go"
+  position {
+    x: 360.0
+    y: 359.0
+    z: 0.0
+  }
+  rotation {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+  scale3 {
+    x: 0.8
+    y: 0.8
+    z: 1.0
+  }
+}
+scale_along_z: 0
+embedded_instances {
+  id: "go"
+  data: "components {\n"
+  "  id: \"layoutsui\"\n"
+  "  component: \"/examples/gui/layouts/layouts.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
+  }
+}