fancy_bottom_navigation icon indicating copy to clipboard operation
fancy_bottom_navigation copied to clipboard

Safe Area Problem

Open 3rsin3rgul opened this issue 5 years ago • 6 comments

Simulator Screen Shot - iPhone Xʀ - 2019-05-12 at 13 35 07 Hello , How can we arrange this navigatorbar for safe area?

3rsin3rgul avatar May 12 '19 11:05 3rsin3rgul

I'm also running into this problem, is there any workaround for now?

frossetto avatar Jun 04 '19 00:06 frossetto

To clarify: wrapping with a SafeArea correctly avoids the Home indicator, but inactive item labels (normally offscreen) become visible in the new margin.

mockturtl avatar Jul 15 '19 17:07 mockturtl

Seems to duplicate #19.

mockturtl avatar Jul 15 '19 17:07 mockturtl

Workaround:

  • wrap with a SafeArea
  • wrap FancyBottomNavigation in a ClipRect using an offset CustomClipper to prevent painting past the bottom edge
Widget build(BuildContext context) => ClipRect(
        clipper: _Clipper(),
        child: FancyBottomNavigation(...),
);

class _Clipper extends CustomClipper<Rect> {
  @override
  Rect getClip(Size size) =>
      Rect.fromLTWH(0, -size.height, size.width, size.height * 2);

  @override
  bool shouldReclip(CustomClipper<Rect> oldClipper) => false;
}

mockturtl avatar Jul 15 '19 17:07 mockturtl

there is a const double property TEXT_OFF = 3; inside tabItem.dart, inside the package I mean change the 3 to the 5 or go testing, 5 worked for me.

it's always good to see the code and fix it from there, We are programmers for a reason

luck

legallyfree avatar Aug 24 '19 18:08 legallyfree

Same issue

Amr1440 avatar Aug 22 '21 07:08 Amr1440