fluttercommunity / font_awesome_flutter

The Font Awesome Icon pack available as Flutter Icons
Other
834 stars 236 forks source link

Icon is not flipped when using LTR direction #202

Closed iChicago closed 2 years ago

iChicago commented 2 years ago

Hello All,,

I'm trying to use the signout icon. The icon has an arrow points to right direction. When I change the app direction to be RTL, the icon still the same.

IconButton(
    onPressed: () {},
    icon: FaIcon(
      FontAwesomeIcons.signOutAlt,
      color: Colors.red.shade700,
      textDirection: TextDirection.rtl,
    ),
),

Any idea how to solve this issue?

michaelspiss commented 2 years ago

Hi! I don't think icon flipping is part of font awesome or the material icons feature set. Please correct me if I'm wrong. You can however achieve the effect by wrapping the FaIcon with a Transform:

Transform(
  alignment: Alignment.center,
  transform: Matrix4.rotationY(isRtl() ? math.pi : 0),
  child: FaIcon(...),
)

(adapted from https://stackoverflow.com/a/58047595/3499706)

iChicago commented 2 years ago

Thank you it worked.

michaelspiss commented 2 years ago

Please be aware that with version 10 of font_awesome_flutter, this is the default behaviour of the FaIcon class. So if you used this code somewhere, you might want to remove it once you update (otherwise it gets flipped twice).