Create atlas example (#67)

* Added example

* Update create_atlas.script

* Updates

* Create create_atlas.md

* Update game.project

examples/_main/examples.lua

@@ -26,7 +26,7 @@ examples["sprite"] = { "size", "tint", "flip", "bunnymark" }
 examples["file"] = { "sys_save_load" }
 examples["tilemap"] = { "collisions", "get_set_tile" }
 examples["timer"] = { "repeating_timer", "trigger_timer", "cancel_timer" }
-examples["resource"] = { "modify_atlas" }
+examples["resource"] = { "modify_atlas", "create_atlas" }
 
 local categories = {}
 for category,_ in pairs(examples) do

examples/_main/loader.go

@@ -478,3 +478,9 @@ embedded_components {
   data: "collection: \"/examples/material/screenspace/screenspace.collection\"\n"
   ""
 }
+embedded_components {
+  id: "resource/create_atlas"
+  type: "collectionproxy"
+  data: "collection: \"/examples/resource/create_atlas/create_atlas.collection\"\n"
+  ""
+}

examples/resource/create_atlas/create_atlas.collection

@@ -0,0 +1,33 @@
+name: "create_atlas"
+scale_along_z: 0
+embedded_instances {
+  id: "go"
+  data: "components {\n"
+  "  id: \"create_atlas\"\n"
+  "  component: \"/examples/resource/create_atlas/create_atlas.script\"\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"sprite\"\n"
+  "  type: \"sprite\"\n"
+  "  data: \"default_animation: \\\"coin\\\"\\n"
+  "material: \\\"/builtins/materials/sprite.material\\\"\\n"
+  "textures {\\n"
+  "  sampler: \\\"texture_sampler\\\"\\n"
+  "  texture: \\\"/assets/sprites.atlas\\\"\\n"
+  "}\\n"
+  "\"\n"
+  "}\n"
+  ""
+  position {
+    x: 360.0
+    y: 199.0
+  }
+}
+embedded_instances {
+  id: "gui"
+  data: "components {\n"
+  "  id: \"gui\"\n"
+  "  component: \"/examples/resource/create_atlas/create_atlas.gui\"\n"
+  "}\n"
+  ""
+}

examples/resource/create_atlas/create_atlas.gui

@@ -0,0 +1,17 @@
+script: "/examples/resource/create_atlas/create_atlas.gui_script"
+nodes {
+  position {
+    x: 360.0
+    y: 502.0
+  }
+  size {
+    x: 50.0
+    y: 50.0
+  }
+  type: TYPE_BOX
+  id: "box"
+  inherit_alpha: true
+  size_mode: SIZE_MODE_AUTO
+}
+material: "/builtins/materials/gui.material"
+adjust_reference: ADJUST_REFERENCE_PARENT

examples/resource/create_atlas/create_atlas.gui_script

@@ -0,0 +1,7 @@
+function on_message(self, message_id, message, sender)
+	if message_id == hash("use_atlas") then
+		local box = gui.get_node("box")
+		gui.set_texture(box, message.texture)
+		gui.play_flipbook(box, message.animation)
+	end
+end

examples/resource/create_atlas/create_atlas.md

@@ -0,0 +1,7 @@
+---
+title: Create atlas
+brief: This example shows how to create an atlas with two images and use it on a sprite and in a gui
+scripts: cretae_atlas.script, cretae_atlas.gui_script
+---
+
+The example creates a texture and an atlas with two images and uses the two images on a sprite and a gui box node.

examples/resource/create_atlas/create_atlas.script

@@ -0,0 +1,108 @@
+local function create_texture(width, height)
+	-- create a new rgba texture
+	local create_texture_params = {
+		width  = width,
+		height = height,
+		type   = resource.TEXTURE_TYPE_2D,
+		format = resource.TEXTURE_FORMAT_RGBA,
+	}
+	local my_texture_id = resource.create_texture("/my_custom_texture.texturec", create_texture_params)
+
+	-- create a buffer with pixel data
+	local buf = buffer.create(width * height, { { name=hash("rgba"), type=buffer.VALUE_TYPE_UINT8, count=4 } } )
+	local stream = buffer.get_stream(buf, hash("rgba"))
+
+	local half_width = width / 2
+	for y=1, height do
+		for x=1, width do
+			local index = (y-1) * width * 4 + (x-1) * 4 + 1
+			stream[index + 0] = x > half_width and 0xFF or 0x00
+			stream[index + 1] = x > half_width and 0x00 or 0xFF
+			stream[index + 2] = x > half_width and 0x00 or 0x00
+			stream[index + 3] = 0xFF
+		end
+	end
+
+	-- set the pixels on the texture
+	local set_texture_params = { width=width, height=height, x=0, y=0, type=resource.TEXTURE_TYPE_2D, format=resource.TEXTURE_FORMAT_RGBA, num_mip_maps=1 }
+	resource.set_texture(my_texture_id, set_texture_params, buf)
+	
+	return my_texture_id
+end
+
+local function create_atlas(texture_id, width, height)
+	local params = {
+		texture = texture_id,
+		animations = {
+			{
+				id          = "my_animation_left",
+				width       = width / 2,
+				height      = height,
+				frame_start = 1,
+				frame_end   = 2,
+			},
+			{
+				id          = "my_animation_right",
+				width       = width / 2,
+				height      = height,
+				frame_start = 2,
+				frame_end   = 3,
+			}
+		},
+		geometries = {
+			{
+				width = width / 2,
+				height = height,
+				pivot_x = 0.5,
+				pivot_y = 0.5,
+				vertices  = {
+					0,         height,
+					0,         0,
+					width / 2, 0,
+					width / 2, height
+				},
+				uvs = {
+					0,         height,
+					0,         0,
+					width / 2, 0,
+					width / 2, height
+				},
+				indices = {0,1,2,0,2,3}
+			},
+			{
+				width = width / 2,
+				height = height,
+				pivot_x = 0.5,
+				pivot_y = 0.5,
+				vertices  = {
+					0,         height,
+					0,         0,
+					width / 2, 0,
+					width / 2, height
+				},
+				uvs = {
+					width / 2,  height,
+					width / 2,  0,
+					width,      0,
+					width,      height
+				},
+				indices = {0,1,2,0,2,3}
+			}
+		}
+	}
+	local my_atlas_id = resource.create_atlas("/my_atlas.texturesetc", params)
+	return my_atlas_id
+end
+
+function init(self)
+	local width = 128
+	local height = 128
+	local my_texture_id = create_texture(width, height)
+	local my_atlas_id = create_atlas(my_texture_id, width, height)
+
+	go.set("#sprite", "image", my_atlas_id)
+	sprite.play_flipbook("#sprite", "my_animation_left")
+
+	go.set("gui#gui", "textures", my_atlas_id, { key = "my_atlas" })
+	msg.post("gui#gui", "use_atlas", { texture = "my_atlas", animation = "my_animation_right" })
+end