0

I'm creating an app that requires a bottomModalSheet to stay persistant in all (Bottom) tabs regardless of which one I select. I've gotten it to work on a single BottomTab, but once I click on the other it loses it's state and the Modal is gone as well.

I'm using GoRouter for routing, modal_bottom_sheet for the modalBottomSheet.

BTW I've added BottomSheet on the Main Scaffold. Problem is I can't go on any other screen from that bottomSheet(They come behind it rather than on top of it)

1 Answers1

0

You can use bottomSheet property of Scaffold.

class Sample extends StatefulWidget {
  const Sample({Key? key}) : super(key: key);

  @override
  State<Sample> createState() => _SampleState();
}

class _SampleState extends State<Sample> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        bottom: TabBar(tabs: [],),
      ),
      body: TabBarView(children: [],),
      // add your bottomModelSheet widget here
      bottomSheet: MyCustomWidget(),
    );
  }
}
raghav042
  • 679
  • 6
  • 14
  • I've done that actually, Problem is, IF I Have a route(Let's call it route A) or subRoute and I context.push/go(goRouter) on top of it, it (Route B) comes behind(Route A) it rather than above it(Route A). On the other hand, If I use Navigator.of(context).push, it pushes it(Route B) above it but the navigator changes(So If I want to go to another screen from Route B to Route C I can't). – Shahan Ahmed Jan 30 '23 at 14:10