소스 검색

Added repeating timer example. The example shows how to use the built-in timer API to create a 60s counter.

Pawel Jarosz 2 년 전
부모
커밋
256214ad94

+ 39 - 0
examples/timer/repeating_timer/repeating_timer.collection

@@ -0,0 +1,39 @@
+name: "progress"
+scale_along_z: 0
+embedded_instances {
+  id: "go"
+  data: "components {\n"
+  "  id: \"progress\"\n"
+  "  component: \"/examples/timer/repeating_timer/repeating_timer.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
+  }
+}

+ 134 - 0
examples/timer/repeating_timer/repeating_timer.gui

@@ -0,0 +1,134 @@
+script: "/examples/timer/repeating_timer/repeating_timer.gui_script"
+fonts {
+  name: "text24"
+  font: "/assets/text24.font"
+}
+background_color {
+  x: 0.0
+  y: 0.0
+  z: 0.0
+  w: 0.0
+}
+nodes {
+  position {
+    x: 363.0
+    y: 400.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: 100.0
+    y: 40.0
+    z: 0.0
+    w: 1.0
+  }
+  color {
+    x: 0.101960786
+    y: 0.101960786
+    z: 0.101960786
+    w: 1.0
+  }
+  type: TYPE_TEXT
+  blend_mode: BLEND_MODE_ALPHA
+  text: "0s"
+  font: "text24"
+  id: "numeric"
+  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
+  layer: ""
+  inherit_alpha: true
+  alpha: 1.0
+  outline_alpha: 0.0
+  shadow_alpha: 0.0
+  template_node_child: false
+  text_leading: 1.0
+  text_tracking: 0.0
+  custom_type: 0
+  enabled: true
+  visible: true
+}
+nodes {
+  position {
+    x: 360.0
+    y: 400.0
+    z: 0.0
+    w: 1.0
+  }
+  rotation {
+    x: 0.0
+    y: 180.0
+    z: 90.0
+    w: 1.0
+  }
+  scale {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+    w: 1.0
+  }
+  size {
+    x: 200.0
+    y: 200.0
+    z: 0.0
+    w: 1.0
+  }
+  color {
+    x: 0.0
+    y: 1.0
+    z: 0.0
+    w: 1.0
+  }
+  type: TYPE_PIE
+  blend_mode: BLEND_MODE_ALPHA
+  texture: ""
+  id: "radial"
+  xanchor: XANCHOR_NONE
+  yanchor: YANCHOR_NONE
+  pivot: PIVOT_CENTER
+  adjust_mode: ADJUST_MODE_FIT
+  layer: ""
+  inherit_alpha: true
+  outerBounds: PIEBOUNDS_ELLIPSE
+  innerRadius: 90.0
+  perimeterVertices: 120
+  pieFillAngle: 360.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
+}
+material: "/builtins/materials/gui.material"
+adjust_reference: ADJUST_REFERENCE_PARENT
+max_nodes: 512

+ 30 - 0
examples/timer/repeating_timer/repeating_timer.gui_script

@@ -0,0 +1,30 @@
+-- set value of numeric time indicator (in percent from 0 to 60s)
+local function update_numeric(p)
+	local node = gui.get_node("numeric")
+	local percent = math.floor(p)
+	gui.set_text(node, tostring(percent) .. "s")
+end
+
+-- update radial/circle time indicator by changing the fill angle
+local function update_radial(p)
+	local node = gui.get_node("radial")
+	local angle = p * 6
+	gui.set_fill_angle(node, angle)
+end
+
+function init(self)
+	self.time = 0
+
+	-- create a timer delay with 1s interval, repeating
+	local interval = 1
+	local repeating = true
+	timer.delay(interval, repeating, function()
+		-- each second this function will be called
+		self.time = self.time + 1
+		-- take modulo out of time elapsed from the beginning for 60s periods:
+		local p = self.time % 60
+
+		update_numeric(p)
+		update_radial(p)
+	end)
+end

+ 12 - 0
examples/timer/repeating_timer/repeating_timer.md

@@ -0,0 +1,12 @@
+---
+title: Repeating timer example
+brief: This example shows how to create timer that repeats endlessly every second
+scripts: repeating_timer.gui_script
+---
+
+The example shows how to use Defold built-in timer and uses two indicators:
+
+1. A numerical time text with seconds counter created using a text node
+2. A circular time indicator created using a pie node
+
+![repeating_timer](repeating_timer.png)

BIN
examples/timer/repeating_timer/repeating_timer.png