Added new examples

README.md

@@ -238,6 +238,22 @@ Fills an area at specified boundaries. Only for 4 channels:
 `blue` - blue channel of the color 0..255<br />
 `alpha` - alpha channel 0..255<br />
 
+In order to draw this into a sprite, you need a separate atlas with power of two texture. Then we can use `resource.set_texture`:
+
+```lua
+resource.set_texture(go.get("#sprite", "texture0"), self.header, self.buffer_info.buffer)
+```
+
+In order to render this in gui, we just need to create a box and create a new texture.
+We can use `gui.new_texture`. Then you need to set this texture to the box using `gui.set_texture`:
+
+```lua
+local data = buffer.get_bytes(self.buffer_info.buffer, hash("rgba"))
+gui.new_texture("name", width, height, image.TYPE_RGBA, data)
+gui.set_texture(gui.get_node("box"), "name")
+gui.set_size(gui.get_node("box"), vmath.vector3(width, height, 0))
+```
+
 --------
 
 If you have any questions or suggestions contact me: [email protected]

drawpixels/src/drawpixels.cpp

@@ -881,8 +881,6 @@ static void draw_gradient_arc_lines(int _x, int _y, int radius, float from, floa
   float ty = radius * sin(to + M_PI / 2);
   draw_gradient_line_vu(_x, _y, fx + _x, fy + _y, c1, c2, a, 1);
   draw_gradient_line_vu(_x, _y, tx + _x, ty + _y, c1, c2, a, 1);
-  // mixpixel(fx + _x, fy + _y, c1.r, c1.g, c1.b, a);
-  // mixpixel(tx + _x, ty + _y, c2.r, c2.g, c2.b, a);
 }
 
 static void draw_arc_lines(int _x, int _y, int radius, float from, float to, int r, int g, int b, int a)
@@ -899,8 +897,6 @@ static void draw_arc_lines(int _x, int _y, int radius, float from, float to, int
   float ty = radius * sin(to + M_PI / 2);
   draw_line_vu(_x, _y, fx + _x, fy + _y, r, g, b, a, 1);
   draw_line_vu(_x, _y, tx + _x, ty + _y, r, g, b, a, 1);
-  // mixpixel(fx + _x, fy + _y, r, g, b, a);
-  // mixpixel(tx + _x, ty + _y, r, g, b, a);
 }
 
 static void draw_arc_vu(int _x, int _y, int radius, float from, float to, int r, int g, int b, int a)

examples/arcs/arcs.collection

@@ -0,0 +1,57 @@
+name: "default"
+scale_along_z: 0
+embedded_instances {
+  id: "canvas"
+  data: "components {\n"
+  "  id: \"arcs\"\n"
+  "  component: \"/examples/arcs/arcs.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"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"sprite\"\n"
+  "  type: \"sprite\"\n"
+  "  data: \"tile_set: \\\"/example/img.atlas\\\"\\n"
+  "default_animation: \\\"fullscreen\\\"\\n"
+  "material: \\\"/examples/sprite.material\\\"\\n"
+  "blend_mode: BLEND_MODE_ALPHA\\n"
+  "\"\n"
+  "  position {\n"
+  "    x: 8.572\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: 248.0
+    y: 500.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/arcs/arcs.script

@@ -0,0 +1,30 @@
+function init(self)
+  msg.post("@render:", "clear_color", {color = vmath.vector4(1, 1, 1, 1)})
+  -- size of texture when scaled to nearest power of two
+  local width = 512
+  local height = 512
+  local channels = 4
+
+  self.resource_path = go.get("#sprite", "texture0")
+
+  self.buffer_info = {
+    buffer = buffer.create(width * height, {{name = hash("rgba"), type = buffer.VALUE_TYPE_UINT8, count = channels}}),
+    width = width,
+    height = height,
+    channels = channels
+  }
+
+  self.header = {width = width, height = height, type = resource.TEXTURE_TYPE_2D, format = resource.TEXTURE_FORMAT_RGBA, num_mip_maps = 1}
+  drawpixels.fill(self.buffer_info, 255, 255, 0, 255)
+
+  local step = 30;
+  for angle = 0, 330 - step, step do
+    -- drawpixels.gradient_arc(self.buffer_info, width/2, width/2,  width * 0.4, (angle) * math.pi / 180, (angle + step) * math.pi / 180, 120, 150, 48, 50, 180, 200, 255)
+    drawpixels.filled_arc(self.buffer_info, width / 2, width / 2, width * 0.4, (angle) * math.pi / 180, (angle + step) * math.pi / 180, 255, 0, 0,
+                          255)
+    drawpixels.arc(self.buffer_info, width / 2, width / 2, width * 0.4, (angle) * math.pi / 180, (angle + step) * math.pi / 180, 0, 0, 255, 255)
+  end
+
+  drawpixels.arc(self.buffer_info, width / 2, width / 2, width * 0.4, -20 * math.pi / 180, -50 * math.pi / 180, 0, 255, 0, 255)
+  resource.set_texture(self.resource_path, self.header, self.buffer_info.buffer)
+end

examples/fills/fills.collection

@@ -0,0 +1,57 @@
+name: "default"
+scale_along_z: 0
+embedded_instances {
+  id: "canvas"
+  data: "components {\n"
+  "  id: \"fills\"\n"
+  "  component: \"/examples/fills/fills.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"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"sprite\"\n"
+  "  type: \"sprite\"\n"
+  "  data: \"tile_set: \\\"/example/img.atlas\\\"\\n"
+  "default_animation: \\\"fullscreen\\\"\\n"
+  "material: \\\"/examples/sprite.material\\\"\\n"
+  "blend_mode: BLEND_MODE_ALPHA\\n"
+  "\"\n"
+  "  position {\n"
+  "    x: 8.572\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: 248.0
+    y: 500.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/fills/fills.script

@@ -0,0 +1,32 @@
+function init(self)
+  msg.post("@render:", "clear_color", {color = vmath.vector4(1, 1, 1, 1)})
+  -- size of texture when scaled to nearest power of two
+  local width = 512
+  local height = 512
+  local channels = 4
+
+  self.resource_path = go.get("#sprite", "texture0")
+
+  self.buffer_info = {
+    buffer = buffer.create(width * height, {{name = hash("rgba"), type = buffer.VALUE_TYPE_UINT8, count = channels}}),
+    width = width,
+    height = height,
+    channels = channels
+  }
+
+  self.header = {width = width, height = height, type = resource.TEXTURE_TYPE_2D, format = resource.TEXTURE_FORMAT_RGBA, num_mip_maps = 1}
+  drawpixels.fill(self.buffer_info, 255, 255, 0, 255)
+
+  drawpixels.start_fill()
+  drawpixels.line(self.buffer_info, 20, 20, 500, 20, 255, 0, 0, 255, true)
+  drawpixels.line(self.buffer_info, 500, 20, 400, 358, 255, 0, 0, 255, true)
+  drawpixels.line(self.buffer_info, 400, 358, 500, 500, 255, 0, 0, 255, true)
+  drawpixels.line(self.buffer_info, 500, 500, 258, 453, 255, 0, 0, 255, true)
+  drawpixels.line(self.buffer_info, 258, 453, 20, 20, 255, 0, 0, 255, true)
+  -- drawpixels.line(self.buffer_info,10, 250, 510, 250, 255, 0, 0, 255, true)
+  drawpixels.circle(self.buffer_info, 200, 200, 100, 0, 255, 255, 255, true)
+  drawpixels.arc(self.buffer_info, width / 2, width / 2, width * 0.4, -20 * math.pi / 180, -50 * math.pi / 180, 0, 255, 0, 255)
+  drawpixels.fill_area(self.buffer_info, 300, 300, 255, 0, 0, 255)
+  drawpixels.end_fill()
+  resource.set_texture(self.resource_path, self.header, self.buffer_info.buffer)
+end

examples/full.atlas

@@ -0,0 +1,7 @@
+images {
+  image: "/example/images/fullscreen512.png"
+  sprite_trim_mode: SPRITE_TRIM_MODE_OFF
+}
+margin: 0
+extrude_borders: 0
+inner_padding: 0

examples/lines_aa/lines.script

@@ -0,0 +1,26 @@
+function init(self)
+  msg.post("@render:", "clear_color", {color = vmath.vector4(1, 1, 1, 1)})
+  -- size of texture when scaled to nearest power of two
+  local width = 512
+  local height = 512
+  local channels = 4
+
+  self.resource_path = go.get("#sprite", "texture0")
+
+  self.buffer_info = {
+    buffer = buffer.create(width * height, {{name = hash("rgba"), type = buffer.VALUE_TYPE_UINT8, count = channels}}),
+    width = width,
+    height = height,
+    channels = channels
+  }
+
+  self.header = {width = width, height = height, type = resource.TEXTURE_TYPE_2D, format = resource.TEXTURE_FORMAT_RGBA, num_mip_maps = 1}
+  drawpixels.fill(self.buffer_info, 255, 255, 0, 255)
+
+  drawpixels.gradient_line(self.buffer_info, width * 0.2, width * 0.1, width * 0.9, width * 0.9, 255, 0, 0, 0, 0, 255, 255, 12)
+  drawpixels.line(self.buffer_info, width * 0.2, width * 0.5, width * 0.9, width * 0.9, 0, 0, 255, 255, true, 5)
+  drawpixels.line(self.buffer_info, width * 0.1, width * 0.5, width * 0.9, width * 0.5, 255, 0, 0, 255, true, 10)
+  drawpixels.line(self.buffer_info, width * 0.5, width * 0.1, width * 0.5, width * 0.9, 0, 0, 255, 255, true, 10)
+
+  resource.set_texture(self.resource_path, self.header, self.buffer_info.buffer)
+end

examples/lines_aa/lines_aa.collection

@@ -0,0 +1,57 @@
+name: "default"
+scale_along_z: 0
+embedded_instances {
+  id: "canvas"
+  data: "components {\n"
+  "  id: \"lines\"\n"
+  "  component: \"/examples/lines_aa/lines.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"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"sprite\"\n"
+  "  type: \"sprite\"\n"
+  "  data: \"tile_set: \\\"/example/img.atlas\\\"\\n"
+  "default_animation: \\\"fullscreen\\\"\\n"
+  "material: \\\"/examples/sprite.material\\\"\\n"
+  "blend_mode: BLEND_MODE_ALPHA\\n"
+  "\"\n"
+  "  position {\n"
+  "    x: 8.572\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: 248.0
+    y: 500.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/sprite.material

@@ -0,0 +1,32 @@
+name: "sprite"
+tags: "tile"
+vertex_program: "/builtins/materials/sprite.vp"
+fragment_program: "/builtins/materials/sprite.fp"
+vertex_space: VERTEX_SPACE_WORLD
+vertex_constants {
+  name: "view_proj"
+  type: CONSTANT_TYPE_VIEWPROJ
+  value {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 0.0
+  }
+}
+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_LINEAR
+  filter_mag: FILTER_MODE_MAG_LINEAR
+}

examples/togui/togui.collection

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