Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Ensure Icon vertically centers its icon glyph. #138937

Merged
merged 1 commit into from Nov 28, 2023
Merged

Ensure Icon vertically centers its icon glyph. #138937

merged 1 commit into from Nov 28, 2023

Conversation

LongCatIsLooong
Copy link
Contributor

@LongCatIsLooong LongCatIsLooong commented Nov 23, 2023 •
edited

Fixes #138592.

In an Icon widget if the icon font's body (ascender + descender) is larger than the font's units per em, the icon height reported by the text layout library will be larger than the specified font size. When that happens the icon glyph gets pushed towards the bottom because the Icon widget is wrapped in a fontSize x fontSize SizedBox and thus has a fixed height of fontSize px. This wasn't a problem for material icons because its UPEM == body.

Pre-launch Checklist

  • I read the Contributor Guide and followed the process outlined there for submitting PRs.
  • I read the Tree Hygiene wiki page, which explains my responsibilities.
  • I read and followed the Flutter Style Guide, including Features we expect every widget to implement.
  • I signed the CLA.
  • I listed at least one issue that this PR fixes in the description above.
  • I updated/added relevant documentation (doc comments with ///).
  • I added new tests to check the change I am making, or this PR is test-exempt.
  • All existing and new tests are passing.

If you need help, consider asking for advice on the #hackers-new channel on Discord.

@github-actions github-actions bot added the framework flutter/packages/flutter repository. See also f: labels. label Nov 23, 2023
@LongCatIsLooong
Copy link
Contributor Author

LongCatIsLooong commented Nov 23, 2023 •
edited

It looks like some internal clients are already using symbols. And some of them added a bottom padding to offset the icon misalignment.

@LongCatIsLooong LongCatIsLooong marked this pull request as ready for review November 23, 2023 09:52
@flutter-dashboard
Copy link

Golden file changes have been found for this pull request. Click here to view and triage (e.g. because this is an intentional change).

If you are still iterating on this change and are not ready to resolve the images on the Flutter Gold dashboard, consider marking this PR as a draft pull request above. You will still be able to view image results on the dashboard, commenting will be silenced, and the check will not try to resolve itself until marked ready for review.

For more guidance, visit Writing a golden file test for package:flutter.

Reviewers: Read the Tree Hygiene page and make sure this patch meets those guidelines before LGTMing.

Changes reported for pull request #138937 at sha 89f74b4

@flutter-dashboard flutter-dashboard bot added the will affect goldens Changes to golden files label Nov 23, 2023
guidezpl
guidezpl approved these changes Nov 23, 2023
View reviewed changes
Copy link
Member

@guidezpl guidezpl left a comment

Choose a reason for hiding this comment

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

b/267281950 is the known internal issue to be aware of, but this looks good

@LongCatIsLooong
Copy link
Contributor Author

G3Fix required for this: cl/584834751 . There a couple hundred of scuba changes even with the g3fix

@LongCatIsLooong LongCatIsLooong added the autosubmit Merge PR when tree becomes green via auto submit App label Nov 28, 2023
@auto-submit auto-submit bot removed the autosubmit Merge PR when tree becomes green via auto submit App label Nov 28, 2023
@auto-submit Auto-submit
Copy link
Contributor

auto-submit bot commented Nov 28, 2023

auto label is removed for flutter/flutter/138937, due to - The status or check suite Google testing has failed. Please fix the issues identified (or deflake) before re-applying this label.

@LongCatIsLooong LongCatIsLooong added the autosubmit Merge PR when tree becomes green via auto submit App label Nov 28, 2023
@auto-submit auto-submit bot merged commit f2b7472 into flutter:master Nov 28, 2023
70 checks passed
@LongCatIsLooong LongCatIsLooong deleted the icon-clipping branch November 28, 2023 21:37
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Nov 29, 2023
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Nov 29, 2023
@engine-flutter-autoroll
f2b74725c Ensure Icon vertically centers its icon glyph. (flutter/flu…
a3e614f 
…tter#138937)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Nov 29, 2023
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Nov 29, 2023
@engine-flutter-autoroll
f2b74725c Ensure Icon vertically centers its icon glyph. (flutter/flu…
e0b77bc 
…tter#138937)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Nov 29, 2023
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Nov 29, 2023
@engine-flutter-autoroll
f2b74725c Ensure Icon vertically centers its icon glyph. (flutter/flu…
31c2ab2 
…tter#138937)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Nov 29, 2023
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Nov 29, 2023
@engine-flutter-autoroll
f2b74725c Ensure Icon vertically centers its icon glyph. (flutter/flu…
80ab4b5 
…tter#138937)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Nov 29, 2023
Closed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Nov 29, 2023
@engine-flutter-autoroll
f2b74725c Ensure Icon vertically centers its icon glyph. (flutter/flu…
e2c9ca5 
…tter#138937)
@engine-flutter-autoroll engine-flutter-autoroll mentioned this pull request Nov 29, 2023
Merged
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Nov 29, 2023
@engine-flutter-autoroll
f2b74725c Ensure Icon vertically centers its icon glyph. (flutter/flu…
e85c11c 
…tter#138937)
auto-submit bot pushed a commit to flutter/packages that referenced this pull request Nov 29, 2023
@engine-flutter-autoroll
Roll Flutter from 6bf3ccd47d5d to 5e5b5292f739 (58 revisions) (#5519)
83cb110 
Roll Flutter from 6bf3ccd47d5d to 5e5b5292f739 (58 revisions)

flutter/flutter@6bf3ccd...5e5b529

2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 60b963930202 to 222beb28a8eb (2 revisions) (flutter/flutter#139242)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from eebbe7e15c7d to 60b963930202 (2 revisions) (flutter/flutter#139237)
2023-11-29 engine-flutter-autoroll@skia.org Roll Packages from 3c05466 to e4aaba8 (5 revisions) (flutter/flutter#139232)
2023-11-29 katelovett@google.com Update VelocityTracker (4) (flutter/flutter#139166)
2023-11-29 katelovett@google.com Analyze against using Stopwatches in the framework (flutter/flutter#138507)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from ecc9c7b6be7d to eebbe7e15c7d (1 revision) (flutter/flutter#139225)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 28aae2d29822 to ecc9c7b6be7d (1 revision) (flutter/flutter#139210)
2023-11-29 dumazy@gmail.com Improve documentation of CardTheme.shape (flutter/flutter#139096)
2023-11-29 ian@hixie.ch Simplify devicelab logic and fix tests (flutter/flutter#139122)
2023-11-29 vbacik.10@gmail.com implemented leadingWidth and automaticallyImplyLeading options  (flutter/flutter#136165)
2023-11-29 rmolivares@renzo-olivares.dev TextField and TextFormField can use a MaterialStatesController (flutter/flutter#133977)
2023-11-29 mateusfccp@gmail.com Provide parameter to Icon and IconThemeData for they to consider the context's text scaler (flutter/flutter#135708)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from be4d7c8b760c to 28aae2d29822 (1 revision) (flutter/flutter#139204)
2023-11-29 31859944+LongCatIsLooong@users.noreply.github.com Update `ButtonStyleButton.scaledPadding` documentation. Migrate callers in flutter/flutter (flutter/flutter#139014)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from de99c71c598f to be4d7c8b760c (1 revision) (flutter/flutter#139199)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 9a840e8dba40 to de99c71c598f (2 revisions) (flutter/flutter#139195)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from fbb2b1e880fa to 9a840e8dba40 (1 revision) (flutter/flutter#139192)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 4beaa1195b74 to fbb2b1e880fa (1 revision) (flutter/flutter#139191)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 570fec4fa92c to 4beaa1195b74 (3 revisions) (flutter/flutter#139190)
2023-11-29 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Reland Add platform view wide gamut test" (flutter/flutter#139189)
2023-11-28 godofredoc@google.com Move analysis test to shard tests. (flutter/flutter#139161)
2023-11-28 pateltirth454@gmail.com Write Tests for API Examples of `snack_bar.0`, `elevated_button.0`, `stepper.0`, `radio.0`, `filled_button.0`, `outlined_button.0` & `card.0` (flutter/flutter#138987)
2023-11-28 nathan.wilson1232@gmail.com Implement `switch` expressions in `dev/` (flutter/flutter#139048)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 01fcec7214db to 570fec4fa92c (2 revisions) (flutter/flutter#139178)
2023-11-28 gregor@zurowski.org Fix comment (flutter/flutter#138973)
2023-11-28 ybz975218925@gmail.com Added some documentation for OverlayPortal (flutter/flutter#138934)
2023-11-28 69699209+gbtb16@users.noreply.github.com feature(table-widget): Added intrinsicHeight to TableCellVerticalAlignment enum. (flutter/flutter#130264)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 97ede154dcd8 to 01fcec7214db (1 revision) (flutter/flutter#139172)
2023-11-28 31859944+LongCatIsLooong@users.noreply.github.com Ensure Icon vertically centers its icon glyph. (flutter/flutter#138937)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from fd3a33f8b239 to 97ede154dcd8 (2 revisions) (flutter/flutter#139168)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from d375d5b95d59 to fd3a33f8b239 (2 revisions) (flutter/flutter#139163)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from e4b18fa3661e to d375d5b95d59 (2 revisions) (flutter/flutter#139157)
2023-11-28 pateltirth454@gmail.com Added keyboardType & textInputAction props to SearchBar, SearchAnchor & SearchAnchor.bar (flutter/flutter#138553)
2023-11-28 jim@kalafut.net Fix header formatting typo in PopupMenuButton docs (flutter/flutter#139084)
2023-11-28 katelovett@google.com Fix turbulence seed for all tests with ink sparkles (flutter/flutter#138757)
2023-11-28 15619084+vashworth@users.noreply.github.com Renable macOS 13 tests (flutter/flutter#139083)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 8715e9b9119d to e4b18fa3661e (1 revision) (flutter/flutter#139142)
2023-11-28 engine-flutter-autoroll@skia.org Roll Packages from e774e88 to 3c05466 (2 revisions) (flutter/flutter#139140)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 6ad827e9a71b to 8715e9b9119d (1 revision) (flutter/flutter#139136)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from c18d3df967dc to 6ad827e9a71b (1 revision) (flutter/flutter#139135)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 1caa7478db0d to c18d3df967dc (1 revision) (flutter/flutter#139133)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 4f217e1f9afe to 1caa7478db0d (1 revision) (flutter/flutter#139129)
2023-11-28 leroux_bruno@yahoo.fr Fix textScalerOf and maybeTextScalerOf documentations (flutter/flutter#139123)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from c25cc65720de to 4f217e1f9afe (1 revision) (flutter/flutter#139126)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 3381d3ff0df7 to c25cc65720de (1 revision) (flutter/flutter#139121)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 96137d05fabc to 3381d3ff0df7 (4 revisions) (flutter/flutter#139119)
...
@HansMuller HansMuller mentioned this pull request Dec 1, 2023
Open
@timmaffett timmaffett mentioned this pull request Dec 2, 2023
Closed
@timmaffett timmaffett mentioned this pull request Dec 2, 2023
Closed
HugoOlthof pushed a commit to moneybird/packages that referenced this pull request Dec 13, 2023
@engine-flutter-autoroll @HugoOlthof
Roll Flutter from 6bf3ccd47d5d to 5e5b5292f739 (58 revisions) (flutte…
fdd18e3 
…r#5519)

Roll Flutter from 6bf3ccd47d5d to 5e5b5292f739 (58 revisions)

flutter/flutter@6bf3ccd...5e5b529

2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 60b963930202 to 222beb28a8eb (2 revisions) (flutter/flutter#139242)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from eebbe7e15c7d to 60b963930202 (2 revisions) (flutter/flutter#139237)
2023-11-29 engine-flutter-autoroll@skia.org Roll Packages from 3c05466 to e4aaba8 (5 revisions) (flutter/flutter#139232)
2023-11-29 katelovett@google.com Update VelocityTracker (4) (flutter/flutter#139166)
2023-11-29 katelovett@google.com Analyze against using Stopwatches in the framework (flutter/flutter#138507)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from ecc9c7b6be7d to eebbe7e15c7d (1 revision) (flutter/flutter#139225)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 28aae2d29822 to ecc9c7b6be7d (1 revision) (flutter/flutter#139210)
2023-11-29 dumazy@gmail.com Improve documentation of CardTheme.shape (flutter/flutter#139096)
2023-11-29 ian@hixie.ch Simplify devicelab logic and fix tests (flutter/flutter#139122)
2023-11-29 vbacik.10@gmail.com implemented leadingWidth and automaticallyImplyLeading options  (flutter/flutter#136165)
2023-11-29 rmolivares@renzo-olivares.dev TextField and TextFormField can use a MaterialStatesController (flutter/flutter#133977)
2023-11-29 mateusfccp@gmail.com Provide parameter to Icon and IconThemeData for they to consider the context's text scaler (flutter/flutter#135708)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from be4d7c8b760c to 28aae2d29822 (1 revision) (flutter/flutter#139204)
2023-11-29 31859944+LongCatIsLooong@users.noreply.github.com Update `ButtonStyleButton.scaledPadding` documentation. Migrate callers in flutter/flutter (flutter/flutter#139014)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from de99c71c598f to be4d7c8b760c (1 revision) (flutter/flutter#139199)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 9a840e8dba40 to de99c71c598f (2 revisions) (flutter/flutter#139195)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from fbb2b1e880fa to 9a840e8dba40 (1 revision) (flutter/flutter#139192)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 4beaa1195b74 to fbb2b1e880fa (1 revision) (flutter/flutter#139191)
2023-11-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 570fec4fa92c to 4beaa1195b74 (3 revisions) (flutter/flutter#139190)
2023-11-29 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Reland Add platform view wide gamut test" (flutter/flutter#139189)
2023-11-28 godofredoc@google.com Move analysis test to shard tests. (flutter/flutter#139161)
2023-11-28 pateltirth454@gmail.com Write Tests for API Examples of `snack_bar.0`, `elevated_button.0`, `stepper.0`, `radio.0`, `filled_button.0`, `outlined_button.0` & `card.0` (flutter/flutter#138987)
2023-11-28 nathan.wilson1232@gmail.com Implement `switch` expressions in `dev/` (flutter/flutter#139048)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 01fcec7214db to 570fec4fa92c (2 revisions) (flutter/flutter#139178)
2023-11-28 gregor@zurowski.org Fix comment (flutter/flutter#138973)
2023-11-28 ybz975218925@gmail.com Added some documentation for OverlayPortal (flutter/flutter#138934)
2023-11-28 69699209+gbtb16@users.noreply.github.com feature(table-widget): Added intrinsicHeight to TableCellVerticalAlignment enum. (flutter/flutter#130264)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 97ede154dcd8 to 01fcec7214db (1 revision) (flutter/flutter#139172)
2023-11-28 31859944+LongCatIsLooong@users.noreply.github.com Ensure Icon vertically centers its icon glyph. (flutter/flutter#138937)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from fd3a33f8b239 to 97ede154dcd8 (2 revisions) (flutter/flutter#139168)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from d375d5b95d59 to fd3a33f8b239 (2 revisions) (flutter/flutter#139163)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from e4b18fa3661e to d375d5b95d59 (2 revisions) (flutter/flutter#139157)
2023-11-28 pateltirth454@gmail.com Added keyboardType & textInputAction props to SearchBar, SearchAnchor & SearchAnchor.bar (flutter/flutter#138553)
2023-11-28 jim@kalafut.net Fix header formatting typo in PopupMenuButton docs (flutter/flutter#139084)
2023-11-28 katelovett@google.com Fix turbulence seed for all tests with ink sparkles (flutter/flutter#138757)
2023-11-28 15619084+vashworth@users.noreply.github.com Renable macOS 13 tests (flutter/flutter#139083)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 8715e9b9119d to e4b18fa3661e (1 revision) (flutter/flutter#139142)
2023-11-28 engine-flutter-autoroll@skia.org Roll Packages from e774e88 to 3c05466 (2 revisions) (flutter/flutter#139140)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 6ad827e9a71b to 8715e9b9119d (1 revision) (flutter/flutter#139136)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from c18d3df967dc to 6ad827e9a71b (1 revision) (flutter/flutter#139135)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 1caa7478db0d to c18d3df967dc (1 revision) (flutter/flutter#139133)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 4f217e1f9afe to 1caa7478db0d (1 revision) (flutter/flutter#139129)
2023-11-28 leroux_bruno@yahoo.fr Fix textScalerOf and maybeTextScalerOf documentations (flutter/flutter#139123)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from c25cc65720de to 4f217e1f9afe (1 revision) (flutter/flutter#139126)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 3381d3ff0df7 to c25cc65720de (1 revision) (flutter/flutter#139121)
2023-11-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 96137d05fabc to 3381d3ff0df7 (4 revisions) (flutter/flutter#139119)
...
caseycrogers pushed a commit to caseycrogers/flutter that referenced this pull request Dec 29, 2023
@LongCatIsLooong @caseycrogers
Ensure Icon vertically centers its icon glyph. (flutter#138937)
e771030 
Fixes flutter#138592. 

In an `Icon` widget if the icon font's body (ascender + descender) is larger than the font's units per em, the icon height reported by the text layout library will be larger than the specified font size. When that happens the icon glyph gets pushed towards the bottom because the `Icon` widget is wrapped in a fontSize x fontSize SizedBox and thus has a fixed height of fontSize px. This wasn't a problem for material icons because its UPEM == body.
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Feb 16, 2024
@engine-flutter-autoroll
f2b74725c Ensure Icon vertically centers its icon glyph. (flutter/flu…
1c80a65 
…tter#138937)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@guidezpl guidezpl guidezpl approved these changes

Assignees
No one assigned
Labels
autosubmit Merge PR when tree becomes green via auto submit App framework flutter/packages/flutter repository. See also f: labels. will affect goldens Changes to golden files
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

GoogleSymbols icons are not properly vertically centered by Flutter rendering logic
2 participants
@LongCatIsLooong @guidezpl