Merge pull request #38 from defold/update-1.7.0

Added sprite material vertex color example

examples/_main/loader.go

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

@@ -107,6 +107,7 @@ function init(self)
 	self.index["animation"] = { "spinner", "flipbook", "chained_tween", "basic_tween", "spine", "cursor", "easing" }
 	self.index["gui"] = { "button", "stencil", "load_texture", "progress", "pointer_over", "color", "slice9" }
 	self.index["input"] = { "move", "text", "down_duration", "mouse_and_touch" }
+	self.index["material"] = { "vertexcolor" }
 	self.index["particles"] = { "particlefx", "modifiers", "fire_and_smoke" }
 	self.index["sound"] = { "music", "fade_in_out", "panning" }
 	self.index["render"] = { "camera", "screen_to_world" }

examples/material/vertexcolor/defold-logo.go

@@ -0,0 +1,23 @@
+embedded_components {
+  id: "sprite"
+  type: "sprite"
+  data: "default_animation: \"defold-logo\"\n"
+  "material: \"/examples/material/vertexcolor/vertexcolor.material\"\n"
+  "blend_mode: BLEND_MODE_ALPHA\n"
+  "textures {\n"
+  "  sampler: \"texture_sampler\"\n"
+  "  texture: \"/examples/material/vertexcolor/images.atlas\"\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
+  }
+}

examples/material/vertexcolor/images.atlas

@@ -0,0 +1,10 @@
+images {
+  image: "/examples/material/vertexcolor/defold-logo.png"
+  sprite_trim_mode: SPRITE_TRIM_MODE_OFF
+}
+margin: 0
+extrude_borders: 0
+inner_padding: 0
+max_page_width: 0
+max_page_height: 0
+rename_patterns: ""

examples/material/vertexcolor/vertexcolor.collection

@@ -0,0 +1,58 @@
+name: "vertexcolor"
+scale_along_z: 0
+embedded_instances {
+  id: "go"
+  data: "components {\n"
+  "  id: \"main\"\n"
+  "  component: \"/examples/material/vertexcolor/vertexcolor.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"
+  "  property_decls {\n"
+  "  }\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"factory\"\n"
+  "  type: \"factory\"\n"
+  "  data: \"prototype: \\\"/examples/material/vertexcolor/defold-logo.go\\\"\\n"
+  "load_dynamically: false\\n"
+  "dynamic_prototype: 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
+  }
+}

examples/material/vertexcolor/vertexcolor.fp

@@ -0,0 +1,12 @@
+varying mediump vec2 var_texcoord0;
+varying mediump vec4 var_mycolor;
+
+uniform lowp sampler2D texture_sampler;
+uniform lowp vec4 tint;
+
+void main()
+{
+    // Pre-multiply alpha since all runtime textures already are
+    lowp vec4 tint_pm = vec4(tint.xyz * tint.w, tint.w);
+    gl_FragColor = texture2D(texture_sampler, var_texcoord0.xy) * tint_pm * var_mycolor;
+}

examples/material/vertexcolor/vertexcolor.material

@@ -0,0 +1,42 @@
+name: "sprite"
+tags: "tile"
+vertex_program: "/examples/material/vertexcolor/vertexcolor.vp"
+fragment_program: "/examples/material/vertexcolor/vertexcolor.fp"
+vertex_space: VERTEX_SPACE_WORLD
+vertex_constants {
+  name: "view_proj"
+  type: CONSTANT_TYPE_VIEWPROJ
+}
+fragment_constants {
+  name: "tint"
+  type: CONSTANT_TYPE_USER
+  value {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+    w: 1.0
+  }
+}
+samplers {
+  name: "texture_sampler"
+  wrap_u: WRAP_MODE_CLAMP_TO_EDGE
+  wrap_v: WRAP_MODE_CLAMP_TO_EDGE
+  filter_min: FILTER_MODE_MIN_DEFAULT
+  filter_mag: FILTER_MODE_MAG_DEFAULT
+  max_anisotropy: 1.0
+}
+max_page_count: 0
+attributes {
+  name: "mycolor"
+  semantic_type: SEMANTIC_TYPE_NONE
+  element_count: 4
+  normalize: false
+  data_type: TYPE_FLOAT
+  coordinate_space: COORDINATE_SPACE_LOCAL
+  double_values {
+    v: 1.0
+    v: 1.0
+    v: 1.0
+    v: 1.0
+  }
+}

examples/material/vertexcolor/vertexcolor.md

@@ -0,0 +1,13 @@
+---
+title: Sprite Vertex Color Attribute
+brief: This example shows how to set and animate a vertex attribute
+scripts: vertexcolor.script, vertexcolor.vp, vertexcolor.fp
+---
+
+The `vertexcolor.script` sets the vertex attribute "mycolor", which has been specified in the material.
+
+![vertex attribute material](vertexcolor-material.png)
+
+The shaders specified by the material also makes use of the `mycolor` attribute to colorize the sprites.
+
+The vertex attributes can also be animated. Click the image for an animation effect.

examples/material/vertexcolor/vertexcolor.script

@@ -0,0 +1,38 @@
+function init(self)
+	msg.post(".", "acquire_input_focus")
+	
+	local scale = 0.75
+	local spacingx = 160 * scale + 10
+	local spacingy = 190 * scale + 10
+	local startx = 40 + spacingx*0.5
+	local starty = 40 + spacingy*0.5
+
+	local maxy = 3
+	local maxx = 4
+
+	self.urls = {}
+	for y = 0, maxy do
+		for x = 0, maxx do
+			local p = vmath.vector3(startx + x*spacingx, starty + y*spacingy, 0.5)
+			local id = factory.create("#factory", p, nil, nil, vmath.vector3(0.8, 0.8, 1))
+			local url = msg.url(nil, id, "sprite")
+			table.insert(self.urls, url)
+			
+			go.set(url, "mycolor", vmath.vector4(x/maxx, y/maxy, 0, 1))
+		end
+	end
+
+	self.updated = false
+end
+
+function update(self, dt)
+	self.updated = true
+end
+
+function on_input(self, action_id, action)
+	if action_id == hash("touch") and action.pressed and self.updated then
+		for _, url in ipairs(self.urls) do
+			go.animate(url, "mycolor", go.PLAYBACK_ONCE_PINGPONG, vmath.vector4(0, 0, 1, 1), go.EASING_LINEAR, .2)
+		end
+	end
+end

examples/material/vertexcolor/vertexcolor.vp

@@ -0,0 +1,16 @@
+uniform highp mat4 view_proj;
+
+// positions are in world space
+attribute highp vec4 position;
+attribute mediump vec2 texcoord0;
+attribute mediump vec4 mycolor;
+
+varying mediump vec2 var_texcoord0;
+varying mediump vec4 var_mycolor;
+
+void main()
+{
+    gl_Position = view_proj * vec4(position.xyz, 1.0);
+    var_texcoord0 = texcoord0;
+    var_mycolor = mycolor;
+}

examples/resource/modify_atlas/modify_atlas.collection

@@ -5,10 +5,13 @@ embedded_instances {
   data: "embedded_components {\n"
   "  id: \"sprite\"\n"
   "  type: \"sprite\"\n"
-  "  data: \"tile_set: \\\"/examples/resource/modify_atlas/modify_atlas.atlas\\\"\\n"
-  "default_animation: \\\"shipGreen_manned\\\"\\n"
+  "  data: \"default_animation: \\\"shipGreen_manned\\\"\\n"
   "material: \\\"/builtins/materials/sprite.material\\\"\\n"
   "blend_mode: BLEND_MODE_ALPHA\\n"
+  "textures {\\n"
+  "  sampler: \\\"texture_sampler\\\"\\n"
+  "  texture: \\\"/examples/resource/modify_atlas/modify_atlas.atlas\\\"\\n"
+  "}\\n"
   "\"\n"
   "  position {\n"
   "    x: 0.0\n"
@@ -45,10 +48,13 @@ embedded_instances {
   data: "embedded_components {\n"
   "  id: \"sprite\"\n"
   "  type: \"sprite\"\n"
-  "  data: \"tile_set: \\\"/examples/resource/modify_atlas/modify_atlas.atlas\\\"\\n"
-  "default_animation: \\\"shipPink_manned\\\"\\n"
+  "  data: \"default_animation: \\\"shipPink_manned\\\"\\n"
   "material: \\\"/builtins/materials/sprite.material\\\"\\n"
   "blend_mode: BLEND_MODE_ALPHA\\n"
+  "textures {\\n"
+  "  sampler: \\\"texture_sampler\\\"\\n"
+  "  texture: \\\"/examples/resource/modify_atlas/modify_atlas.atlas\\\"\\n"
+  "}\\n"
   "\"\n"
   "  position {\n"
   "    x: 0.0\n"
@@ -132,7 +138,7 @@ embedded_instances {
   "blend_mode: BLEND_MODE_ALPHA\\n"
   "line_break: false\\n"
   "text: \\\"CLICK TO REPLACE PINK WITH YELLOW\\\"\\n"
-  "font: \\\"/builtins/fonts/system_font.font\\\"\\n"
+  "font: \\\"/builtins/fonts/debug/always_on_top.font\\\"\\n"
   "material: \\\"/builtins/fonts/label.material\\\"\\n"
   "\"\n"
   "  position {\n"
@@ -170,10 +176,13 @@ embedded_instances {
   data: "embedded_components {\n"
   "  id: \"sprite\"\n"
   "  type: \"sprite\"\n"
-  "  data: \"tile_set: \\\"/examples/resource/modify_atlas/modify_atlas.atlas\\\"\\n"
-  "default_animation: \\\"shipGreen_manned\\\"\\n"
+  "  data: \"default_animation: \\\"shipGreen_manned\\\"\\n"
   "material: \\\"/builtins/materials/sprite.material\\\"\\n"
   "blend_mode: BLEND_MODE_ALPHA\\n"
+  "textures {\\n"
+  "  sampler: \\\"texture_sampler\\\"\\n"
+  "  texture: \\\"/examples/resource/modify_atlas/modify_atlas.atlas\\\"\\n"
+  "}\\n"
   "\"\n"
   "  position {\n"
   "    x: 0.0\n"
@@ -210,10 +219,13 @@ embedded_instances {
   data: "embedded_components {\n"
   "  id: \"sprite\"\n"
   "  type: \"sprite\"\n"
-  "  data: \"tile_set: \\\"/examples/resource/modify_atlas/modify_atlas.atlas\\\"\\n"
-  "default_animation: \\\"shipPink_manned\\\"\\n"
+  "  data: \"default_animation: \\\"shipPink_manned\\\"\\n"
   "material: \\\"/builtins/materials/sprite.material\\\"\\n"
   "blend_mode: BLEND_MODE_ALPHA\\n"
+  "textures {\\n"
+  "  sampler: \\\"texture_sampler\\\"\\n"
+  "  texture: \\\"/examples/resource/modify_atlas/modify_atlas.atlas\\\"\\n"
+  "}\\n"
   "\"\n"
   "  position {\n"
   "    x: 0.0\n"

examples/sprite/bunnymark/bunnymark.collection

@@ -71,7 +71,7 @@ embedded_instances {
   "blend_mode: BLEND_MODE_ALPHA\\n"
   "line_break: false\\n"
   "text: \\\"Label\\\"\\n"
-  "font: \\\"/builtins/fonts/system_font.font\\\"\\n"
+  "font: \\\"/builtins/fonts/debug/always_on_top.font\\\"\\n"
   "material: \\\"/builtins/fonts/label.material\\\"\\n"
   "\"\n"
   "  position {\n"

game.project

@@ -2,7 +2,7 @@
 title = Defold-examples
 version = 0.1
 custom_resources = examples/resource/modify_atlas/resources
-dependencies#0 = https://github.com/defold/extension-spine/archive/refs/tags/2.13.0.zip
+dependencies#0 = https://github.com/defold/extension-spine/archive/refs/tags/2.14.5.zip
 
 [bootstrap]
 main_collection = /examples/main.collectionc