fluttercommunity/font_awesome_flutter

Icon is not flipped when using LTR direction

iChicago opened this issue ยท 3 comments

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?

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)

Thank you it worked.

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).