Loading Overlay On Top Of showModalBottomSheet

by

I have created a LoadingOverlay Widget that sit at the very top of the widget three (after Scaffold widget) that takes Widget as child, put it inside Stack Widget and put custom Spinner Widget below it. As expected it sit on the top of screen, blocking input when loading state activated.

But at the same page i have a function that call showModalBottomSheet to render BottomSheet Widget. The problem is my custom loading overlay will render below the BottomSheet Widget.

How can i put my custom loading overlay on top of all Widget including BottomSheet ?

Instead of

BottomSheet
LoadingOverlay
Screen

to

LoadingOverlay
BottomSheet
Screen

LoadingOverlay Widget snippet

@override
Widget build(BuildContext context) {
  return Stack(
    children: [
      ScreenWidget(),
      CustomLoadingOverlay()
    ]
  )
}

Screen Widget snippet

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: LoadingOverlay(child: _buildScreen()); // show bottom modal function inside _buildScreen()
  )
}

Any help is appreciated as i am new to Flutter. Thanks

Leave a Comment