Merge pull request #115 from guzba/master

drawRoundedRect, drawEllipse, drawCircle, drawPolygon

README.md

@@ -50,16 +50,11 @@ image.drawSegment(segment(start, stop), color, strokeWidth = 10)
 [examples/rounded_rectangle.nim](examples/rounded_rectangle.nim)
 ```nim
 let
-  x = 50.0
-  y = 50.0
-  w = 100.0
-  h = 100.0
+  pos = vec2(50, 50)
+  wh = vec2(100, 100)
   r = 25.0
 
-var path: Path
-path.roundedRect(vec2(x, y), vec2(w, h), r, r, r, r)
-
-image.fillPath(path, rgba(0, 255, 0, 255))
+image.drawRoundedRect(rect(pos, wh), r, rgba(0, 255, 0, 255))
 ```
 ![example output](examples/rounded_rectangle.png)
 
@@ -83,32 +78,29 @@ image.fillPath(
 ### Shadow
 [examples/shadow.nim](examples/shadow.nim)
 ```nim
-var p: Path
-p.polygon(100, 100, 70, sides = 8)
-p.closePath()
+let polygonImage = newImage(200, 200)
+polygonImage.drawPolygon(
+  vec2(100, 100),
+  70,
+  sides = 8,
+  rgba(255, 255, 255, 255)
+)
 
-var polyImage = newImage(200, 200)
-polyImage.fillPath(p, rgba(255, 255, 255, 255))
-
-image.draw(polyImage.shadow(
+image.draw(polygonImage.shadow(
   offset = vec2(2, 2),
   spread = 2,
   blur = 10,
   color = rgba(0, 0, 0, 200)
 ))
-image.draw(polyImage)
+image.draw(polygonImage)
 ```
 ![example output](examples/shadow.png)
 
 ### Blur
 [examples/blur.nim](examples/blur.nim)
 ```nim
-var p: Path
-p.polygon(100, 100, 70, sides = 6)
-p.closePath()
-
 let mask = newMask(200, 200)
-mask.fillPath(p)
+mask.drawPolygon(vec2(100, 100), 70, sides = 6)
 
 blur.blur(20)
 blur.draw(mask, blendMode = bmMask)

examples/blur.nim

@@ -7,12 +7,8 @@ let
 
 image.fill(rgba(255, 255, 255, 255))
 
-var p: Path
-p.polygon(100, 100, 70, sides = 6)
-p.closePath()
-
 let mask = newMask(200, 200)
-mask.fillPath(p)
+mask.drawPolygon(vec2(100, 100), 70, sides = 6)
 
 blur.blur(20)
 blur.draw(mask, blendMode = bmMask)

examples/rounded_rectangle.nim

@@ -4,15 +4,10 @@ let image = newImage(200, 200)
 image.fill(rgba(255, 255, 255, 255))
 
 let
-  x = 50.0
-  y = 50.0
-  w = 100.0
-  h = 100.0
+  pos = vec2(50, 50)
+  wh = vec2(100, 100)
   r = 25.0
 
-var path: Path
-path.roundedRect(vec2(x, y), vec2(w, h), r, r, r, r)
-
-image.fillPath(path, rgba(0, 255, 0, 255))
+image.drawRoundedRect(rect(pos, wh), r, rgba(0, 255, 0, 255))
 
 image.writeFile("examples/rounded_rectangle.png")

examples/shadow.nim

@@ -1,24 +1,22 @@
 import pixie
 
-let
-  trees = readImage("examples/data/trees.png")
-  image = newImage(200, 200)
-
+let image = newImage(200, 200)
 image.fill(rgba(255, 255, 255, 255))
 
-var p: Path
-p.polygon(100, 100, 70, sides = 8)
-p.closePath()
+let polygonImage = newImage(200, 200)
+polygonImage.drawPolygon(
+  vec2(100, 100),
+  70,
+  sides = 8,
+  rgba(255, 255, 255, 255)
+)
 
-var polyImage = newImage(200, 200)
-polyImage.fillPath(p, rgba(255, 255, 255, 255))
-
-image.draw(polyImage.shadow(
+image.draw(polygonImage.shadow(
   offset = vec2(2, 2),
   spread = 2,
   blur = 10,
   color = rgba(0, 0, 0, 200)
 ))
-image.draw(polyImage)
+image.draw(polygonImage)
 
 image.writeFile("examples/shadow.png")

src/pixie.nim

@@ -62,6 +62,38 @@ proc drawRect*(mask: Mask, rect: Rect) =
   path.rect(rect)
   mask.fillPath(path)
 
+proc drawRoundedRect*(
+  image: Image,
+  rect: Rect,
+  nw, ne, se, sw: float32,
+  color: ColorRGBA,
+  blendMode = bmNormal
+) =
+  var path: Path
+  path.roundedRect(rect, nw, ne, se, sw)
+  image.fillPath(path, color, wrNonZero, blendMode)
+
+proc drawRoundedRect*(
+  image: Image,
+  rect: Rect,
+  radius: float32,
+  color: ColorRGBA,
+  blendMode = bmNormal
+) =
+  var path: Path
+  path.roundedRect(rect, radius, radius, radius, radius)
+  image.fillPath(path, color, wrNonZero, blendMode)
+
+proc drawRoundedRect*(mask: Mask, rect: Rect, nw, ne, se, sw: float32) =
+  var path: Path
+  path.roundedRect(rect, nw, ne, se, sw)
+  mask.fillPath(path)
+
+proc drawRoundedRect*(mask: Mask, rect: Rect, radius: float32) =
+  var path: Path
+  path.roundedRect(rect, radius, radius, radius, radius)
+  mask.fillPath(path)
+
 proc drawSegment*(
   image: Image,
   segment: Segment,
@@ -79,3 +111,65 @@ proc drawSegment*(mask: Mask, segment: Segment, strokeWidth: float32) =
   path.moveTo(segment.at)
   path.lineTo(segment.to)
   mask.strokePath(path, strokeWidth)
+
+proc drawEllipse*(
+  image: Image,
+  center: Vec2,
+  rx, ry: float32,
+  color: ColorRGBA,
+  blendMode = bmNormal
+) =
+  var path: Path
+  path.ellipse(center, rx, ry)
+  image.fillPath(path, color, wrNonZero, blendMode)
+
+proc drawEllipse*(
+  mask: Mask,
+  center: Vec2,
+  rx, ry: float32
+) =
+  var path: Path
+  path.ellipse(center, rx, ry)
+  mask.fillPath(path)
+
+proc drawCircle*(
+  image: Image,
+  center: Vec2,
+  radius: float32,
+  color: ColorRGBA,
+  blendMode = bmNormal
+) =
+  var path: Path
+  path.ellipse(center, radius, radius)
+  image.fillPath(path, color, wrNonZero, blendMode)
+
+proc drawCircle*(
+  mask: Mask,
+  center: Vec2,
+  radius: float32
+) =
+  var path: Path
+  path.ellipse(center, radius, radius)
+  mask.fillPath(path)
+
+proc drawPolygon*(
+  image: Image,
+  pos: Vec2,
+  size: float32,
+  sides: int,
+  color: ColorRGBA,
+  blendMode = bmNormal
+) =
+  var path: Path
+  path.polygon(pos, size, sides)
+  image.fillPath(path, color, wrNonZero, blendMode)
+
+proc drawPolygon*(
+  mask: Mask,
+  pos: Vec2,
+  size: float32,
+  sides: int
+) =
+  var path: Path
+  path.polygon(pos, size, sides)
+  mask.fillPath(path)

src/pixie/paths.nim

@@ -376,13 +376,9 @@ proc rect*(path: var Path, rect: Rect, clockwise = true) {.inline.} =
 const splineCircleK = 4.0 * (-1.0 + sqrt(2.0)) / 3
 
 proc roundedRect*(
-  path: var Path, pos, wh: Vec2, nw, ne, se, sw: float32, clockwise = true
+  path: var Path, x, y, w, h, nw, ne, se, sw: float32, clockwise = true
 ) =
   let
-    x = pos.x
-    y = pos.y
-    w = wh.x
-    h = wh.y
     s = splineCircleK
 
     maxRadius = min(w / 2, h / 2)
@@ -432,6 +428,16 @@ proc roundedRect*(
 
   path.closePath()
 
+proc roundedRect*(
+  path: var Path, pos, wh: Vec2, nw, ne, se, sw: float32, clockwise = true
+) {.inline.} =
+  path.roundedRect(pos.x, pos.y, wh.x, wh.y, nw, ne, se, sw, clockwise)
+
+proc roundedRect*(
+  path: var Path, rect: Rect, nw, ne, se, sw: float32, clockwise = true
+) {.inline.} =
+  path.roundedRect(rect.x, rect.y, rect.w, rect.h, nw, ne, se, sw, clockwise)
+
 proc ellipse*(path: var Path, cx, cy, rx, ry: float32) =
   let
     magicX = splineCircleK * rx
@@ -444,6 +450,9 @@ proc ellipse*(path: var Path, cx, cy, rx, ry: float32) =
   path.bezierCurveTo(cx + magicX, cy - ry, cx + rx, cy - magicY, cx + rx, cy)
   path.closePath()
 
+proc ellipse*(path: var Path, center: Vec2, rx, ry: float32) {.inline.} =
+  path.ellipse(center.x, center.y, rx, ry)
+
 proc polygon*(path: var Path, x, y, size: float32, sides: int) =
   ## Draws a n sided regular polygon at (x, y) with size.
   path.moveTo(x + size * cos(0.0), y + size * sin(0.0))
@@ -453,6 +462,9 @@ proc polygon*(path: var Path, x, y, size: float32, sides: int) =
       y + size * sin(side.float32 * 2.0 * PI / sides.float32)
     )
 
+proc polygon*(path: var Path, pos: Vec2, size: float32, sides: int) {.inline.} =
+  path.polygon(pos.x, pos.y, size, sides)
+
 proc commandsToShapes*(path: Path): seq[seq[Vec2]] =
   ## Converts SVG-like commands to line segments.
 

tests/test_images_draw.nim

@@ -56,6 +56,16 @@ block:
   image.drawRect(rect(vec2(10, 10), vec2(30, 30)), rgba(255, 255, 0, 255))
   image.writeFile("tests/images/drawRect.png")
 
+block:
+  let image = newImage(100, 100)
+  image.fill(rgba(0, 255, 255, 255))
+  image.drawRoundedRect(
+    rect(vec2(10, 10), vec2(30, 30)),
+    10,
+    rgba(255, 255, 0, 255)
+  )
+  image.writeFile("tests/images/drawRoundedRect.png")
+
 block:
   let image = newImage(100, 100)
   image.fill(rgba(0, 255, 255, 255))
@@ -65,3 +75,25 @@ block:
     strokeWidth = 10
   )
   image.writeFile("tests/images/drawSegment.png")
+
+block:
+  let image = newImage(100, 100)
+  image.fill(rgba(0, 255, 255, 255))
+  image.drawEllipse(
+    vec2(50, 50),
+    25,
+    25,
+    rgba(255, 255, 0, 255)
+  )
+  image.writeFile("tests/images/drawEllipse.png")
+
+block:
+  let image = newImage(100, 100)
+  image.fill(rgba(0, 255, 255, 255))
+  image.drawPolygon(
+    vec2(50, 50),
+    30,
+    6,
+    rgba(255, 255, 0, 255)
+  )
+  image.writeFile("tests/images/drawPolygon.png")

tests/test_masks.nim

@@ -108,6 +108,11 @@ block:
   mask.drawRect(rect(vec2(10, 10), vec2(30, 30)))
   writeFile("tests/images/masks/drawRect.png", mask.encodePng())
 
+block:
+  let mask = newMask(100, 100)
+  mask.drawRoundedRect(rect(vec2(10, 10), vec2(30, 30)), 10)
+  writeFile("tests/images/masks/drawRoundedRect.png", mask.encodePng())
+
 block:
   let mask = newMask(100, 100)
   mask.drawSegment(
@@ -115,3 +120,13 @@ block:
     strokeWidth = 10
   )
   writeFile("tests/images/masks/drawSegment.png", mask.encodePng())
+
+block:
+  let mask = newMask(100, 100)
+  mask.drawEllipse(vec2(50, 50), 20, 10)
+  writeFile("tests/images/masks/drawEllipse.png", mask.encodePng())
+
+block:
+  let mask = newMask(100, 100)
+  mask.drawPolygon(vec2(50, 50), 30, 6)
+  writeFile("tests/images/masks/drawPolygon.png", mask.encodePng())