diff --git a/lib/web_ui/lib/src/engine/compositor/canvas.dart b/lib/web_ui/lib/src/engine/compositor/canvas.dart index 08222ad3a5133..2d93ea842a822 100644 --- a/lib/web_ui/lib/src/engine/compositor/canvas.dart +++ b/lib/web_ui/lib/src/engine/compositor/canvas.dart @@ -16,7 +16,7 @@ class CkCanvas { skCanvas.clear(toSharedSkColor1(color)); } - static final SkClipOp _clipOpIntersect = canvasKitJs.ClipOp.Intersect; + static final SkClipOp _clipOpIntersect = canvasKit.ClipOp.Intersect; void clipPath(ui.Path path, bool doAntiAlias) { final CkPath ckPath = path as CkPath; @@ -158,7 +158,7 @@ class CkCanvas { void drawParagraph(CkParagraph paragraph, ui.Offset offset) { skCanvas.drawParagraph( - _jsObjectWrapper.unwrapSkParagraph(paragraph.legacySkiaObject), + paragraph.skiaObject, offset.dx, offset.dy, ); @@ -232,12 +232,12 @@ class CkCanvas { } void saveLayerWithoutBounds(CkPaint paint) { - final SkCanvasSaveLayerWithoutBoundsOverride override = _jsObjectWrapper.castToSkCanvasSaveLayerWithoutBoundsOverride(skCanvas); + final SkCanvasSaveLayerWithoutBoundsOverload override = skCanvas as SkCanvasSaveLayerWithoutBoundsOverload; override.saveLayer(paint.skiaObject); } void saveLayerWithFilter(ui.Rect bounds, ui.ImageFilter filter) { - final SkCanvasSaveLayerWithFilterOverride override = _jsObjectWrapper.castToSkCanvasSaveLayerWithFilterOverride(skCanvas); + final SkCanvasSaveLayerWithFilterOverload override = skCanvas as SkCanvasSaveLayerWithFilterOverload; final CkImageFilter skImageFilter = filter as CkImageFilter; return override.saveLayer( null, diff --git a/lib/web_ui/lib/src/engine/compositor/canvaskit_api.dart b/lib/web_ui/lib/src/engine/compositor/canvaskit_api.dart index 51c3149973a87..538d12d0d107b 100644 --- a/lib/web_ui/lib/src/engine/compositor/canvaskit_api.dart +++ b/lib/web_ui/lib/src/engine/compositor/canvaskit_api.dart @@ -8,162 +8,15 @@ /// the API behind these bindings in the Skia source code. part of engine; -final js.JsObject _jsWindow = js.JsObject.fromBrowserObject(html.window); +/// Entrypoint into the CanvasKit API. +late CanvasKit canvasKit; -/// This and [_jsObjectWrapper] below are used to convert `@JS`-backed -/// objects to [js.JsObject]s. To do that we use `@JS` to pass the object -/// to JavaScript (see [JsObjectWrapper]), then use this variable (which -/// uses `dart:js`) to read the value back, causing it to be wrapped in -/// [js.JsObject]. +/// Sets the [CanvasKit] object on `window` so we can use `@JS()` to bind to +/// static APIs. /// -// TODO(yjbanov): this is a temporary hack until we fully migrate to @JS. -final js.JsObject _jsObjectWrapperLegacy = js.JsObject(js.context['Object']); - -@JS('window.flutter_js_object_wrapper') -external JsObjectWrapper get _jsObjectWrapper; - -@visibleForTesting -JsObjectWrapper get debugJsObjectWrapper => _jsObjectWrapper; - -void initializeCanvasKitBindings(js.JsObject canvasKit) { - // Because JsObject cannot be cast to a @JS type, we stash CanvasKit into - // a global and use the [canvasKitJs] getter to access it. - _jsWindow['flutter_canvas_kit'] = canvasKit; - _jsWindow['flutter_js_object_wrapper'] = _jsObjectWrapperLegacy; -} - -@JS() -class JsObjectWrapper { - external set skPaint(SkPaint? paint); - external set skMaskFilter(SkMaskFilter? filter); - external set skColorFilter(SkColorFilter? filter); - external set skImageFilter(SkImageFilter? filter); - external set skPath(SkPath? path); - external set skImage(SkImage? image); - external SkCanvas? get skCanvas; - external set skCanvas(SkCanvas? canvas); - external SkPicture? get skPicture; - external set skPicture(SkPicture? picture); - external SkParagraph? get skParagraph; - external set skParagraph(SkParagraph? paragraph); -} - -/// Reads [JsObjectWrapper.skPath] as [SkPathArcToPointOverload]. -@JS('window.flutter_js_object_wrapper.skPath') -external SkPathArcToPointOverload get _skPathArcToPointOverload; - -/// Reads [JsObjectWrapper.skCanvas] as [SkCanvasSaveLayerWithoutBoundsOverride]. -@JS('window.flutter_js_object_wrapper.skCanvas') -external SkCanvasSaveLayerWithoutBoundsOverride get _skCanvasSaveLayerWithoutBoundsOverride; - -/// Reads [JsObjectWrapper.skCanvas] as [SkCanvasSaveLayerWithFilterOverride]. -@JS('window.flutter_js_object_wrapper.skCanvas') -external SkCanvasSaveLayerWithFilterOverride get _skCanvasSaveLayerWithFilterOverride; - -/// Specific methods that wrap `@JS`-backed objects into a [js.JsObject] -/// for use with legacy `dart:js` API. -extension JsObjectWrappers on JsObjectWrapper { - js.JsObject wrapSkPaint(SkPaint paint) { - _jsObjectWrapper.skPaint = paint; - js.JsObject wrapped = _jsObjectWrapperLegacy['skPaint']; - _jsObjectWrapper.skPaint = null; - return wrapped; - } - - js.JsObject wrapSkMaskFilter(SkMaskFilter filter) { - _jsObjectWrapper.skMaskFilter = filter; - js.JsObject wrapped = _jsObjectWrapperLegacy['skMaskFilter']; - _jsObjectWrapper.skMaskFilter = null; - return wrapped; - } - - js.JsObject wrapSkColorFilter(SkColorFilter filter) { - _jsObjectWrapper.skColorFilter = filter; - js.JsObject wrapped = _jsObjectWrapperLegacy['skColorFilter']; - _jsObjectWrapper.skColorFilter = null; - return wrapped; - } - - js.JsObject wrapSkImageFilter(SkImageFilter filter) { - _jsObjectWrapper.skImageFilter = filter; - js.JsObject wrapped = _jsObjectWrapperLegacy['skImageFilter']; - _jsObjectWrapper.skImageFilter = null; - return wrapped; - } - - js.JsObject wrapSkPath(SkPath path) { - _jsObjectWrapper.skPath = path; - js.JsObject wrapped = _jsObjectWrapperLegacy['skPath']; - _jsObjectWrapper.skPath = null; - return wrapped; - } - - js.JsObject wrapSkImage(SkImage image) { - _jsObjectWrapper.skImage = image; - js.JsObject wrapped = _jsObjectWrapperLegacy['skImage']; - _jsObjectWrapper.skImage = null; - return wrapped; - } - - js.JsObject wrapSkPicture(SkPicture picture) { - _jsObjectWrapper.skPicture = picture; - js.JsObject wrapped = _jsObjectWrapperLegacy['skPicture']; - _jsObjectWrapper.skPicture = null; - return wrapped; - } - - SkPicture unwrapSkPicture(js.JsObject wrapped) { - _jsObjectWrapperLegacy['skPicture'] = wrapped; - final SkPicture unwrapped = _jsObjectWrapper.skPicture!; - _jsObjectWrapper.skPicture = null; - return unwrapped; - } - - js.JsObject wrapSkParagraph(SkParagraph paragraph) { - _jsObjectWrapper.skParagraph = paragraph; - js.JsObject wrapped = _jsObjectWrapperLegacy['skParagraph']; - _jsObjectWrapper.skParagraph = null; - return wrapped; - } - - SkParagraph unwrapSkParagraph(js.JsObject wrapped) { - _jsObjectWrapperLegacy['skParagraph'] = wrapped; - final SkParagraph unwrapped = _jsObjectWrapper.skParagraph!; - _jsObjectWrapper.skParagraph = null; - return unwrapped; - } - - SkCanvas unwrapSkCanvas(js.JsObject wrapped) { - _jsObjectWrapperLegacy['skCanvas'] = wrapped; - final SkCanvas unwrapped = _jsObjectWrapper.skCanvas!; - _jsObjectWrapper.skCanvas = null; - return unwrapped; - } - - SkPathArcToPointOverload castToSkPathArcToPointOverload(SkPath path) { - _jsObjectWrapper.skPath = path; - final SkPathArcToPointOverload overload = _skPathArcToPointOverload; - _jsObjectWrapper.skPath = null; - return overload; - } - - SkCanvasSaveLayerWithoutBoundsOverride castToSkCanvasSaveLayerWithoutBoundsOverride(SkCanvas canvas) { - _jsObjectWrapper.skCanvas = canvas; - final SkCanvasSaveLayerWithoutBoundsOverride overload = _skCanvasSaveLayerWithoutBoundsOverride; - _jsObjectWrapper.skCanvas = null; - return overload; - } - - SkCanvasSaveLayerWithFilterOverride castToSkCanvasSaveLayerWithFilterOverride(SkCanvas canvas) { - _jsObjectWrapper.skCanvas = canvas; - final SkCanvasSaveLayerWithFilterOverride overload = _skCanvasSaveLayerWithFilterOverride; - _jsObjectWrapper.skCanvas = null; - return overload; - } -} - +/// See, e.g. [SkPaint]. @JS('window.flutter_canvas_kit') -external CanvasKit get canvasKitJs; +external set windowFlutterCanvasKit(CanvasKit value); @JS() class CanvasKit { @@ -213,6 +66,66 @@ class CanvasKit { // End of text decoration enum. external SkFontMgrNamespace get SkFontMgr; + external int GetWebGLContext(html.CanvasElement canvas, SkWebGLContextOptions options); + external SkGrContext MakeGrContext(int glContext); + external SkSurface MakeOnScreenGLSurface( + SkGrContext grContext, + double width, + double height, + SkColorSpace colorSpace, + ); + external SkSurface MakeSWCanvasSurface(html.CanvasElement canvas); + external void setCurrentContext(int glContext); +} + +@JS('window.CanvasKitInit') +external CanvasKitInitPromise CanvasKitInit(CanvasKitInitOptions options); + +typedef LocateFileCallback = String Function(String file, String unusedBase); + +@JS() +@anonymous +class CanvasKitInitOptions { + external factory CanvasKitInitOptions({ + required LocateFileCallback locateFile, + }); +} + +typedef CanvasKitInitCallback = void Function(CanvasKit canvasKit); + +@JS() +class CanvasKitInitPromise { + external void then(CanvasKitInitCallback callback); +} + +@JS('window.flutter_canvas_kit.SkColorSpace.SRGB') +external SkColorSpace get SkColorSpaceSRGB; + +@JS() +class SkColorSpace {} + +@JS() +@anonymous +class SkWebGLContextOptions { + external factory SkWebGLContextOptions({ + required int anitalias, + }); +} + +@JS() +class SkSurface { + external SkCanvas getCanvas(); + external void flush(); + external int width(); + external int height(); + external void dispose(); +} + +@JS() +class SkGrContext { + external void setResourceCacheLimitBytes(int limit); + external void releaseResourcesAndAbandonContext(); + external void delete(); } @JS() @@ -227,8 +140,8 @@ class SkFontSlant { } final List _skFontSlants = [ - canvasKitJs.FontSlant.Upright, - canvasKitJs.FontSlant.Italic, + canvasKit.FontSlant.Upright, + canvasKit.FontSlant.Italic, ]; SkFontSlant toSkFontSlant(ui.FontStyle style) { @@ -254,15 +167,15 @@ class SkFontWeight { } final List _skFontWeights = [ - canvasKitJs.FontWeight.Thin, - canvasKitJs.FontWeight.ExtraLight, - canvasKitJs.FontWeight.Light, - canvasKitJs.FontWeight.Normal, - canvasKitJs.FontWeight.Medium, - canvasKitJs.FontWeight.SemiBold, - canvasKitJs.FontWeight.Bold, - canvasKitJs.FontWeight.ExtraBold, - canvasKitJs.FontWeight.ExtraBlack, + canvasKit.FontWeight.Thin, + canvasKit.FontWeight.ExtraLight, + canvasKit.FontWeight.Light, + canvasKit.FontWeight.Normal, + canvasKit.FontWeight.Medium, + canvasKit.FontWeight.SemiBold, + canvasKit.FontWeight.Bold, + canvasKit.FontWeight.ExtraBold, + canvasKit.FontWeight.ExtraBlack, ]; SkFontWeight toSkFontWeight(ui.FontWeight weight) { @@ -281,8 +194,8 @@ class SkAffinity { } final List _skAffinitys = [ - canvasKitJs.Affinity.Upstream, - canvasKitJs.Affinity.Downstream, + canvasKit.Affinity.Upstream, + canvasKit.Affinity.Downstream, ]; SkAffinity toSkAffinity(ui.TextAffinity affinity) { @@ -303,8 +216,8 @@ class SkTextDirection { // Flutter enumerates text directions as RTL, LTR, while CanvasKit // enumerates them LTR, RTL. final List _skTextDirections = [ - canvasKitJs.TextDirection.RTL, - canvasKitJs.TextDirection.LTR, + canvasKit.TextDirection.RTL, + canvasKit.TextDirection.LTR, ]; SkTextDirection toSkTextDirection(ui.TextDirection direction) { @@ -327,12 +240,12 @@ class SkTextAlign { } final List _skTextAligns = [ - canvasKitJs.TextAlign.Left, - canvasKitJs.TextAlign.Right, - canvasKitJs.TextAlign.Center, - canvasKitJs.TextAlign.Justify, - canvasKitJs.TextAlign.Start, - canvasKitJs.TextAlign.End, + canvasKit.TextAlign.Left, + canvasKit.TextAlign.Right, + canvasKit.TextAlign.Center, + canvasKit.TextAlign.Justify, + canvasKit.TextAlign.Start, + canvasKit.TextAlign.End, ]; SkTextAlign toSkTextAlign(ui.TextAlign align) { @@ -352,8 +265,8 @@ class SkRectHeightStyle { } final List _skRectHeightStyles = [ - canvasKitJs.RectHeightStyle.Tight, - canvasKitJs.RectHeightStyle.Max, + canvasKit.RectHeightStyle.Tight, + canvasKit.RectHeightStyle.Max, ]; SkRectHeightStyle toSkRectHeightStyle(ui.BoxHeightStyle style) { @@ -373,8 +286,8 @@ class SkRectWidthStyle { } final List _skRectWidthStyles = [ - canvasKitJs.RectWidthStyle.Tight, - canvasKitJs.RectWidthStyle.Max, + canvasKit.RectWidthStyle.Tight, + canvasKit.RectWidthStyle.Max, ]; SkRectWidthStyle toSkRectWidthStyle(ui.BoxWidthStyle style) { @@ -395,9 +308,9 @@ class SkVertexMode { } final List _skVertexModes = [ - canvasKitJs.VertexMode.Triangles, - canvasKitJs.VertexMode.TrianglesStrip, - canvasKitJs.VertexMode.TriangleFan, + canvasKit.VertexMode.Triangles, + canvasKit.VertexMode.TrianglesStrip, + canvasKit.VertexMode.TriangleFan, ]; SkVertexMode toSkVertexMode(ui.VertexMode mode) { @@ -417,9 +330,9 @@ class SkPointMode { } final List _skPointModes = [ - canvasKitJs.PointMode.Points, - canvasKitJs.PointMode.Lines, - canvasKitJs.PointMode.Polygon, + canvasKit.PointMode.Points, + canvasKit.PointMode.Lines, + canvasKit.PointMode.Polygon, ]; SkPointMode toSkPointMode(ui.PointMode mode) { @@ -438,8 +351,8 @@ class SkClipOp { } final List _skClipOps = [ - canvasKitJs.ClipOp.Difference, - canvasKitJs.ClipOp.Intersect, + canvasKit.ClipOp.Difference, + canvasKit.ClipOp.Intersect, ]; SkClipOp toSkClipOp(ui.ClipOp clipOp) { @@ -458,8 +371,8 @@ class SkFillType { } final List _skFillTypes = [ - canvasKitJs.FillType.Winding, - canvasKitJs.FillType.EvenOdd, + canvasKit.FillType.Winding, + canvasKit.FillType.EvenOdd, ]; SkFillType toSkFillType(ui.PathFillType fillType) { @@ -481,11 +394,11 @@ class SkPathOp { } final List _skPathOps = [ - canvasKitJs.PathOp.Difference, - canvasKitJs.PathOp.Intersect, - canvasKitJs.PathOp.Union, - canvasKitJs.PathOp.XOR, - canvasKitJs.PathOp.ReverseDifference, + canvasKit.PathOp.Difference, + canvasKit.PathOp.Intersect, + canvasKit.PathOp.Union, + canvasKit.PathOp.XOR, + canvasKit.PathOp.ReverseDifference, ]; SkPathOp toSkPathOp(ui.PathOperation pathOp) { @@ -506,10 +419,10 @@ class SkBlurStyle { } final List _skBlurStyles = [ - canvasKitJs.BlurStyle.Normal, - canvasKitJs.BlurStyle.Solid, - canvasKitJs.BlurStyle.Outer, - canvasKitJs.BlurStyle.Inner, + canvasKit.BlurStyle.Normal, + canvasKit.BlurStyle.Solid, + canvasKit.BlurStyle.Outer, + canvasKit.BlurStyle.Inner, ]; SkBlurStyle toSkBlurStyle(ui.BlurStyle style) { @@ -529,9 +442,9 @@ class SkStrokeCap { } final List _skStrokeCaps = [ - canvasKitJs.StrokeCap.Butt, - canvasKitJs.StrokeCap.Round, - canvasKitJs.StrokeCap.Square, + canvasKit.StrokeCap.Butt, + canvasKit.StrokeCap.Round, + canvasKit.StrokeCap.Square, ]; SkStrokeCap toSkStrokeCap(ui.StrokeCap strokeCap) { @@ -550,8 +463,8 @@ class SkPaintStyle { } final List _skPaintStyles = [ - canvasKitJs.PaintStyle.Fill, - canvasKitJs.PaintStyle.Stroke, + canvasKit.PaintStyle.Fill, + canvasKit.PaintStyle.Stroke, ]; SkPaintStyle toSkPaintStyle(ui.PaintingStyle paintStyle) { @@ -597,35 +510,35 @@ class SkBlendMode { } final List _skBlendModes = [ - canvasKitJs.BlendMode.Clear, - canvasKitJs.BlendMode.Src, - canvasKitJs.BlendMode.Dst, - canvasKitJs.BlendMode.SrcOver, - canvasKitJs.BlendMode.DstOver, - canvasKitJs.BlendMode.SrcIn, - canvasKitJs.BlendMode.DstIn, - canvasKitJs.BlendMode.SrcOut, - canvasKitJs.BlendMode.DstOut, - canvasKitJs.BlendMode.SrcATop, - canvasKitJs.BlendMode.DstATop, - canvasKitJs.BlendMode.Xor, - canvasKitJs.BlendMode.Plus, - canvasKitJs.BlendMode.Modulate, - canvasKitJs.BlendMode.Screen, - canvasKitJs.BlendMode.Overlay, - canvasKitJs.BlendMode.Darken, - canvasKitJs.BlendMode.Lighten, - canvasKitJs.BlendMode.ColorDodge, - canvasKitJs.BlendMode.ColorBurn, - canvasKitJs.BlendMode.HardLight, - canvasKitJs.BlendMode.SoftLight, - canvasKitJs.BlendMode.Difference, - canvasKitJs.BlendMode.Exclusion, - canvasKitJs.BlendMode.Multiply, - canvasKitJs.BlendMode.Hue, - canvasKitJs.BlendMode.Saturation, - canvasKitJs.BlendMode.Color, - canvasKitJs.BlendMode.Luminosity, + canvasKit.BlendMode.Clear, + canvasKit.BlendMode.Src, + canvasKit.BlendMode.Dst, + canvasKit.BlendMode.SrcOver, + canvasKit.BlendMode.DstOver, + canvasKit.BlendMode.SrcIn, + canvasKit.BlendMode.DstIn, + canvasKit.BlendMode.SrcOut, + canvasKit.BlendMode.DstOut, + canvasKit.BlendMode.SrcATop, + canvasKit.BlendMode.DstATop, + canvasKit.BlendMode.Xor, + canvasKit.BlendMode.Plus, + canvasKit.BlendMode.Modulate, + canvasKit.BlendMode.Screen, + canvasKit.BlendMode.Overlay, + canvasKit.BlendMode.Darken, + canvasKit.BlendMode.Lighten, + canvasKit.BlendMode.ColorDodge, + canvasKit.BlendMode.ColorBurn, + canvasKit.BlendMode.HardLight, + canvasKit.BlendMode.SoftLight, + canvasKit.BlendMode.Difference, + canvasKit.BlendMode.Exclusion, + canvasKit.BlendMode.Multiply, + canvasKit.BlendMode.Hue, + canvasKit.BlendMode.Saturation, + canvasKit.BlendMode.Color, + canvasKit.BlendMode.Luminosity, ]; SkBlendMode toSkBlendMode(ui.BlendMode blendMode) { @@ -645,9 +558,9 @@ class SkStrokeJoin { } final List _skStrokeJoins = [ - canvasKitJs.StrokeJoin.Miter, - canvasKitJs.StrokeJoin.Round, - canvasKitJs.StrokeJoin.Bevel, + canvasKit.StrokeJoin.Miter, + canvasKit.StrokeJoin.Round, + canvasKit.StrokeJoin.Bevel, ]; SkStrokeJoin toSkStrokeJoin(ui.StrokeJoin strokeJoin) { @@ -669,10 +582,10 @@ class SkFilterQuality { } final List _skFilterQualitys = [ - canvasKitJs.FilterQuality.None, - canvasKitJs.FilterQuality.Low, - canvasKitJs.FilterQuality.Medium, - canvasKitJs.FilterQuality.High, + canvasKit.FilterQuality.None, + canvasKit.FilterQuality.Low, + canvasKit.FilterQuality.Medium, + canvasKit.FilterQuality.High, ]; SkFilterQuality toSkFilterQuality(ui.FilterQuality filterQuality) { @@ -693,9 +606,9 @@ class SkTileMode { } final List _skTileModes = [ - canvasKitJs.TileMode.Clamp, - canvasKitJs.TileMode.Repeat, - canvasKitJs.TileMode.Mirror, + canvasKit.TileMode.Clamp, + canvasKit.TileMode.Repeat, + canvasKit.TileMode.Mirror, ]; SkTileMode toSkTileMode(ui.TileMode mode) { @@ -829,6 +742,13 @@ class SkImageFilter { external void delete(); } +// Mappings from SkMatrix-index to input-index. +const List _skMatrixIndexToMatrix4Index = [ + 0, 4, 12, // Row 1 + 1, 5, 13, // Row 2 + 3, 7, 15, // Row 3 +]; + /// Converts a 4x4 Flutter matrix (represented as a [Float32List]) to an /// SkMatrix, which is a 3x3 transform matrix. Float32List toSkMatrixFromFloat32(Float32List matrix4) { @@ -1445,12 +1365,12 @@ class SkCanvas { } @JS() -class SkCanvasSaveLayerWithoutBoundsOverride { +class SkCanvasSaveLayerWithoutBoundsOverload { external void saveLayer(SkPaint paint); } @JS() -class SkCanvasSaveLayerWithFilterOverride { +class SkCanvasSaveLayerWithFilterOverload { external void saveLayer( SkPaint? paint, SkImageFilter? imageFilter, @@ -1555,7 +1475,8 @@ class SkFontStyle { @JS() class SkFontMgr { - + external String? getFamilyName(int fontId); + external void delete(); } @JS() diff --git a/lib/web_ui/lib/src/engine/compositor/color_filter.dart b/lib/web_ui/lib/src/engine/compositor/color_filter.dart index ecdda8df0d781..8eea0028ed415 100644 --- a/lib/web_ui/lib/src/engine/compositor/color_filter.dart +++ b/lib/web_ui/lib/src/engine/compositor/color_filter.dart @@ -23,7 +23,7 @@ class CkColorFilter extends ResurrectableSkiaObject { SkColorFilter skColorFilter; switch (_engineFilter._type) { case EngineColorFilter._TypeMode: - skColorFilter = canvasKitJs.SkColorFilter.MakeBlend( + skColorFilter = canvasKit.SkColorFilter.MakeBlend( toSharedSkColor1(_engineFilter._color!), toSkBlendMode(_engineFilter._blendMode!), ); @@ -34,13 +34,13 @@ class CkColorFilter extends ResurrectableSkiaObject { for (int i = 0; i < 20; i++) { colorMatrix[i] = matrix[i]; } - skColorFilter = canvasKitJs.SkColorFilter.MakeMatrix(colorMatrix); + skColorFilter = canvasKit.SkColorFilter.MakeMatrix(colorMatrix); break; case EngineColorFilter._TypeLinearToSrgbGamma: - skColorFilter = canvasKitJs.SkColorFilter.MakeLinearToSRGBGamma(); + skColorFilter = canvasKit.SkColorFilter.MakeLinearToSRGBGamma(); break; case EngineColorFilter._TypeSrgbToLinearGamma: - skColorFilter = canvasKitJs.SkColorFilter.MakeSRGBToLinearGamma(); + skColorFilter = canvasKit.SkColorFilter.MakeSRGBToLinearGamma(); break; default: throw StateError( @@ -49,9 +49,6 @@ class CkColorFilter extends ResurrectableSkiaObject { return skColorFilter; } - @override - js.JsObject get legacySkiaObject => _jsObjectWrapper.wrapSkColorFilter(skiaObject); - @override SkColorFilter createDefault() { return _createSkiaObjectFromFilter(); diff --git a/lib/web_ui/lib/src/engine/compositor/fonts.dart b/lib/web_ui/lib/src/engine/compositor/fonts.dart index 48c414ea2c07b..25e359b4201a5 100644 --- a/lib/web_ui/lib/src/engine/compositor/fonts.dart +++ b/lib/web_ui/lib/src/engine/compositor/fonts.dart @@ -41,7 +41,7 @@ class SkiaFontCollection { final List fontBuffers = _registeredFonts.map((f) => f!.bytes).toList(); - skFontMgr = canvasKitJs.SkFontMgr.FromData(fontBuffers); + skFontMgr = canvasKit.SkFontMgr.FromData(fontBuffers); } /// Loads all of the unloaded fonts in [_unloadedFonts] and adds them @@ -164,10 +164,9 @@ class SkiaFontCollection { } String? _readActualFamilyName(Uint8List bytes) { - final js.JsObject tmpFontMgr = - canvasKit['SkFontMgr'].callMethod('FromData', [bytes]); - String? actualFamily = tmpFontMgr.callMethod('getFamilyName', [0]); - tmpFontMgr.callMethod('delete'); + final SkFontMgr tmpFontMgr = canvasKit.SkFontMgr.FromData([bytes])!; + String? actualFamily = tmpFontMgr.getFamilyName(0); + tmpFontMgr.delete(); return actualFamily; } diff --git a/lib/web_ui/lib/src/engine/compositor/image.dart b/lib/web_ui/lib/src/engine/compositor/image.dart index 2f66eefb7c15f..d49d2b073602d 100644 --- a/lib/web_ui/lib/src/engine/compositor/image.dart +++ b/lib/web_ui/lib/src/engine/compositor/image.dart @@ -8,7 +8,7 @@ part of engine; /// Instantiates a [ui.Codec] backed by an `SkImage` from Skia. void skiaInstantiateImageCodec(Uint8List list, Callback callback, [int? width, int? height, int? format, int? rowBytes]) { - final SkAnimatedImage skAnimatedImage = canvasKitJs.MakeAnimatedImageFromEncoded(list); + final SkAnimatedImage skAnimatedImage = canvasKit.MakeAnimatedImageFromEncoded(list); final CkAnimatedImage animatedImage = CkAnimatedImage(skAnimatedImage); final CkAnimatedImageCodec codec = CkAnimatedImageCodec(animatedImage); callback(codec); @@ -55,7 +55,6 @@ class CkAnimatedImage implements ui.Image { /// A [ui.Image] backed by an `SkImage` from Skia. class CkImage implements ui.Image { final SkImage skImage; - late final js.JsObject legacyJsObject = _jsObjectWrapper.wrapSkImage(skImage); CkImage(this.skImage); diff --git a/lib/web_ui/lib/src/engine/compositor/image_filter.dart b/lib/web_ui/lib/src/engine/compositor/image_filter.dart index 236443d5c0c44..79b46de1b76bf 100644 --- a/lib/web_ui/lib/src/engine/compositor/image_filter.dart +++ b/lib/web_ui/lib/src/engine/compositor/image_filter.dart @@ -26,14 +26,11 @@ class CkImageFilter extends ResurrectableSkiaObject implements ui rawSkiaObject?.delete(); } - @override - js.JsObject get legacySkiaObject => _jsObjectWrapper.wrapSkImageFilter(skiaObject); - SkImageFilter _initSkiaObject() { - return canvasKitJs.SkImageFilter.MakeBlur( + return canvasKit.SkImageFilter.MakeBlur( _sigmaX, _sigmaY, - canvasKitJs.TileMode.Clamp, + canvasKit.TileMode.Clamp, null, ); } diff --git a/lib/web_ui/lib/src/engine/compositor/initialization.dart b/lib/web_ui/lib/src/engine/compositor/initialization.dart index 4590b156b7978..997d482f2eda4 100644 --- a/lib/web_ui/lib/src/engine/compositor/initialization.dart +++ b/lib/web_ui/lib/src/engine/compositor/initialization.dart @@ -2,7 +2,6 @@ // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. - part of engine; /// EXPERIMENTAL: Enable the Skia-based rendering backend. @@ -20,26 +19,22 @@ const bool canvasKitForceCpuOnly = /// NPM, update this URL to `https://unpkg.com/canvaskit-wasm@0.34.0/bin/`. const String canvasKitBaseUrl = 'https://unpkg.com/canvaskit-wasm@0.16.2/bin/'; -/// Initialize the Skia backend. +/// Initialize CanvasKit. /// /// This calls `CanvasKitInit` and assigns the global [canvasKit] object. -Future initializeSkia() { +Future initializeCanvasKit() { final Completer canvasKitCompleter = Completer(); late StreamSubscription loadSubscription; loadSubscription = domRenderer.canvasKitScript!.onLoad.listen((_) { loadSubscription.cancel(); - final js.JsObject canvasKitInitArgs = js.JsObject.jsify({ - 'locateFile': (String file, String unusedBase) => canvasKitBaseUrl + file, - }); - final js.JsObject canvasKitInitPromise = - js.JsObject(js.context['CanvasKitInit'], [canvasKitInitArgs]); - canvasKitInitPromise.callMethod('then', [ - (js.JsObject ck) { - canvasKit = ck; - initializeCanvasKitBindings(canvasKit); - canvasKitCompleter.complete(); - }, - ]); + final CanvasKitInitPromise canvasKitInitPromise = CanvasKitInit(CanvasKitInitOptions( + locateFile: js.allowInterop((String file, String unusedBase) => canvasKitBaseUrl + file), + )); + canvasKitInitPromise.then(js.allowInterop((CanvasKit ck) { + canvasKit = ck; + windowFlutterCanvasKit = canvasKit; + canvasKitCompleter.complete(); + })); }); /// Add a Skia scene host. @@ -48,11 +43,6 @@ Future initializeSkia() { return canvasKitCompleter.future; } -/// The entrypoint into all CanvasKit functions and classes. -/// -/// This is created by [initializeSkia]. -late js.JsObject canvasKit; - /// The Skia font collection. SkiaFontCollection get skiaFontCollection => _skiaFontCollection!; SkiaFontCollection? _skiaFontCollection; diff --git a/lib/web_ui/lib/src/engine/compositor/mask_filter.dart b/lib/web_ui/lib/src/engine/compositor/mask_filter.dart index 967fe74403828..d2b3bfd1ef12f 100644 --- a/lib/web_ui/lib/src/engine/compositor/mask_filter.dart +++ b/lib/web_ui/lib/src/engine/compositor/mask_filter.dart @@ -20,16 +20,13 @@ class CkMaskFilter extends ResurrectableSkiaObject { SkMaskFilter resurrect() => _initSkiaObject(); SkMaskFilter _initSkiaObject() { - return canvasKitJs.MakeBlurMaskFilter( + return canvasKit.MakeBlurMaskFilter( toSkBlurStyle(_blurStyle), _sigma, true, ); } - @override - js.JsObject get legacySkiaObject => _jsObjectWrapper.wrapSkMaskFilter(skiaObject); - @override void delete() { rawSkiaObject?.delete(); diff --git a/lib/web_ui/lib/src/engine/compositor/painting.dart b/lib/web_ui/lib/src/engine/compositor/painting.dart index df3d6c6b10504..b80af8c036ee0 100644 --- a/lib/web_ui/lib/src/engine/compositor/painting.dart +++ b/lib/web_ui/lib/src/engine/compositor/painting.dart @@ -233,7 +233,4 @@ class CkPaint extends ResurrectableSkiaObject implements ui.Paint { void delete() { rawSkiaObject?.delete(); } - - @override - js.JsObject get legacySkiaObject => _jsObjectWrapper.wrapSkPaint(skiaObject); } diff --git a/lib/web_ui/lib/src/engine/compositor/path.dart b/lib/web_ui/lib/src/engine/compositor/path.dart index 70396c1d500cb..d3f6e34f1e23e 100644 --- a/lib/web_ui/lib/src/engine/compositor/path.dart +++ b/lib/web_ui/lib/src/engine/compositor/path.dart @@ -55,10 +55,10 @@ class CkPath implements ui.Path { void addPath(ui.Path path, ui.Offset offset, {Float64List? matrix4}) { List skMatrix; if (matrix4 == null) { - skMatrix = makeSkMatrixFromFloat32( + skMatrix = toSkMatrixFromFloat32( Matrix4.translationValues(offset.dx, offset.dy, 0.0).storage); } else { - skMatrix = makeSkMatrixFromFloat64(matrix4); + skMatrix = toSkMatrixFromFloat64(matrix4); skMatrix[2] += offset.dx; skMatrix[5] += offset.dy; } @@ -129,8 +129,7 @@ class CkPath implements ui.Path { double rotation = 0.0, bool largeArc = false, bool clockwise = true}) { - final SkPathArcToPointOverload overload = _jsObjectWrapper.castToSkPathArcToPointOverload(_skPath); - overload.arcTo( + (_skPath as SkPathArcToPointOverload).arcTo( radius.x, radius.y, rotation, @@ -171,10 +170,10 @@ class CkPath implements ui.Path { void extendWithPath(ui.Path path, ui.Offset offset, {Float64List? matrix4}) { List skMatrix; if (matrix4 == null) { - skMatrix = makeSkMatrixFromFloat32( + skMatrix = toSkMatrixFromFloat32( Matrix4.translationValues(offset.dx, offset.dy, 0.0).storage); } else { - skMatrix = makeSkMatrixFromFloat64(matrix4); + skMatrix = toSkMatrixFromFloat64(matrix4); skMatrix[2] += offset.dx; skMatrix[5] += offset.dy; } @@ -276,7 +275,7 @@ class CkPath implements ui.Path { ) { final CkPath path1 = uiPath1 as CkPath; final CkPath path2 = uiPath2 as CkPath; - final SkPath newPath = canvasKitJs.MakePathFromOp( + final SkPath newPath = canvasKit.MakePathFromOp( path1._skPath, path2._skPath, toSkPathOp(operation), diff --git a/lib/web_ui/lib/src/engine/compositor/picture.dart b/lib/web_ui/lib/src/engine/compositor/picture.dart index ad9405f99e240..9ab1ec55d0565 100644 --- a/lib/web_ui/lib/src/engine/compositor/picture.dart +++ b/lib/web_ui/lib/src/engine/compositor/picture.dart @@ -30,9 +30,6 @@ class CkPicture implements ui.Picture { class SkPictureSkiaObject extends OneShotSkiaObject { SkPictureSkiaObject(SkPicture picture) : super(picture); - @override - js.JsObject get legacySkiaObject => _jsObjectWrapper.wrapSkPicture(skiaObject); - @override void delete() { rawSkiaObject?.delete(); diff --git a/lib/web_ui/lib/src/engine/compositor/skia_object_cache.dart b/lib/web_ui/lib/src/engine/compositor/skia_object_cache.dart index 3d9708f2ce9cc..9fafbd3142daa 100644 --- a/lib/web_ui/lib/src/engine/compositor/skia_object_cache.dart +++ b/lib/web_ui/lib/src/engine/compositor/skia_object_cache.dart @@ -89,10 +89,6 @@ abstract class SkiaObject { /// The JavaScript object that's mapped onto a Skia C++ object in the WebAssembly heap. T get skiaObject; - /// The legacy view on the [skiaObject]. - // TODO(yjbanov): remove this after completing JS-interop migration. - js.JsObject? get legacySkiaObject; - /// Deletes the associated C++ object from the WebAssembly heap. void delete(); diff --git a/lib/web_ui/lib/src/engine/compositor/surface.dart b/lib/web_ui/lib/src/engine/compositor/surface.dart index aa478fa3f3a6a..e0047ca4c7068 100644 --- a/lib/web_ui/lib/src/engine/compositor/surface.dart +++ b/lib/web_ui/lib/src/engine/compositor/surface.dart @@ -38,7 +38,7 @@ class Surface { CkSurface? _surface; html.Element? htmlElement; - js.JsObject? _grContext; + SkGrContext? _grContext; int? _skiaCacheBytes; /// Specify the GPU resource cache limits. @@ -49,8 +49,7 @@ class Surface { void _syncCacheBytes() { if(_skiaCacheBytes != null) { - _grContext?.callMethod('setResourceCacheLimitBytes', [ - _skiaCacheBytes]); + _grContext?.setResourceCacheLimitBytes(_skiaCacheBytes!); } } @@ -67,7 +66,7 @@ class Surface { final CkSurface surface = acquireRenderSurface(size); if (surface.context != null) { - canvasKit.callMethod('setCurrentContext', [surface.context]); + canvasKit.setCurrentContext(surface.context!); } SubmitCallback submitCallback = (SurfaceFrame surfaceFrame, CkCanvas canvas) { @@ -127,19 +126,20 @@ class Surface { return _makeSoftwareCanvasSurface(htmlCanvas); } else { // Try WebGL first. - final int glContext = canvasKit.callMethod('GetWebGLContext', [ + final int glContext = canvasKit.GetWebGLContext( htmlCanvas, - // Default to no anti-aliasing. Paint commands can be explicitly - // anti-aliased by setting their `Paint` object's `antialias` property. - js.JsObject.jsify({'antialias': 0}), - ]); + SkWebGLContextOptions( + // Default to no anti-aliasing. Paint commands can be explicitly + // anti-aliased by setting their `Paint` object's `antialias` property. + anitalias: 0, + ), + ); if (glContext == 0) { return _makeSoftwareCanvasSurface(htmlCanvas); } - _grContext = - canvasKit.callMethod('MakeGrContext', [glContext]); + _grContext = canvasKit.MakeGrContext(glContext); if (_grContext == null) { throw CanvasKitError('Failed to initialize CanvasKit. CanvasKit.MakeGrContext returned null.'); @@ -149,13 +149,12 @@ class Surface { // CanvasKit's default. _syncCacheBytes(); - js.JsObject? skSurface = - canvasKit.callMethod('MakeOnScreenGLSurface', [ - _grContext, + SkSurface? skSurface = canvasKit.MakeOnScreenGLSurface( + _grContext!, size.width, size.height, - canvasKit['SkColorSpace']['SRGB'], - ]); + SkColorSpaceSRGB, + ); if (skSurface == null) { return _makeSoftwareCanvasSurface(htmlCanvas); @@ -173,9 +172,7 @@ class Surface { _didWarnAboutWebGlInitializationFailure = true; } return CkSurface( - canvasKit.callMethod('MakeSWCanvasSurface', [ - htmlCanvas, - ]), + canvasKit.MakeSWCanvasSurface(htmlCanvas), null, null, ); @@ -183,7 +180,7 @@ class Surface { bool _presentSurface() { if (_surface!.context != null) { - canvasKit.callMethod('setCurrentContext', [_surface!.context]); + canvasKit.setCurrentContext(_surface!.context!); } _surface!.flush(); return true; @@ -192,28 +189,25 @@ class Surface { /// A Dart wrapper around Skia's CkSurface. class CkSurface { - final js.JsObject _surface; - final js.JsObject? _grContext; + final SkSurface _surface; + final SkGrContext? _grContext; final int? _glContext; CkSurface(this._surface, this._grContext, this._glContext); CkCanvas getCanvas() { - final js.JsObject skCanvas = _surface.callMethod('getCanvas'); - return CkCanvas( - _jsObjectWrapper.unwrapSkCanvas(skCanvas), - ); + return CkCanvas(_surface.getCanvas()); } /// Flushes the graphics to be rendered on screen. void flush() { - _surface.callMethod('flush'); + _surface.flush(); } int? get context => _glContext; - int width() => _surface.callMethod('width'); - int height() => _surface.callMethod('height'); + int width() => _surface.width(); + int height() => _surface.height(); void dispose() { if (_isDisposed) { @@ -221,14 +215,14 @@ class CkSurface { } // Only resources from the current context can be disposed. if (_glContext != null) { - canvasKit.callMethod('setCurrentContext', [_glContext]); + canvasKit.setCurrentContext(_glContext!); } - _surface.callMethod('dispose'); + _surface.dispose(); // In CPU-only mode there's no graphics context. if (_grContext != null) { - _grContext!.callMethod('releaseResourcesAndAbandonContext'); - _grContext!.callMethod('delete'); + _grContext!.releaseResourcesAndAbandonContext(); + _grContext!.delete(); } _isDisposed = true; } diff --git a/lib/web_ui/lib/src/engine/compositor/text.dart b/lib/web_ui/lib/src/engine/compositor/text.dart index 149e2fa6c87f4..5c2a1e3c31e5b 100644 --- a/lib/web_ui/lib/src/engine/compositor/text.dart +++ b/lib/web_ui/lib/src/engine/compositor/text.dart @@ -107,7 +107,7 @@ class CkParagraphStyle implements ui.ParagraphStyle { properties.textStyle = toSkTextStyleProperties(fontFamily, fontSize, fontWeight, fontStyle); - return canvasKitJs.ParagraphStyle(properties); + return canvasKit.ParagraphStyle(properties); } } @@ -146,15 +146,15 @@ class CkTextStyle implements ui.TextStyle { } if (decoration != null) { - int decorationValue = canvasKitJs.NoDecoration; + int decorationValue = canvasKit.NoDecoration; if (decoration.contains(ui.TextDecoration.underline)) { - decorationValue |= canvasKitJs.UnderlineDecoration; + decorationValue |= canvasKit.UnderlineDecoration; } if (decoration.contains(ui.TextDecoration.overline)) { - decorationValue |= canvasKitJs.OverlineDecoration; + decorationValue |= canvasKit.OverlineDecoration; } if (decoration.contains(ui.TextDecoration.lineThrough)) { - decorationValue |= canvasKitJs.LineThroughDecoration; + decorationValue |= canvasKit.LineThroughDecoration; } properties.decoration = decorationValue; } @@ -201,7 +201,7 @@ class CkTextStyle implements ui.TextStyle { // - locale // - shadows // - fontFeatures - return CkTextStyle._(canvasKitJs.TextStyle(properties)); + return CkTextStyle._(canvasKit.TextStyle(properties)); } CkTextStyle._(this.skTextStyle); @@ -280,9 +280,6 @@ class CkParagraph extends ResurrectableSkiaObject implements ui.Par rawSkiaObject?.delete(); } - @override - js.JsObject get legacySkiaObject => _jsObjectWrapper.wrapSkParagraph(skiaObject); - @override bool get isResurrectionExpensive => true; @@ -416,7 +413,7 @@ class CkParagraphBuilder implements ui.ParagraphBuilder { CkParagraphBuilder(ui.ParagraphStyle style) : _commands = <_ParagraphCommand>[], _style = style as CkParagraphStyle, - _paragraphBuilder = canvasKitJs.ParagraphBuilder.Make( + _paragraphBuilder = canvasKit.ParagraphBuilder.Make( style.skParagraphStyle, skiaFontCollection.skFontMgr, ); diff --git a/lib/web_ui/lib/src/engine/compositor/util.dart b/lib/web_ui/lib/src/engine/compositor/util.dart index 5a72cef3183ef..ddbcbd3a7148c 100644 --- a/lib/web_ui/lib/src/engine/compositor/util.dart +++ b/lib/web_ui/lib/src/engine/compositor/util.dart @@ -15,44 +15,6 @@ class CanvasKitError extends Error { String toString() => 'CanvasKitError: $message'; } -js.JsObject _mallocColorArray() { - return canvasKit - .callMethod('Malloc', [js.context['Float32Array'], 4]); -} - -js.JsObject? sharedSkColor1; -js.JsObject? sharedSkColor2; -js.JsObject? sharedSkColor3; - -void _setSharedColor(js.JsObject sharedColor, ui.Color color) { - Float32List array = sharedColor.callMethod('toTypedArray'); - array[0] = color.red / 255.0; - array[1] = color.green / 255.0; - array[2] = color.blue / 255.0; - array[3] = color.alpha / 255.0; -} - -void setSharedSkColor1(ui.Color color) { - if (sharedSkColor1 == null) { - sharedSkColor1 = _mallocColorArray(); - } - _setSharedColor(sharedSkColor1!, color); -} - -void setSharedSkColor2(ui.Color color) { - if (sharedSkColor2 == null) { - sharedSkColor2 = _mallocColorArray(); - } - _setSharedColor(sharedSkColor2!, color); -} - -void setSharedSkColor3(ui.Color color) { - if (sharedSkColor3 == null) { - sharedSkColor3 = _mallocColorArray(); - } - _setSharedColor(sharedSkColor3!, color); -} - /// Creates a new color array. Float32List makeFreshSkColor(ui.Color color) { final Float32List result = Float32List(4); @@ -63,34 +25,6 @@ Float32List makeFreshSkColor(ui.Color color) { return result; } -js.JsObject makeSkRect(ui.Rect rect) { - return js.JsObject(canvasKit['LTRBRect'], - [rect.left, rect.top, rect.right, rect.bottom]); -} - -js.JsObject makeSkRRect(ui.RRect rrect) { - return js.JsObject.jsify({ - 'rect': makeSkRect(rrect.outerRect), - 'rx1': rrect.tlRadiusX, - 'ry1': rrect.tlRadiusY, - 'rx2': rrect.trRadiusX, - 'ry2': rrect.trRadiusY, - 'rx3': rrect.brRadiusX, - 'ry3': rrect.brRadiusY, - 'rx4': rrect.blRadiusX, - 'ry4': rrect.blRadiusY, - }); -} - -ui.Rect fromSkRect(js.JsObject skRect) { - return ui.Rect.fromLTRB( - skRect['fLeft'], - skRect['fTop'], - skRect['fRight'], - skRect['fBottom'], - ); -} - ui.TextPosition fromPositionWithAffinity(SkTextPosition positionWithAffinity) { final ui.TextAffinity affinity = ui.TextAffinity.values[positionWithAffinity.affinity.value]; return ui.TextPosition( @@ -99,194 +33,6 @@ ui.TextPosition fromPositionWithAffinity(SkTextPosition positionWithAffinity) { ); } -js.JsArray makeSkPoint(ui.Offset point) { - final js.JsArray skPoint = js.JsArray(); - skPoint.length = 2; - skPoint[0] = point.dx; - skPoint[1] = point.dy; - return skPoint; -} - -// TODO(hterkelsen): https://github.com/flutter/flutter/issues/58824 -/// Creates a point list using a 2D JS array. -js.JsArray>? encodePointList(List? points) { - if (points == null) { - return null; - } - final int pointCount = points.length; - final js.JsArray> result = - js.JsArray>(); - result.length = pointCount; - for (int i = 0; i < pointCount; ++i) { - final ui.Offset point = points[i]; - assert(_offsetIsValid(point)); - final js.JsArray skPoint = js.JsArray(); - skPoint.length = 2; - skPoint[0] = point.dx; - skPoint[1] = point.dy; - result[i] = skPoint; - } - return result; -} - -// TODO(hterkelsen): https://github.com/flutter/flutter/issues/58824 -/// Creates a point list using a 2D JS array. -List>? encodeRawPointList(Float32List? points) { - if (points == null) { - return null; - } - assert(points.length % 2 == 0); - var pointLength = points.length ~/ 2; - final js.JsArray> result = - js.JsArray>(); - result.length = pointLength; - for (var i = 0; i < pointLength; i++) { - var x = i * 2; - var y = x + 1; - final js.JsArray skPoint = js.JsArray(); - skPoint.length = 2; - skPoint[0] = points[x]; - skPoint[1] = points[y]; - result[i] = skPoint; - } - return result; -} - -js.JsObject? makeSkPointMode(ui.PointMode pointMode) { - switch (pointMode) { - case ui.PointMode.points: - return canvasKit['PointMode']['Points']; - case ui.PointMode.lines: - return canvasKit['PointMode']['Lines']; - case ui.PointMode.polygon: - return canvasKit['PointMode']['Polygon']; - default: - throw StateError('Unrecognized point mode $pointMode'); - } -} - -js.JsObject? makeSkBlendMode(ui.BlendMode? blendMode) { - switch (blendMode) { - case ui.BlendMode.clear: - return canvasKit['BlendMode']['Clear']; - case ui.BlendMode.src: - return canvasKit['BlendMode']['Src']; - case ui.BlendMode.dst: - return canvasKit['BlendMode']['Dst']; - case ui.BlendMode.srcOver: - return canvasKit['BlendMode']['SrcOver']; - case ui.BlendMode.dstOver: - return canvasKit['BlendMode']['DstOver']; - case ui.BlendMode.srcIn: - return canvasKit['BlendMode']['SrcIn']; - case ui.BlendMode.dstIn: - return canvasKit['BlendMode']['DstIn']; - case ui.BlendMode.srcOut: - return canvasKit['BlendMode']['SrcOut']; - case ui.BlendMode.dstOut: - return canvasKit['BlendMode']['DstOut']; - case ui.BlendMode.srcATop: - return canvasKit['BlendMode']['SrcATop']; - case ui.BlendMode.dstATop: - return canvasKit['BlendMode']['DstATop']; - case ui.BlendMode.xor: - return canvasKit['BlendMode']['Xor']; - case ui.BlendMode.plus: - return canvasKit['BlendMode']['Plus']; - case ui.BlendMode.modulate: - return canvasKit['BlendMode']['Modulate']; - case ui.BlendMode.screen: - return canvasKit['BlendMode']['Screen']; - case ui.BlendMode.overlay: - return canvasKit['BlendMode']['Overlay']; - case ui.BlendMode.darken: - return canvasKit['BlendMode']['Darken']; - case ui.BlendMode.lighten: - return canvasKit['BlendMode']['Lighten']; - case ui.BlendMode.colorDodge: - return canvasKit['BlendMode']['ColorDodge']; - case ui.BlendMode.colorBurn: - return canvasKit['BlendMode']['ColorBurn']; - case ui.BlendMode.hardLight: - return canvasKit['BlendMode']['HardLight']; - case ui.BlendMode.softLight: - return canvasKit['BlendMode']['SoftLight']; - case ui.BlendMode.difference: - return canvasKit['BlendMode']['Difference']; - case ui.BlendMode.exclusion: - return canvasKit['BlendMode']['Exclusion']; - case ui.BlendMode.multiply: - return canvasKit['BlendMode']['Multiply']; - case ui.BlendMode.hue: - return canvasKit['BlendMode']['Hue']; - case ui.BlendMode.saturation: - return canvasKit['BlendMode']['Saturation']; - case ui.BlendMode.color: - return canvasKit['BlendMode']['Color']; - case ui.BlendMode.luminosity: - return canvasKit['BlendMode']['Luminosity']; - default: - return null; - } -} - -// Mappings from SkMatrix-index to input-index. -const List _skMatrixIndexToMatrix4Index = [ - 0, 4, 12, // Row 1 - 1, 5, 13, // Row 2 - 3, 7, 15, // Row 3 -]; - -/// Converts a 4x4 Flutter matrix (represented as a [Float32List]) to an -/// SkMatrix, which is a 3x3 transform matrix. -js.JsArray makeSkMatrixFromFloat32(Float32List? matrix4) { - final js.JsArray skMatrix = js.JsArray(); - skMatrix.length = 9; - for (int i = 0; i < 9; ++i) { - final int matrix4Index = _skMatrixIndexToMatrix4Index[i]; - if (matrix4Index < matrix4!.length) - skMatrix[i] = matrix4[matrix4Index]; - else - skMatrix[i] = 0.0; - } - return skMatrix; -} - -js.JsArray makeSkMatrixFromFloat64(Float64List matrix4) { - final js.JsArray skMatrix = js.JsArray(); - skMatrix.length = 9; - for (int i = 0; i < 9; ++i) { - final int matrix4Index = _skMatrixIndexToMatrix4Index[i]; - if (matrix4Index < matrix4.length) - skMatrix[i] = matrix4[matrix4Index]; - else - skMatrix[i] = 0.0; - } - return skMatrix; -} - -/// Color stops used when the framework specifies `null`. -final js.JsArray _kDefaultColorStops = () { - final js.JsArray jsColorStops = js.JsArray(); - jsColorStops.length = 2; - jsColorStops[0] = 0; - jsColorStops[1] = 1; - return jsColorStops; -}(); - -/// Converts a list of color stops into a Skia-compatible JS array or color stops. -/// -/// In Flutter `null` means two color stops `[0, 1]` that in Skia must be specified explicitly. -js.JsArray makeSkiaColorStops(List? colorStops) { - if (colorStops == null) { - return _kDefaultColorStops; - } - - final js.JsArray jsColorStops = js.JsArray.from(colorStops); - jsColorStops.length = colorStops.length; - return jsColorStops; -} - void drawSkShadow( SkCanvas skCanvas, CkPath path, @@ -313,7 +59,7 @@ void drawSkShadow( ); final SkTonalColors tonalColors = - canvasKitJs.computeTonalColors(inTonalColors); + canvasKit.computeTonalColors(inTonalColors); skCanvas.drawShadow( path._skPath, diff --git a/lib/web_ui/lib/src/engine/compositor/vertices.dart b/lib/web_ui/lib/src/engine/compositor/vertices.dart index e50f8efaa7a08..ed054426205b5 100644 --- a/lib/web_ui/lib/src/engine/compositor/vertices.dart +++ b/lib/web_ui/lib/src/engine/compositor/vertices.dart @@ -27,7 +27,7 @@ class CkVertices implements ui.Vertices { throw ArgumentError( '"indices" values must be valid indices in the positions list.'); - skVertices = canvasKitJs.MakeSkVertices( + skVertices = canvasKit.MakeSkVertices( toSkVertexMode(mode), toSkPoints2d(positions), textureCoordinates != null ? toSkPoints2d(textureCoordinates) : null, @@ -55,7 +55,7 @@ class CkVertices implements ui.Vertices { throw ArgumentError( '"indices" values must be valid indices in the positions list.'); - skVertices = canvasKitJs.MakeSkVertices( + skVertices = canvasKit.MakeSkVertices( toSkVertexMode(mode), rawPointsToSkPoints2d(positions), textureCoordinates != null ? rawPointsToSkPoints2d(textureCoordinates) : null, diff --git a/lib/web_ui/lib/src/engine/shader.dart b/lib/web_ui/lib/src/engine/shader.dart index 41d66e02fe249..eb3809a592d37 100644 --- a/lib/web_ui/lib/src/engine/shader.dart +++ b/lib/web_ui/lib/src/engine/shader.dart @@ -158,7 +158,7 @@ class GradientLinear extends EngineGradient { SkShader createSkiaShader() { assert(experimentalUseSkia); - return canvasKitJs.SkShader.MakeLinearGradient( + return canvasKit.SkShader.MakeLinearGradient( toSkPoint(from), toSkPoint(to), toSkFloatColorList(colors), @@ -212,7 +212,7 @@ class GradientRadial extends EngineGradient { SkShader createSkiaShader() { assert(experimentalUseSkia); - return canvasKitJs.SkShader.MakeRadialGradient( + return canvasKit.SkShader.MakeRadialGradient( toSkPoint(center), radius, toSkFloatColorList(colors), @@ -246,7 +246,7 @@ class GradientConical extends EngineGradient { @override SkShader createSkiaShader() { assert(experimentalUseSkia); - return canvasKitJs.SkShader.MakeTwoPointConicalGradient( + return canvasKit.SkShader.MakeTwoPointConicalGradient( toSkPoint(focal), focalRadius, toSkPoint(center), diff --git a/lib/web_ui/lib/src/ui/initialization.dart b/lib/web_ui/lib/src/ui/initialization.dart index 9fa6810f25e8e..2749fa9e58e36 100644 --- a/lib/web_ui/lib/src/ui/initialization.dart +++ b/lib/web_ui/lib/src/ui/initialization.dart @@ -31,7 +31,7 @@ Future _initializePlatform({ // This needs to be after `webOnlyInitializeEngine` because that is where the // canvaskit script is added to the page. if (engine.experimentalUseSkia) { - await engine.initializeSkia(); + await engine.initializeCanvasKit(); } assetManager ??= const engine.AssetManager(); diff --git a/lib/web_ui/test/canvaskit/canvaskit_api_test.dart b/lib/web_ui/test/canvaskit/canvaskit_api_test.dart index d5d9a333215e5..4787834f19899 100644 --- a/lib/web_ui/test/canvaskit/canvaskit_api_test.dart +++ b/lib/web_ui/test/canvaskit/canvaskit_api_test.dart @@ -59,35 +59,35 @@ void main() { void _blendModeTests() { test('blend mode mapping is correct', () { - expect(canvasKitJs.BlendMode.Clear.value, ui.BlendMode.clear.index); - expect(canvasKitJs.BlendMode.Src.value, ui.BlendMode.src.index); - expect(canvasKitJs.BlendMode.Dst.value, ui.BlendMode.dst.index); - expect(canvasKitJs.BlendMode.SrcOver.value, ui.BlendMode.srcOver.index); - expect(canvasKitJs.BlendMode.DstOver.value, ui.BlendMode.dstOver.index); - expect(canvasKitJs.BlendMode.SrcIn.value, ui.BlendMode.srcIn.index); - expect(canvasKitJs.BlendMode.DstIn.value, ui.BlendMode.dstIn.index); - expect(canvasKitJs.BlendMode.SrcOut.value, ui.BlendMode.srcOut.index); - expect(canvasKitJs.BlendMode.DstOut.value, ui.BlendMode.dstOut.index); - expect(canvasKitJs.BlendMode.SrcATop.value, ui.BlendMode.srcATop.index); - expect(canvasKitJs.BlendMode.DstATop.value, ui.BlendMode.dstATop.index); - expect(canvasKitJs.BlendMode.Xor.value, ui.BlendMode.xor.index); - expect(canvasKitJs.BlendMode.Plus.value, ui.BlendMode.plus.index); - expect(canvasKitJs.BlendMode.Modulate.value, ui.BlendMode.modulate.index); - expect(canvasKitJs.BlendMode.Screen.value, ui.BlendMode.screen.index); - expect(canvasKitJs.BlendMode.Overlay.value, ui.BlendMode.overlay.index); - expect(canvasKitJs.BlendMode.Darken.value, ui.BlendMode.darken.index); - expect(canvasKitJs.BlendMode.Lighten.value, ui.BlendMode.lighten.index); - expect(canvasKitJs.BlendMode.ColorDodge.value, ui.BlendMode.colorDodge.index); - expect(canvasKitJs.BlendMode.ColorBurn.value, ui.BlendMode.colorBurn.index); - expect(canvasKitJs.BlendMode.HardLight.value, ui.BlendMode.hardLight.index); - expect(canvasKitJs.BlendMode.SoftLight.value, ui.BlendMode.softLight.index); - expect(canvasKitJs.BlendMode.Difference.value, ui.BlendMode.difference.index); - expect(canvasKitJs.BlendMode.Exclusion.value, ui.BlendMode.exclusion.index); - expect(canvasKitJs.BlendMode.Multiply.value, ui.BlendMode.multiply.index); - expect(canvasKitJs.BlendMode.Hue.value, ui.BlendMode.hue.index); - expect(canvasKitJs.BlendMode.Saturation.value, ui.BlendMode.saturation.index); - expect(canvasKitJs.BlendMode.Color.value, ui.BlendMode.color.index); - expect(canvasKitJs.BlendMode.Luminosity.value, ui.BlendMode.luminosity.index); + expect(canvasKit.BlendMode.Clear.value, ui.BlendMode.clear.index); + expect(canvasKit.BlendMode.Src.value, ui.BlendMode.src.index); + expect(canvasKit.BlendMode.Dst.value, ui.BlendMode.dst.index); + expect(canvasKit.BlendMode.SrcOver.value, ui.BlendMode.srcOver.index); + expect(canvasKit.BlendMode.DstOver.value, ui.BlendMode.dstOver.index); + expect(canvasKit.BlendMode.SrcIn.value, ui.BlendMode.srcIn.index); + expect(canvasKit.BlendMode.DstIn.value, ui.BlendMode.dstIn.index); + expect(canvasKit.BlendMode.SrcOut.value, ui.BlendMode.srcOut.index); + expect(canvasKit.BlendMode.DstOut.value, ui.BlendMode.dstOut.index); + expect(canvasKit.BlendMode.SrcATop.value, ui.BlendMode.srcATop.index); + expect(canvasKit.BlendMode.DstATop.value, ui.BlendMode.dstATop.index); + expect(canvasKit.BlendMode.Xor.value, ui.BlendMode.xor.index); + expect(canvasKit.BlendMode.Plus.value, ui.BlendMode.plus.index); + expect(canvasKit.BlendMode.Modulate.value, ui.BlendMode.modulate.index); + expect(canvasKit.BlendMode.Screen.value, ui.BlendMode.screen.index); + expect(canvasKit.BlendMode.Overlay.value, ui.BlendMode.overlay.index); + expect(canvasKit.BlendMode.Darken.value, ui.BlendMode.darken.index); + expect(canvasKit.BlendMode.Lighten.value, ui.BlendMode.lighten.index); + expect(canvasKit.BlendMode.ColorDodge.value, ui.BlendMode.colorDodge.index); + expect(canvasKit.BlendMode.ColorBurn.value, ui.BlendMode.colorBurn.index); + expect(canvasKit.BlendMode.HardLight.value, ui.BlendMode.hardLight.index); + expect(canvasKit.BlendMode.SoftLight.value, ui.BlendMode.softLight.index); + expect(canvasKit.BlendMode.Difference.value, ui.BlendMode.difference.index); + expect(canvasKit.BlendMode.Exclusion.value, ui.BlendMode.exclusion.index); + expect(canvasKit.BlendMode.Multiply.value, ui.BlendMode.multiply.index); + expect(canvasKit.BlendMode.Hue.value, ui.BlendMode.hue.index); + expect(canvasKit.BlendMode.Saturation.value, ui.BlendMode.saturation.index); + expect(canvasKit.BlendMode.Color.value, ui.BlendMode.color.index); + expect(canvasKit.BlendMode.Luminosity.value, ui.BlendMode.luminosity.index); }); test('ui.BlendMode converts to SkBlendMode', () { @@ -99,8 +99,8 @@ void _blendModeTests() { void _paintStyleTests() { test('paint style mapping is correct', () { - expect(canvasKitJs.PaintStyle.Fill.value, ui.PaintingStyle.fill.index); - expect(canvasKitJs.PaintStyle.Stroke.value, ui.PaintingStyle.stroke.index); + expect(canvasKit.PaintStyle.Fill.value, ui.PaintingStyle.fill.index); + expect(canvasKit.PaintStyle.Stroke.value, ui.PaintingStyle.stroke.index); }); test('ui.PaintingStyle converts to SkPaintStyle', () { @@ -112,9 +112,9 @@ void _paintStyleTests() { void _strokeCapTests() { test('stroke cap mapping is correct', () { - expect(canvasKitJs.StrokeCap.Butt.value, ui.StrokeCap.butt.index); - expect(canvasKitJs.StrokeCap.Round.value, ui.StrokeCap.round.index); - expect(canvasKitJs.StrokeCap.Square.value, ui.StrokeCap.square.index); + expect(canvasKit.StrokeCap.Butt.value, ui.StrokeCap.butt.index); + expect(canvasKit.StrokeCap.Round.value, ui.StrokeCap.round.index); + expect(canvasKit.StrokeCap.Square.value, ui.StrokeCap.square.index); }); test('ui.StrokeCap converts to SkStrokeCap', () { @@ -126,9 +126,9 @@ void _strokeCapTests() { void _strokeJoinTests() { test('stroke cap mapping is correct', () { - expect(canvasKitJs.StrokeJoin.Miter.value, ui.StrokeJoin.miter.index); - expect(canvasKitJs.StrokeJoin.Round.value, ui.StrokeJoin.round.index); - expect(canvasKitJs.StrokeJoin.Bevel.value, ui.StrokeJoin.bevel.index); + expect(canvasKit.StrokeJoin.Miter.value, ui.StrokeJoin.miter.index); + expect(canvasKit.StrokeJoin.Round.value, ui.StrokeJoin.round.index); + expect(canvasKit.StrokeJoin.Bevel.value, ui.StrokeJoin.bevel.index); }); test('ui.StrokeJoin converts to SkStrokeJoin', () { @@ -140,10 +140,10 @@ void _strokeJoinTests() { void _filterQualityTests() { test('filter quality mapping is correct', () { - expect(canvasKitJs.FilterQuality.None.value, ui.FilterQuality.none.index); - expect(canvasKitJs.FilterQuality.Low.value, ui.FilterQuality.low.index); - expect(canvasKitJs.FilterQuality.Medium.value, ui.FilterQuality.medium.index); - expect(canvasKitJs.FilterQuality.High.value, ui.FilterQuality.high.index); + expect(canvasKit.FilterQuality.None.value, ui.FilterQuality.none.index); + expect(canvasKit.FilterQuality.Low.value, ui.FilterQuality.low.index); + expect(canvasKit.FilterQuality.Medium.value, ui.FilterQuality.medium.index); + expect(canvasKit.FilterQuality.High.value, ui.FilterQuality.high.index); }); test('ui.FilterQuality converts to SkFilterQuality', () { @@ -155,10 +155,10 @@ void _filterQualityTests() { void _blurStyleTests() { test('blur style mapping is correct', () { - expect(canvasKitJs.BlurStyle.Normal.value, ui.BlurStyle.normal.index); - expect(canvasKitJs.BlurStyle.Solid.value, ui.BlurStyle.solid.index); - expect(canvasKitJs.BlurStyle.Outer.value, ui.BlurStyle.outer.index); - expect(canvasKitJs.BlurStyle.Inner.value, ui.BlurStyle.inner.index); + expect(canvasKit.BlurStyle.Normal.value, ui.BlurStyle.normal.index); + expect(canvasKit.BlurStyle.Solid.value, ui.BlurStyle.solid.index); + expect(canvasKit.BlurStyle.Outer.value, ui.BlurStyle.outer.index); + expect(canvasKit.BlurStyle.Inner.value, ui.BlurStyle.inner.index); }); test('ui.BlurStyle converts to SkBlurStyle', () { @@ -170,9 +170,9 @@ void _blurStyleTests() { void _tileModeTests() { test('tile mode mapping is correct', () { - expect(canvasKitJs.TileMode.Clamp.value, ui.TileMode.clamp.index); - expect(canvasKitJs.TileMode.Repeat.value, ui.TileMode.repeated.index); - expect(canvasKitJs.TileMode.Mirror.value, ui.TileMode.mirror.index); + expect(canvasKit.TileMode.Clamp.value, ui.TileMode.clamp.index); + expect(canvasKit.TileMode.Repeat.value, ui.TileMode.repeated.index); + expect(canvasKit.TileMode.Mirror.value, ui.TileMode.mirror.index); }); test('ui.TileMode converts to SkTileMode', () { @@ -184,8 +184,8 @@ void _tileModeTests() { void _fillTypeTests() { test('fill type mapping is correct', () { - expect(canvasKitJs.FillType.Winding.value, ui.PathFillType.nonZero.index); - expect(canvasKitJs.FillType.EvenOdd.value, ui.PathFillType.evenOdd.index); + expect(canvasKit.FillType.Winding.value, ui.PathFillType.nonZero.index); + expect(canvasKit.FillType.EvenOdd.value, ui.PathFillType.evenOdd.index); }); test('ui.PathFillType converts to SkFillType', () { @@ -198,11 +198,11 @@ void _fillTypeTests() { void _pathOpTests() { // TODO(yjbanov): https://github.com/flutter/flutter/issues/61403 // test('path op mapping is correct', () { - // expect(canvasKitJs.PathOp.Difference.value, ui.PathOperation.difference.index); - // expect(canvasKitJs.PathOp.Intersect.value, ui.PathOperation.intersect.index); - // expect(canvasKitJs.PathOp.Union.value, ui.PathOperation.union.index); - // expect(canvasKitJs.PathOp.XOR.value, ui.PathOperation.xor.index); - // expect(canvasKitJs.PathOp.ReverseDifference, ui.PathOperation.reverseDifference.index); + // expect(canvasKit.PathOp.Difference.value, ui.PathOperation.difference.index); + // expect(canvasKit.PathOp.Intersect.value, ui.PathOperation.intersect.index); + // expect(canvasKit.PathOp.Union.value, ui.PathOperation.union.index); + // expect(canvasKit.PathOp.XOR.value, ui.PathOperation.xor.index); + // expect(canvasKit.PathOp.ReverseDifference, ui.PathOperation.reverseDifference.index); // }); // test('ui.PathOperation converts to SkPathOp', () { @@ -214,8 +214,8 @@ void _pathOpTests() { void _clipOpTests() { test('clip op mapping is correct', () { - expect(canvasKitJs.ClipOp.Difference.value, ui.ClipOp.difference.index); - expect(canvasKitJs.ClipOp.Intersect.value, ui.ClipOp.intersect.index); + expect(canvasKit.ClipOp.Difference.value, ui.ClipOp.difference.index); + expect(canvasKit.ClipOp.Intersect.value, ui.ClipOp.intersect.index); }); test('ui.ClipOp converts to SkClipOp', () { @@ -227,9 +227,9 @@ void _clipOpTests() { void _pointModeTests() { test('point mode mapping is correct', () { - expect(canvasKitJs.PointMode.Points.value, ui.PointMode.points.index); - expect(canvasKitJs.PointMode.Lines.value, ui.PointMode.lines.index); - expect(canvasKitJs.PointMode.Polygon.value, ui.PointMode.polygon.index); + expect(canvasKit.PointMode.Points.value, ui.PointMode.points.index); + expect(canvasKit.PointMode.Lines.value, ui.PointMode.lines.index); + expect(canvasKit.PointMode.Polygon.value, ui.PointMode.polygon.index); }); test('ui.PointMode converts to SkPointMode', () { @@ -241,9 +241,9 @@ void _pointModeTests() { void _vertexModeTests() { test('vertex mode mapping is correct', () { - expect(canvasKitJs.VertexMode.Triangles.value, ui.VertexMode.triangles.index); - expect(canvasKitJs.VertexMode.TrianglesStrip.value, ui.VertexMode.triangleStrip.index); - expect(canvasKitJs.VertexMode.TriangleFan.value, ui.VertexMode.triangleFan.index); + expect(canvasKit.VertexMode.Triangles.value, ui.VertexMode.triangles.index); + expect(canvasKit.VertexMode.TrianglesStrip.value, ui.VertexMode.triangleStrip.index); + expect(canvasKit.VertexMode.TriangleFan.value, ui.VertexMode.triangleFan.index); }); test('ui.VertexMode converts to SkVertexMode', () { @@ -255,7 +255,7 @@ void _vertexModeTests() { void _imageTests() { test('MakeAnimatedImageFromEncoded makes a non-animated image', () { - final SkAnimatedImage nonAnimated = canvasKitJs.MakeAnimatedImageFromEncoded(kTransparentImage); + final SkAnimatedImage nonAnimated = canvasKit.MakeAnimatedImageFromEncoded(kTransparentImage); expect(nonAnimated.getFrameCount(), 1); expect(nonAnimated.getRepetitionCount(), 0); expect(nonAnimated.width(), 1); @@ -266,11 +266,11 @@ void _imageTests() { expect(frame.height(), 1); expect(nonAnimated.decodeNextFrame(), -1); - expect(frame.makeShader(canvasKitJs.TileMode.Repeat, canvasKitJs.TileMode.Mirror), isNotNull); + expect(frame.makeShader(canvasKit.TileMode.Repeat, canvasKit.TileMode.Mirror), isNotNull); }); test('MakeAnimatedImageFromEncoded makes an animated image', () { - final SkAnimatedImage animated = canvasKitJs.MakeAnimatedImageFromEncoded(kAnimatedGif); + final SkAnimatedImage animated = canvasKit.MakeAnimatedImageFromEncoded(kAnimatedGif); expect(animated.getFrameCount(), 3); expect(animated.getRepetitionCount(), -1); // animates forever expect(animated.width(), 1); @@ -290,7 +290,7 @@ void _shaderTests() { }); test('MakeRadialGradient', () { - expect(canvasKitJs.SkShader.MakeRadialGradient( + expect(canvasKit.SkShader.MakeRadialGradient( Float32List.fromList([1, 1]), 10.0, [ @@ -298,14 +298,14 @@ void _shaderTests() { Float32List.fromList([1, 1, 1, 1]), ], Float32List.fromList([0, 1]), - canvasKitJs.TileMode.Repeat, + canvasKit.TileMode.Repeat, toSkMatrixFromFloat32(Matrix4.identity().storage), 0, ), isNotNull); }); test('MakeTwoPointConicalGradient', () { - expect(canvasKitJs.SkShader.MakeTwoPointConicalGradient( + expect(canvasKit.SkShader.MakeTwoPointConicalGradient( Float32List.fromList([1, 1]), 10.0, Float32List.fromList([1, 1]), @@ -315,7 +315,7 @@ void _shaderTests() { Float32List.fromList([1, 1, 1, 1]), ], Float32List.fromList([0, 1]), - canvasKitJs.TileMode.Repeat, + canvasKit.TileMode.Repeat, toSkMatrixFromFloat32(Matrix4.identity().storage), 0, ), isNotNull); @@ -323,40 +323,40 @@ void _shaderTests() { } SkShader _makeTestShader() { - return canvasKitJs.SkShader.MakeLinearGradient( + return canvasKit.SkShader.MakeLinearGradient( Float32List.fromList([0, 0]), Float32List.fromList([1, 1]), [ Float32List.fromList([255, 0, 0, 255]), ], Float32List.fromList([0, 1]), - canvasKitJs.TileMode.Repeat, + canvasKit.TileMode.Repeat, ); } void _paintTests() { test('can make SkPaint', () async { final SkPaint paint = SkPaint(); - paint.setBlendMode(canvasKitJs.BlendMode.SrcOut); - paint.setStyle(canvasKitJs.PaintStyle.Stroke); + paint.setBlendMode(canvasKit.BlendMode.SrcOut); + paint.setStyle(canvasKit.PaintStyle.Stroke); paint.setStrokeWidth(3.0); - paint.setStrokeCap(canvasKitJs.StrokeCap.Round); - paint.setStrokeJoin(canvasKitJs.StrokeJoin.Bevel); + paint.setStrokeCap(canvasKit.StrokeCap.Round); + paint.setStrokeJoin(canvasKit.StrokeJoin.Bevel); paint.setAntiAlias(true); paint.setColorInt(0x00FFCCAA); paint.setShader(_makeTestShader()); - paint.setMaskFilter(canvasKitJs.MakeBlurMaskFilter( - canvasKitJs.BlurStyle.Outer, + paint.setMaskFilter(canvasKit.MakeBlurMaskFilter( + canvasKit.BlurStyle.Outer, 2.0, true, )); - paint.setFilterQuality(canvasKitJs.FilterQuality.High); - paint.setColorFilter(canvasKitJs.SkColorFilter.MakeLinearToSRGBGamma()); + paint.setFilterQuality(canvasKit.FilterQuality.High); + paint.setColorFilter(canvasKit.SkColorFilter.MakeLinearToSRGBGamma()); paint.setStrokeMiter(1.4); - paint.setImageFilter(canvasKitJs.SkImageFilter.MakeBlur( + paint.setImageFilter(canvasKit.SkImageFilter.MakeBlur( 1, 2, - canvasKitJs.TileMode.Repeat, + canvasKit.TileMode.Repeat, null, )); }); @@ -364,8 +364,8 @@ void _paintTests() { void _maskFilterTests() { test('MakeBlurMaskFilter', () { - expect(canvasKitJs.MakeBlurMaskFilter( - canvasKitJs.BlurStyle.Outer, + expect(canvasKit.MakeBlurMaskFilter( + canvasKit.BlurStyle.Outer, 5.0, false, ), isNotNull); @@ -375,9 +375,9 @@ void _maskFilterTests() { void _colorFilterTests() { test('MakeBlend', () { expect( - canvasKitJs.SkColorFilter.MakeBlend( + canvasKit.SkColorFilter.MakeBlend( Float32List.fromList([0, 0, 0, 1]), - canvasKitJs.BlendMode.SrcATop, + canvasKit.BlendMode.SrcATop, ), isNotNull, ); @@ -385,7 +385,7 @@ void _colorFilterTests() { test('MakeMatrix', () { expect( - canvasKitJs.SkColorFilter.MakeMatrix( + canvasKit.SkColorFilter.MakeMatrix( Float32List(20), ), isNotNull, @@ -394,14 +394,14 @@ void _colorFilterTests() { test('MakeSRGBToLinearGamma', () { expect( - canvasKitJs.SkColorFilter.MakeSRGBToLinearGamma(), + canvasKit.SkColorFilter.MakeSRGBToLinearGamma(), isNotNull, ); }); test('MakeLinearToSRGBGamma', () { expect( - canvasKitJs.SkColorFilter.MakeLinearToSRGBGamma(), + canvasKit.SkColorFilter.MakeLinearToSRGBGamma(), isNotNull, ); }); @@ -410,16 +410,16 @@ void _colorFilterTests() { void _imageFilterTests() { test('MakeBlur', () { expect( - canvasKitJs.SkImageFilter.MakeBlur(1, 2, canvasKitJs.TileMode.Repeat, null), + canvasKit.SkImageFilter.MakeBlur(1, 2, canvasKit.TileMode.Repeat, null), isNotNull, ); }); test('MakeMatrixTransform', () { expect( - canvasKitJs.SkImageFilter.MakeMatrixTransform( + canvasKit.SkImageFilter.MakeMatrixTransform( toSkMatrixFromFloat32(Matrix4.identity().storage), - canvasKitJs.FilterQuality.Medium, + canvasKit.FilterQuality.Medium, null, ), isNotNull, @@ -542,7 +542,7 @@ void _pathTests() { }); test('setFillType', () { - path.setFillType(canvasKitJs.FillType.Winding); + path.setFillType(canvasKit.FillType.Winding); }); test('addArc', () { @@ -611,8 +611,7 @@ void _pathTests() { }); test('overloaded arcTo (used for arcToPoint)', () { - final SkPathArcToPointOverload overload = debugJsObjectWrapper.castToSkPathArcToPointOverload(path); - overload.arcTo( + (path as SkPathArcToPointOverload).arcTo( 1, 2, 3, @@ -774,8 +773,8 @@ void _skSkRectTests() { } SkVertices _testVertices() { - return canvasKitJs.MakeSkVertices( - canvasKitJs.VertexMode.Triangles, + return canvasKit.MakeSkVertices( + canvasKit.VertexMode.Triangles, [ Float32List.fromList([0, 0]), Float32List.fromList([10, 10]), @@ -843,16 +842,16 @@ void _canvasTests() { ); }); - test('SkCanvasSaveLayerWithoutBoundsOverride.saveLayer', () { - final SkCanvasSaveLayerWithoutBoundsOverride override = debugJsObjectWrapper.castToSkCanvasSaveLayerWithoutBoundsOverride(canvas); + test('SkCanvasSaveLayerWithoutBoundsOverload.saveLayer', () { + final SkCanvasSaveLayerWithoutBoundsOverload override = canvas as SkCanvasSaveLayerWithoutBoundsOverload; override.saveLayer(SkPaint()); }); - test('SkCanvasSaveLayerWithFilterOverride.saveLayer', () { - final SkCanvasSaveLayerWithFilterOverride override = debugJsObjectWrapper.castToSkCanvasSaveLayerWithFilterOverride(canvas); + test('SkCanvasSaveLayerWithFilterOverload.saveLayer', () { + final SkCanvasSaveLayerWithFilterOverload override = canvas as SkCanvasSaveLayerWithFilterOverload; override.saveLayer( SkPaint(), - canvasKitJs.SkImageFilter.MakeBlur(1, 2, canvasKitJs.TileMode.Repeat, null), + canvasKit.SkImageFilter.MakeBlur(1, 2, canvasKit.TileMode.Repeat, null), 0, SkRect( fLeft: 0, @@ -870,7 +869,7 @@ void _canvasTests() { test('clipPath', () { canvas.clipPath( _testClosedSkPath(), - canvasKitJs.ClipOp.Intersect, + canvasKit.ClipOp.Intersect, true, ); }); @@ -893,7 +892,7 @@ void _canvasTests() { rx4: 7, ry4: 8, ), - canvasKitJs.ClipOp.Intersect, + canvasKit.ClipOp.Intersect, true, ); }); @@ -906,7 +905,7 @@ void _canvasTests() { fRight: 100, fBottom: 100, ), - canvasKitJs.ClipOp.Intersect, + canvasKit.ClipOp.Intersect, true, ); }); @@ -927,13 +926,13 @@ void _canvasTests() { }); test('drawAtlas', () { - final SkAnimatedImage image = canvasKitJs.MakeAnimatedImageFromEncoded(kTransparentImage); + final SkAnimatedImage image = canvasKit.MakeAnimatedImageFromEncoded(kTransparentImage); canvas.drawAtlas( image.getCurrentFrame(), Float32List.fromList([0, 0, 1, 1]), Float32List.fromList([1, 0, 2, 3]), SkPaint(), - canvasKitJs.BlendMode.SrcOver, + canvasKit.BlendMode.SrcOver, [ Float32List.fromList([0, 0, 0, 1]), Float32List.fromList([1, 1, 1, 1]), @@ -946,7 +945,7 @@ void _canvasTests() { }); test('drawColorInt', () { - canvas.drawColorInt(0xFFFFFFFF, canvasKitJs.BlendMode.SoftLight); + canvas.drawColorInt(0xFFFFFFFF, canvasKit.BlendMode.SoftLight); }); test('drawDRRect', () { @@ -988,7 +987,7 @@ void _canvasTests() { }); test('drawImage', () { - final SkAnimatedImage image = canvasKitJs.MakeAnimatedImageFromEncoded(kTransparentImage); + final SkAnimatedImage image = canvasKit.MakeAnimatedImageFromEncoded(kTransparentImage); canvas.drawImage( image.getCurrentFrame(), 10, @@ -998,7 +997,7 @@ void _canvasTests() { }); test('drawImageRect', () { - final SkAnimatedImage image = canvasKitJs.MakeAnimatedImageFromEncoded(kTransparentImage); + final SkAnimatedImage image = canvasKit.MakeAnimatedImageFromEncoded(kTransparentImage); canvas.drawImageRect( image.getCurrentFrame(), SkRect(fLeft: 0, fTop: 0, fRight: 1, fBottom: 1), @@ -1009,7 +1008,7 @@ void _canvasTests() { }); test('drawImageNine', () { - final SkAnimatedImage image = canvasKitJs.MakeAnimatedImageFromEncoded(kTransparentImage); + final SkAnimatedImage image = canvasKit.MakeAnimatedImageFromEncoded(kTransparentImage); canvas.drawImageNine( image.getCurrentFrame(), SkRect(fLeft: 0, fTop: 0, fRight: 1, fBottom: 1), @@ -1039,7 +1038,7 @@ void _canvasTests() { test('drawPoints', () { canvas.drawPoints( - canvasKitJs.PointMode.Lines, + canvasKit.PointMode.Lines, Float32List.fromList([0, 0, 10, 10, 0, 10]), SkPaint(), ); @@ -1101,7 +1100,7 @@ void _canvasTests() { ); final SkTonalColors tonalColors = - canvasKitJs.computeTonalColors(inTonalColors); + canvasKit.computeTonalColors(inTonalColors); canvas.drawShadow( path, @@ -1122,7 +1121,7 @@ void _canvasTests() { test('drawVertices', () { canvas.drawVertices( _testVertices(), - canvasKitJs.BlendMode.SrcOver, + canvasKit.BlendMode.SrcOver, SkPaint(), ); }); @@ -1171,7 +1170,7 @@ void _canvasTests() { final CkParagraph paragraph = builder.build(); paragraph.layout(const ui.ParagraphConstraints(width: 100)); canvas.drawParagraph( - debugJsObjectWrapper.unwrapSkParagraph(paragraph.legacySkiaObject), + paragraph.skiaObject, 10, 20, ); diff --git a/lib/web_ui/test/canvaskit/skia_objects_cache_test.dart b/lib/web_ui/test/canvaskit/skia_objects_cache_test.dart index 7bd6236b4e504..d38a447eaa554 100644 --- a/lib/web_ui/test/canvaskit/skia_objects_cache_test.dart +++ b/lib/web_ui/test/canvaskit/skia_objects_cache_test.dart @@ -3,7 +3,6 @@ // found in the LICENSE file. // @dart = 2.6 -import 'dart:js'; import 'package:mockito/mockito.dart'; import 'package:test/test.dart'; @@ -45,7 +44,7 @@ void _tests() { expect(testObject.deleteCount, 0); // Check that the getter does not have side-effects - final JsObject skiaObject1 = testObject.legacySkiaObject; + final SkPaint skiaObject1 = testObject.skiaObject; expect(skiaObject1, isNotNull); expect(SkiaObjects.resurrectableObjects.single, testObject); expect(testObject.createDefaultCount, 1); @@ -61,7 +60,7 @@ void _tests() { expect(testObject.deleteCount, 1); // Trigger resurrect - final JsObject skiaObject2 = testObject.legacySkiaObject; + final SkPaint skiaObject2 = testObject.skiaObject; expect(skiaObject2, isNotNull); expect(skiaObject2, isNot(same(skiaObject1))); expect(SkiaObjects.resurrectableObjects.single, testObject); @@ -146,9 +145,6 @@ class TestOneShotSkiaObject extends OneShotSkiaObject { TestOneShotSkiaObject() : super(SkPaint()); - @override - JsObject get legacySkiaObject => debugJsObjectWrapper.wrapSkPaint(skiaObject); - @override void delete() { rawSkiaObject?.delete(); @@ -183,9 +179,6 @@ class TestSkiaObject extends ResurrectableSkiaObject { deleteCount++; } - @override - JsObject get legacySkiaObject => debugJsObjectWrapper.wrapSkPaint(skiaObject); - @override bool get isResurrectionExpensive => isExpensive; }