Added a progress bar example

all.texture_profiles

@@ -0,0 +1,18 @@
+path_settings {
+  path: "**"
+  profile: "Default"
+}
+profiles {
+  name: "Default"
+  platforms {
+    os: OS_ID_GENERIC
+    formats {
+      format: TEXTURE_FORMAT_RGBA
+      compression_level: BEST
+      compression_type: COMPRESSION_TYPE_DEFAULT
+    }
+    mipmaps: false
+    max_texture_size: 0
+    premultiply_alpha: true
+  }
+}

assets/sprites.atlas

@@ -62,6 +62,10 @@ images {
   image: "/assets/images/hitman1_machine.png"
   sprite_trim_mode: SPRITE_TRIM_MODE_OFF
 }
+images {
+  image: "/assets/images/green_button03.png"
+  sprite_trim_mode: SPRITE_TRIM_MODE_OFF
+}
 animations {
   id: "bee"
   images {

examples/_main/loader.go

@@ -892,3 +892,21 @@ embedded_components {
     w: 1.0
   }
 }
+embedded_components {
+  id: "gui/progress"
+  type: "collectionproxy"
+  data: "collection: \"/examples/gui/progress/progress.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

@@ -104,7 +104,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"}
 	self.index["animation"] = { "spinner", "flipbook", "chained_tween", "basic_tween", "spine", "cursor" }
-	self.index["gui"] = { "button", "stencil", "load_texture", "pointer_over", "color", "slice9" }
+	self.index["gui"] = { "button", "stencil", "load_texture", "progress", "pointer_over", "color", "slice9" }
 	self.index["input"] = { "move", "text", "down_duration", "mouse_and_touch" }
 	self.index["particles"] = { "particlefx", "modifiers" }
 	self.index["sound"] = { "music", "fade_in_out", "panning" }

examples/gui/progress/progress.collection

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

examples/gui/progress/progress.gui

@@ -0,0 +1,186 @@
+script: "/examples/gui/progress/progress.gui_script"
+fonts {
+  name: "text24"
+  font: "/assets/text24.font"
+}
+textures {
+  name: "sprites"
+  texture: "/assets/sprites.atlas"
+}
+background_color {
+  x: 0.0
+  y: 0.0
+  z: 0.0
+  w: 0.0
+}
+nodes {
+  position {
+    x: 160.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: 400.0
+    y: 20.0
+    z: 0.0
+    w: 1.0
+  }
+  color {
+    x: 0.0
+    y: 1.0
+    z: 0.0
+    w: 1.0
+  }
+  type: TYPE_BOX
+  blend_mode: BLEND_MODE_ALPHA
+  texture: "sprites/green_button03"
+  id: "horizontal"
+  xanchor: XANCHOR_NONE
+  yanchor: YANCHOR_NONE
+  pivot: PIVOT_W
+  adjust_mode: ADJUST_MODE_FIT
+  layer: ""
+  inherit_alpha: true
+  slice9 {
+    x: 6.0
+    y: 6.0
+    z: 6.0
+    w: 6.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: 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: "0%"
+  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
+}
+nodes {
+  position {
+    x: 360.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: 100.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: 35.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
+}
+material: "/builtins/materials/gui.material"
+adjust_reference: ADJUST_REFERENCE_PARENT
+max_nodes: 512

examples/gui/progress/progress.gui_script

@@ -0,0 +1,36 @@
+-- set the width of the horizontal progress bar
+local function update_horizontal(p)
+	local node = gui.get_node("horizontal")
+	local size = gui.get_size(node)
+	size.x = p * 400 -- max width is 400 pixel
+	gui.set_size(node, size)
+end
+
+-- set value of numeric progress indicator (in percent from 0% to 100%)
+local function update_numeric(p)
+	local node = gui.get_node("numeric")
+	local percent = math.floor(p * 100)
+	gui.set_text(node, tostring(percent) .. "%")
+end
+
+-- update radial/circle progress by changing the fill angle
+local function update_radial(p)
+	local node = gui.get_node("radial")
+	local angle = p * 360 -- full circle is 360 degrees
+	gui.set_fill_angle(node, angle)
+end
+
+function init(self)
+	self.time = 0
+end
+
+function update(self, dt)
+	self.time = self.time + dt
+
+	-- calculate a value between 0.0 and 1.0
+	-- the value will gradually increas from 0 to 1 during 3 seconds
+	local p = (self.time % 3) / 3
+	update_numeric(p)
+	update_horizontal(p)
+	update_radial(p)
+end

examples/gui/progress/progress.md

@@ -0,0 +1,13 @@
+---
+title: GUI progress indicators
+brief: This example shows how to create various types of progress indicators
+scripts: progress.gui_script
+---
+
+The example shows three different types of progress indicators:
+
+1. A horizontal progress bar created using a box node with a texture and 9-slice scaling
+2. A numerical progress text created using a text node
+3. A circular progress created using a pie node
+
+![progress](progress.png)

game.project

@@ -51,3 +51,6 @@ show_fullscreen_button = 0
 show_made_with_defold = 0
 scale_mode = no_scale
 
+[graphics]
+texture_profiles = /all.texture_profiles
+