[canvaskit] Expose various canvas features
clipRRect and drawColor
Change-Id: I6e947b4a30646a96935c74e0cd334f1624c41065
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/249892
Reviewed-by: Mike Reed <reed@google.com>
diff --git a/modules/canvaskit/CHANGELOG.md b/modules/canvaskit/CHANGELOG.md
index 052d219..57cde48 100644
--- a/modules/canvaskit/CHANGELOG.md
+++ b/modules/canvaskit/CHANGELOG.md
@@ -9,6 +9,7 @@
- Experimental `CanvasKit.Malloc`, which can be used to create a
TypedArray backed by the C++ WASM memory. This can save a copy in some cases
(e.g. SkColorFilter.MakeMatrix). This is an advanced feature, so use it with care.
+ - `SkCanvas.clipRRect`, `SkCanvas.drawColor`
## [0.8.0] - 2019-10-21
diff --git a/modules/canvaskit/canvaskit_bindings.cpp b/modules/canvaskit/canvaskit_bindings.cpp
index 3f33045..f6bb18d 100644
--- a/modules/canvaskit/canvaskit_bindings.cpp
+++ b/modules/canvaskit/canvaskit_bindings.cpp
@@ -812,6 +812,9 @@
.constructor<>()
.function("clear", &SkCanvas::clear)
.function("clipPath", select_overload<void (const SkPath&, SkClipOp, bool)>(&SkCanvas::clipPath))
+ .function("clipRRect",optional_override([](SkCanvas& self, const SimpleRRect& r, SkClipOp op, bool doAntiAlias) {
+ self.clipRRect(toRRect(r), op, doAntiAlias);
+ }))
.function("clipRect", select_overload<void (const SkRect&, SkClipOp, bool)>(&SkCanvas::clipRect))
.function("concat", optional_override([](SkCanvas& self, const SimpleMatrix& m) {
self.concat(toSkMatrix(m));
@@ -831,6 +834,7 @@
self.drawAtlas(atlas, dstXforms, srcRects, colors, count, mode, nullptr, paint);
}), allow_raw_pointers())
.function("drawCircle", select_overload<void (SkScalar, SkScalar, SkScalar, const SkPaint& paint)>(&SkCanvas::drawCircle))
+ .function("drawColor", &SkCanvas::drawColor)
.function("drawDRRect",optional_override([](SkCanvas& self, const SimpleRRect& o, const SimpleRRect& i, const SkPaint& paint) {
self.drawDRRect(toRRect(o), toRRect(i), paint);
}))
diff --git a/modules/canvaskit/externs.js b/modules/canvaskit/externs.js
index 121e92f..c3fc817 100644
--- a/modules/canvaskit/externs.js
+++ b/modules/canvaskit/externs.js
@@ -129,12 +129,14 @@
// public API (from C++ bindings)
clear: function() {},
clipPath: function() {},
+ clipRRect: function() {},
clipRect: function() {},
concat: function() {},
+ drawAnimatedImage: function() {},
drawArc: function() {},
drawCircle: function() {},
+ drawColor: function() {},
drawDRRect: function() {},
- drawAnimatedImage: function() {},
drawImage: function() {},
drawImageRect: function() {},
drawLine: function() {},
diff --git a/modules/canvaskit/tests/canvas.spec.js b/modules/canvaskit/tests/canvas.spec.js
index 1f0c113..914bdbf 100644
--- a/modules/canvaskit/tests/canvas.spec.js
+++ b/modules/canvaskit/tests/canvas.spec.js
@@ -284,8 +284,6 @@
return;
}
const canvas = surface.getCanvas();
- const path = starPath(CanvasKit);
-
const paint = new CanvasKit.SkPaint();
const blue = CanvasKit.SkColorFilter.MakeBlend(
@@ -313,17 +311,13 @@
cm = CanvasKit.SkColorMatrix.concat(cm, b);
CanvasKit.SkColorMatrix.postTranslate(cm, 20, 0, -10, 0);
- console.log(cm);
-
const mat = CanvasKit.SkColorFilter.MakeMatrix(cm);
-
const final = CanvasKit.SkColorFilter.MakeCompose(mat, lerp);
paint.setColorFilter(final)
canvas.drawRect(CanvasKit.LTRBRect(10, 70, 140, 120), paint);
surface.flush();
- path.delete();
paint.delete();
blue.delete();
red.delete();
@@ -343,8 +337,6 @@
return;
}
const canvas = surface.getCanvas();
- const path = starPath(CanvasKit);
-
const paint = new CanvasKit.SkPaint();
const src = [
@@ -362,8 +354,7 @@
paint.setColorFilter(final)
canvas.drawRect(CanvasKit.LTRBRect(10, 70, 140, 120), paint);
- surface.flush();
- path.delete();
+ surface.flush()
paint.delete();
final.delete();
@@ -371,4 +362,36 @@
}));
});
-});
\ No newline at end of file
+ it('can clip using rrect and path', function(done) {
+ LoadCanvasKit.then(catchException(done, () => {
+ const surface = CanvasKit.MakeCanvasSurface('test');
+ expect(surface).toBeTruthy('Could not make surface')
+ if (!surface) {
+ done();
+ return;
+ }
+ const canvas = surface.getCanvas();
+ const path = starPath(CanvasKit);
+ const paint = new CanvasKit.SkPaint();
+ paint.setColor(CanvasKit.BLUE);
+ const rrect = CanvasKit.RRectXY(CanvasKit.LTRBRect(300, 300, 500, 500), 40, 40);
+
+ canvas.save();
+ // draw magenta around the outside edge of an rrect.
+ canvas.clipRRect(rrect, CanvasKit.ClipOp.Difference, true);
+ canvas.drawColor(CanvasKit.Color(250, 30, 240, 0.9), CanvasKit.BlendMode.SrcOver);
+ canvas.restore();
+
+ // draw grey inside of a star pattern, then the blue star on top
+ canvas.clipPath(path, CanvasKit.ClipOp.Intersect, false);
+ canvas.drawColor(CanvasKit.Color(200, 200, 200, 1.0), CanvasKit.BlendMode.SrcOver);
+ canvas.drawPath(path, paint);
+
+ surface.flush();
+ path.delete();
+
+ reportSurface(surface, 'clips_canvas', done);
+ }));
+ });
+
+});