Flutter: Overflow error/Faulty scrolling with SlidingUpPanel - flutter

Question

I am using the sliding_up_panel package (version ^2.0.0+1) and I am facing problems with the scroll behaviour of my screen. My widget looks something like this:
return SingleChildScrollView(
child: SlidingUpPanel(
// set minHeight to 0 to only show the SlidingUpPanel when clicking on the edit icon
minHeight: 0,
controller: sliderController,
panel: const RenameWidget(),
body: generateMainBody(context)),
);
With this approach I get a UI that looks like this:
When I click on the edit icon the panel of the SlidingUpPanel opens as intended:
However, you can see on the first screenshot that I have an overflow on the bottom resulting the following error:
A RenderFlex overflowed by 157 pixels on the bottom.
I was trying to solve this by nesting the SlidingUpPanel in a SingleChildScrollView as you can see in the code above. This does not solve the overflow and cuts off some of the content on the bottom.
Next, I tried moving the SingleChildScrollView into the body of the SlidingUpPanel:
return SlidingUpPanel(
minHeight: 0,
controller: sliderController,
panel: const RenameWidget(),
body: SingleChildScrollView(child: generateMainBody(context)));
This solved the overflow error but when scrolling down it still cuts off some of the content.
This is definitely related to the SlidingUpPanel since doing this works just fine (of course without opening anything when clicking the edit icon):
return SingleChildScrollView(child: generateMainBody(context));
I only want the popup to open when clicking on the edit icon. Maybe using minHeight: 0 is not the correct way to achieve this? How do I make the body of the SlidingUpPanel scroll correctly?

Answer 1

Take a look at this flutter class. You don't need a package to achieve what you want to do.

Answer 2

return Scaffold(
body: Container(
height: double.infinity,
width: double.infinity,
child: SlidingUpPanel(
// set minHeight to 0 to only show the SlidingUpPanel when clicking on the edit icon
minHeight: 0,
controller: sliderController,
panel: const RenameWidget(),
body: SingleChildScrollView(child: generateMainBody(context)),
),
),
);

Answer 3

or u can use flutter modal sheet if you want to open a container from bottom when click a icon or button
Widget build(BuildContext context) {
return Scaffold(
body: Container(
height: double.infinity,
width: double.infinity,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
FlatButton(onPressed: (){
showModalBottomSheet(context: context, builder: (context){
return Container(
height: 200,
width: double.infinity,
child: Text("This is Bottom modal sheet", style: TextStyle(color: Colors.black)),
);
});
}, child: Text("open Bottom sheet",style: TextStyle(color: Colors.black)))
]),
),
);
}