[canvaskit] Modify drawImageNine API to handle Filter quality

Bug: skia:11099
Change-Id: Ia019bd5107d5646d6e314876610ecdeb37004e36
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/345277
Reviewed-by: Mike Reed <reed@google.com>

modules/canvaskit/CHANGELOG.md

@@ -10,6 +10,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
  - `Canvas.drawImageCubic`, `Canvas.drawImageOptions`, `Canvas.drawImageRectCubic`,
    `Canvas.drawImageRectOptions` to replace functionality that previously required FilterQuality.
 
+### Breaking
+ - `Canvas.drawImageNine` now takes a required FilterMode (the Paint still is optional).
+
 ## [0.21.0] - 2020-12-16
 
 ### Added

modules/canvaskit/canvaskit/types/canvaskit-wasm-tests.ts

@@ -114,8 +114,8 @@ function canvasTests(CK: CanvasKit, canvas?: Canvas, paint?: Paint, path?: Path,
     canvas.drawImageAtCurrentFrame(aImg, 0, -43, paint);
     canvas.drawImageCubic(img, 0, -43, 1 / 3, 1 / 4, null);
     canvas.drawImageOptions(img, 0, -43, CK.FilterMode.Nearest, CK.MipmapMode.Nearest, paint);
-    canvas.drawImageNine(img, someRect, someRect, paint);
-    canvas.drawImageNine(img, CK.XYWHiRect(10, 20, 40, 40), someRect, paint);
+    canvas.drawImageNine(img, someRect, someRect, CK.FilterMode.Nearest);
+    canvas.drawImageNine(img, CK.XYWHiRect(10, 20, 40, 40), someRect, CK.FilterMode.Linear, paint);
     canvas.drawImageRect(img, someRect, someRect, paint);
     canvas.drawImageRect(img, CK.XYWHRect(90, 90, 40, 40), someRect, paint);
     canvas.drawImageRect(img, someRect, someRect, paint, true);

modules/canvaskit/canvaskit/types/index.d.ts

@@ -1084,9 +1084,11 @@ export interface Canvas extends EmbindObject<Canvas> {
      * @param img
      * @param center
      * @param dest
+     * @param filter - what technique to use when sampling the image
      * @param paint
      */
-    drawImageNine(img: Image, center: InputIRect, dest: InputRect, paint: Paint): void;
+    drawImageNine(img: Image, center: InputIRect, dest: InputRect, filter: FilterMode,
+                  paint?: Paint): void;
 
     /**
      * Draws sub-rectangle src from provided image, scaled and translated to fill dst rectangle.

modules/canvaskit/canvaskit_bindings.cpp

@@ -914,11 +914,11 @@ EMSCRIPTEN_BINDINGS(Skia) {
 
         .function("_drawImageNine", optional_override([](SkCanvas& self, const sk_sp<SkImage>& image,
                                                          uintptr_t /* int* */ centerPtr, uintptr_t /* float* */ dstPtr,
-                                                         const SkPaint* paint)->void {
+                                                         SkFilterMode filter, const SkPaint* paint)->void {
             const SkIRect* center = reinterpret_cast<const SkIRect*>(centerPtr);
             const SkRect* dst = reinterpret_cast<const SkRect*>(dstPtr);
 
-            self.drawImageNine(image, *center, *dst, paint);
+            self.drawImageNine(image.get(), *center, *dst, filter, paint);
         }), allow_raw_pointers())
         .function("_drawImageRect", optional_override([](SkCanvas& self, const sk_sp<SkImage>& image,
                                                          uintptr_t /* float* */ srcPtr, uintptr_t /* float* */ dstPtr,

modules/canvaskit/externs.js

@@ -36,7 +36,6 @@ var CanvasKit = {
   ImageData: function() {},
 
   GetWebGLContext: function() {},
-  MakeBlurMaskFilter: function() {},
   MakeCanvas: function() {},
   MakeCanvasSurface: function() {},
   MakeGrContext: function() {},
@@ -818,6 +817,11 @@ var CanvasKit = {
     EvenOdd: {},
   },
 
+  FilterMode: {
+    Linear: {},
+    Nearest: {},
+  },
+
   FilterQuality: {
     None: {},
     Low: {},

modules/canvaskit/interface.js

@@ -1101,10 +1101,10 @@ CanvasKit.onRuntimeInitialized = function() {
     this._drawDRRect(oPtr, iPtr, paint);
   };
 
-  CanvasKit.Canvas.prototype.drawImageNine = function(img, center, dest, paint) {
+  CanvasKit.Canvas.prototype.drawImageNine = function(img, center, dest, filter, paint) {
     var cPtr = copyIRectToWasm(center);
     var dPtr = copyRectToWasm(dest);
-    this._drawImageNine(img, cPtr, dPtr, paint);
+    this._drawImageNine(img, cPtr, dPtr, filter, paint || null);
   };
 
   CanvasKit.Canvas.prototype.drawImageRect = function(img, src, dest, paint, fastSample) {

modules/canvaskit/tests/canvas.spec.js

@@ -639,7 +639,7 @@ describe('Canvas Behavior', () => {
         const paint = new CanvasKit.Paint();
 
         canvas.drawImageNine(img, CanvasKit.LTRBiRect(40, 40, 400, 300),
-            CanvasKit.LTRBRect(5, 5, 300, 650), paint);
+            CanvasKit.LTRBRect(5, 5, 300, 650), CanvasKit.FilterMode.Nearest, paint);
         paint.delete();
         img.delete();
     }, '/assets/mandrill_512.png');