Skip to content
This repository was archived by the owner on Feb 25, 2025. It is now read-only.

soften shadows even more; fix shadow alpha #18029

Merged
yjbanov merged 3 commits into from
Apr 30, 2020
Merged

soften shadows even more; fix shadow alpha #18029

yjbanov merged 3 commits into from
Apr 30, 2020

Conversation

@yjbanov
Copy link
Contributor

@yjbanov yjbanov commented Apr 29, 2020 •
edited
Loading

  • Soften shadows even more; fix shadow alpha. This change uses globalAlpha to make the shadow transparent rather than using rgba on shadowColor, which is not supported as of today.
  • Add a test for transparent occluder.

This requires a golden update: flutter/goldens#90

Fixes flutter/flutter#55786
Fixes flutter/gallery#118

Examples:

Slider before:

slider-before

Slider after:

slider-after

Appbar before:

appbar-before

Appbar after:

appbar-after

Gallery before:

gallery-before

Gallery after:

gallery-after

Shrine demo before:

shrine-before

Shrine demo after:

shrine-after

@yjbanov yjbanov requested review from clocksmith and ferhatb April 29, 2020 15:47
@auto-assign auto-assign bot requested a review from iskakaushik April 29, 2020 15:47
@yjbanov yjbanov requested review from harryterkelsen and removed request for iskakaushik April 29, 2020 17:42
clocksmith
clocksmith reviewed Apr 29, 2020
View reviewed changes
lib/web_ui/lib/src/engine/shadow.dart
///
/// Flutter shadows look softer than the color specified by the developer. For
/// example, it is common to get a solid black for a shadow and see a very soft
/// shadow. This function softens the color by reducing its alpha by a constant
Copy link
Contributor

@clocksmith clocksmith Apr 29, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is a linear reduction the best option? Would it make sense for already softer-alpha shadows to reduce by an even smaller factor than 0.3?

Copy link
Contributor Author

@yjbanov yjbanov Apr 29, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Happy to change it if there's a concrete use-case. This seems to work fine for the gallery (at least all the places where I could find shadows).

Copy link
Contributor Author

@yjbanov yjbanov Apr 30, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's chat about a different way to adjust alpha. This seems to fix the immediate issue. We can improve it further in subsequent PRs.

@yjbanov yjbanov merged commit 590381a into flutter:master Apr 30, 2020
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Apr 30, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Apr 30, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
6872706 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Apr 30, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Apr 30, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
74d71b2 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Apr 30, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Apr 30, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
7888101 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Apr 30, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Apr 30, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
188d676 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Apr 30, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Apr 30, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
c419636 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Apr 30, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Apr 30, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
08af44a 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Apr 30, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Apr 30, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
201b60c 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Apr 30, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Apr 30, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
6a5d551 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Apr 30, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Apr 30, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
1090b72 
)
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Apr 30, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
5c9fe5b 
)
This was referenced Apr 30, 2020
Closed
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request May 1, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
c49398a 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request May 1, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request May 1, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
7911759 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request May 1, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request May 1, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
7627ca7 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request May 1, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request May 1, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
540ac0b 
)
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request May 1, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
f28a165 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request May 1, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request May 1, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
26140b9 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request May 1, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request May 1, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
5905d4c 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request May 1, 2020
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request May 1, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
9abafc2 
)
This was referenced May 1, 2020
Closed
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request May 1, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
f217cc0 
)
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request May 2, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
ee71431 
)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request May 2, 2020
Merged
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request May 5, 2020
@engine-flutter-autoroll
590381a soften shadows even more; fix shadow alpha (flutter/engine#18029
9ad9f8e 
)
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Reviewers

@harryterkelsen harryterkelsen Awaiting requested review from harryterkelsen

2 more reviewers

@clocksmith clocksmith clocksmith left review comments

@ferhatb ferhatb ferhatb approved these changes

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

cla: yes

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Shadows are too hard on mobile web vs mobile native Shadows are too hard on mobile web vs mobile native

4 participants

@yjbanov @clocksmith @ferhatb @googlebot