From fefa4b2d284770a3ec923be3bb28b32aacde4942 Mon Sep 17 00:00:00 2001 From: Harry Terkelsen Date: Wed, 27 Sep 2023 15:14:36 -0700 Subject: [PATCH 1/2] [canvaskit] Do not double-apply ImageFilter transform to children --- lib/web_ui/lib/src/engine/canvaskit/layer.dart | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/lib/web_ui/lib/src/engine/canvaskit/layer.dart b/lib/web_ui/lib/src/engine/canvaskit/layer.dart index 74f8148b2c895..f54d7acd026b8 100644 --- a/lib/web_ui/lib/src/engine/canvaskit/layer.dart +++ b/lib/web_ui/lib/src/engine/canvaskit/layer.dart @@ -400,13 +400,14 @@ class ImageFilterEngineLayer extends ContainerLayer @override void preroll(PrerollContext prerollContext, Matrix4 matrix) { - final Matrix4 transform = - (_filter as CkManagedSkImageFilterConvertible).transform; - final Matrix4 childMatrix = matrix.multiplied(transform); - prerollContext.mutatorsStack.pushTransform(transform); + final Matrix4 childMatrix = Matrix4.copy(matrix); + childMatrix.translate(_offset.dx, _offset.dy); + prerollContext.mutatorsStack + .pushTransform(Matrix4.translationValues(_offset.dx, _offset.dy, 0.0)); final ui.Rect childPaintBounds = prerollChildren(prerollContext, childMatrix); - _filter.imageFilter((SkImageFilter filter) { + (_filter as CkManagedSkImageFilterConvertible) + .imageFilter((SkImageFilter filter) { paintBounds = rectFromSkIRect(filter.getOutputBounds(toSkRect(childPaintBounds))); }); From 965ceac11c0caf846d778f76ba970f57758773f5 Mon Sep 17 00:00:00 2001 From: Harry Terkelsen Date: Wed, 27 Sep 2023 15:59:59 -0700 Subject: [PATCH 2/2] Add test --- lib/web_ui/test/ui/filters_test.dart | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/lib/web_ui/test/ui/filters_test.dart b/lib/web_ui/test/ui/filters_test.dart index de8cbec340644..a2151002c8e92 100644 --- a/lib/web_ui/test/ui/filters_test.dart +++ b/lib/web_ui/test/ui/filters_test.dart @@ -78,6 +78,16 @@ Future testMain() async { await matchGoldenFile('ui_filter_matrix_imagefilter.png', region: region); }); + test('resizing matrix filter', () async { + await drawTestImageWithPaint(ui.Paint() + ..imageFilter = ui.ImageFilter.matrix( + Matrix4.diagonal3Values(0.5, 0.5, 1).toFloat64(), + filterQuality: ui.FilterQuality.high, + )); + await matchGoldenFile('ui_filter_matrix_imagefilter_scaled.png', + region: region); + }); + test('composed filters', () async { final ui.ImageFilter filter = ui.ImageFilter.compose( outer: ui.ImageFilter.matrix(