This repository was archived by the owner on Feb 25, 2025. It is now read-only.
[web] Fix shadows for arbitrary paths on PhysicalShape #23830
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
yjbanov
reviewed
Jan 21, 2021
| /// contents against same path for shadow to work since box-shadow doesn't | ||
| /// take clip-path into account. | ||
| /// | ||
| /// Webkit has a bug when applying clip-path on an element that has |
Contributor
There was a problem hiding this comment.
Is there a link to the WebKit bug?
| /// we size the inner container to cover full pathBounds instead of sizing | ||
| /// to clipping rect bounds (which is the case for elevation == 0.0 where | ||
| /// we shift outer/inner clip area instead to position clip-path). | ||
| final String svgClipPath = elevation == 0.0 ? |
Contributor
There was a problem hiding this comment.
nit: the ? should go on the next line
| offsetY: 0.0, | ||
| scaleX: 1.0 / pathBounds.right, | ||
| scaleY: 1.0 / pathBounds.bottom); | ||
| /// If apply is called multiple times (without update) , remove prior |
Contributor
There was a problem hiding this comment.
nit: remove space before the comma
| DomRenderer.setElementStyle( | ||
| rootElement!, 'clip-path', 'url(#svgClip$_clipIdCounter)'); | ||
| DomRenderer.setElementStyle( | ||
| rootElement!, '-webkit-clip-path', 'url(#svgClip$_clipIdCounter)'); |
Contributor
There was a problem hiding this comment.
Setting style properties has been showing up in our profiles. Can we set either clip-path or -webkit-clip-path depending on the browserEngine, but not both?
Contributor
Author
There was a problem hiding this comment.
done. Moved clip-path code into DomRenderer
|
|
||
| final ui.Rect pathBounds2 = path.getBounds(); | ||
| _svgElement = _pathToSvgElement( | ||
| path, SurfacePaintData()..color = color, '${pathBounds2.right}', '${pathBounds2.bottom}'); |
Contributor
There was a problem hiding this comment.
Does _applyColor need to be revised now that this function also uses the color field?
| _applyColor(); | ||
| } | ||
| if (oldSurface.elevation != elevation || | ||
| if (oldSurface.path != path || oldSurface.elevation != elevation || |
Contributor
There was a problem hiding this comment.
Do we have a test that covers the update codepath? We frequently get bugs that only manifest when the DOM nodes are updated from a previous state.
engine-flutter-autoroll
added a commit
to engine-flutter-autoroll/flutter
that referenced
this pull request
Jan 23, 2021
zanderso
pushed a commit
to flutter/flutter
that referenced
this pull request
Jan 25, 2021
* 004d8ad Roll Skia from cc6961b9ac5e to 6a272434c2b2 (3 revisions) (flutter/engine#23864) * 7c2da3b reland of flutter/engine#23634 (flutter/engine#23865) * a4f02b7 Share Android surface GrDirectContext (flutter/engine#23798) * 31ef1dd Roll Skia from 6a272434c2b2 to bfc9be0f773f (2 revisions) (flutter/engine#23867) * 6dec57f Remove workarounds now that type promotion accounts for local boolean variables. (flutter/engine#23862) * a787229 Roll Skia from bfc9be0f773f to 3193ff271628 (5 revisions) (flutter/engine#23872) * a242dd8 [web] Fix shadows for arbitrary paths on PhysicalShape (flutter/engine#23830) * 05b4bec Started using Dart_CreateInGroup when using spawn on a release build (flutter/engine#23782)
hjfreyer
pushed a commit
to hjfreyer/engine
that referenced
this pull request
Mar 22, 2021
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
4 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
PhysicalShape shadows failed for non rect/oval shapes since the physical shape adds an svg clip path to render background. This PR adds an SVG asset behind inner clip area to render shadow of physical shape separately.
Related issues:
flutter/flutter#65498
flutter/flutter#66334
flutter/flutter#57527
Tests updated in golden_compositing_test.dart
Pre-launch Checklist
writing and running engine tests.
///).If you need help, consider asking for advice on the #hackers-new channel on [Discord].