Open Mullen89 opened 4 years ago
Hi!
Thanks for being part of the Font Awesome Community.
Could you please provide a reproducible test case and fill out our bug report template?
I've got the same issue - it's causing alignment problems in my flutter app.
A simple way to view the issue is to just display it in a Container with the same size as the icon:
Container(
color: Colors.red,
width: 60,
child: Icon(
FontAwesomeIcons.trophy,
color: ColorPicker.white,
size: 60,
),
),
You can see that it clearly overflows past the size it's been given on the right and the bottom:
On further inspection, it looks like the width is set to 576 and the height is set to 512.
I'd imagine the width should be set to 512 and the trophy's height should be scaled down and be vertically centered in 512 height.
I'd imagine the width should be set to 512 and the trophy's height should be scaled down and be vertically centered in 512 height.
Hi, Font Awesome icons have different width by design decision. Please do not assume that all icons fill in a square container
Before escalating this issue, could you please post screenshots of the same example for:
Noted.
Sure thing. Looks like it's the same issue.
square-full:
gamepad:
Ok, thanks
Is flutter using the webfont version of Font Awesome?
It's using the pubdev font awesome flutter package
FYI: Those screenshots were taken using version 8.8.1, but the current version 8.11.0 is experiencing the same issue.
Ok, silly me - After reading through the package it looks like there is a solution:
User the FaIcon Widget instead of Icon.
Sounds like this could be resolved already
It's using the pubdev font awesome flutter package
Sorry, we do not provide support for third parties
Apparently this library uses the webfont. The misaligned height may be an issue with the Descender, but this is the nature itself of webfonts, so we can't fix it
User the FaIcon Widget instead of Icon.
If you can confirm it solves the issue, please let us know
Understood.
It solves the alignment issue, however. it seems that giving the icon a size will still cause the icon to overflow as if the icon is taking up more size than it was told to.
As you said - could be an issue with Descender
This icon is not centered when used in mobile app development (using DART with the Flutter framework). Looks to be about 10 - 15 pixels too far to the right.