From 0a8ad236e4afba9659831227bd4a5f8ed18d83aa Mon Sep 17 00:00:00 2001 From: Harry Terkelsen <1961493+harryterkelsen@users.noreply.github.com> Date: Tue, 26 Sep 2023 12:31:57 -0700 Subject: [PATCH] [canvaskit] Use DirectionalLight_Shadow flag for drawing shadows (#46292) Use the DirectionalLight_Shadow flag when drawing shadows in CanvasKit. This fixes bugs with drawing shadows in tests with different device pixel ratios. ## Pre-launch Checklist - [x] I read the [Contributor Guide] and followed the process outlined there for submitting PRs. - [x] I read the [Tree Hygiene] wiki page, which explains my responsibilities. - [x] I read and followed the [Flutter Style Guide] and the [C++, Objective-C, Java style guides]. - [x] I listed at least one issue that this PR fixes in the description above. - [x] I added new tests to check the change I am making or feature I am adding, or the PR is [test-exempt]. See [testing the engine] for instructions on writing and running engine tests. - [x] I updated/added relevant documentation (doc comments with `///`). - [x] I signed the [CLA]. - [x] All existing and new tests are passing. If you need help, consider asking for advice on the #hackers-new channel on [Discord]. [Contributor Guide]: https://github.com/flutter/flutter/wiki/Tree-hygiene#overview [Tree Hygiene]: https://github.com/flutter/flutter/wiki/Tree-hygiene [test-exempt]: https://github.com/flutter/flutter/wiki/Tree-hygiene#tests [Flutter Style Guide]: https://github.com/flutter/flutter/wiki/Style-guide-for-Flutter-repo [C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style [testing the engine]: https://github.com/flutter/flutter/wiki/Testing-the-engine [CLA]: https://cla.developers.google.com/ [flutter/tests]: https://github.com/flutter/tests [breaking change policy]: https://github.com/flutter/flutter/wiki/Tree-hygiene#handling-breaking-changes [Discord]: https://github.com/flutter/flutter/wiki/Chat --- lib/web_ui/lib/src/engine/canvaskit/util.dart | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) diff --git a/lib/web_ui/lib/src/engine/canvaskit/util.dart b/lib/web_ui/lib/src/engine/canvaskit/util.dart index 29855455abd3a..2b2e646dd117b 100644 --- a/lib/web_ui/lib/src/engine/canvaskit/util.dart +++ b/lib/web_ui/lib/src/engine/canvaskit/util.dart @@ -73,10 +73,10 @@ class SkiaShadowFlags { // material spec. const double ckShadowAmbientAlpha = 0.039; const double ckShadowSpotAlpha = 0.25; -const double ckShadowLightRadius = 1.1; -const double ckShadowLightHeight = 600.0; const double ckShadowLightXOffset = 0; const double ckShadowLightYOffset = -450; +const double ckShadowLightHeight = 600; +const double ckShadowLightRadius = 800; const double ckShadowLightXTangent = ckShadowLightXOffset / ckShadowLightHeight; const double ckShadowLightYTangent = ckShadowLightYOffset / ckShadowLightHeight; @@ -161,13 +161,15 @@ void drawSkShadow( bool transparentOccluder, double devicePixelRatio, ) { - final int flags = transparentOccluder + int flags = transparentOccluder ? SkiaShadowFlags.kTransparentOccluderShadowFlags : SkiaShadowFlags.kDefaultShadowFlags; + flags |= SkiaShadowFlags.kDirectionalLight_ShadowFlag; final ui.Color inAmbient = color.withAlpha((color.alpha * ckShadowAmbientAlpha).round()); - final ui.Color inSpot = color.withAlpha((color.alpha * ckShadowSpotAlpha).round()); + final ui.Color inSpot = + color.withAlpha((color.alpha * ckShadowSpotAlpha).round()); final SkTonalColors inTonalColors = SkTonalColors( ambient: makeFreshSkColor(inAmbient), @@ -180,10 +182,10 @@ void drawSkShadow( path.skiaObject, Float32List(3)..[2] = devicePixelRatio * elevation, Float32List(3) - ..[0] = ckShadowLightXOffset - ..[1] = ckShadowLightYOffset - ..[2] = devicePixelRatio * ckShadowLightHeight, - devicePixelRatio * ckShadowLightRadius, + ..[0] = 0 + ..[1] = -1 + ..[2] = 1, + ckShadowLightRadius / ckShadowLightHeight, tonalColors.ambient, tonalColors.spot, flags.toDouble(),