1

I have programmed a modal buttom sheet which with this package (using a showCupertinoModalBottomSheet). This modal has a "header" which shows the heading and a close button on the left so the user knows what the modal is about and has a "footer" with two buttons to either apply the filter or reset it.

Between the header and the footer is a a Expanded component with a SingleChildScrollView inside in order to scroll inside the modal. This is needed because there are more filter options available than space! I am very happy that I found a solution without a SizedBox component which has a given height because the height of smartphones vary.

However, now I am facing one last problem: Sadly I am not able to scroll to the bottom of my SingleChildScrollView. This problem also occurs when removing the "footer" with the two buttons. Means, the SingleChildScrollView goes beyond the screen height (which is fine) but which is useless when I am not able to scroll to the bottom of my list. At the end of this post I have added an image so you can see the problem.

Here you can find my dartpad without the modal buttom sheet which is not supported yet on dartpart. However, because dartpad presents the web view instead of the mobile view I am not able to recreate the problem 100%. When using the mouse wheel to scrol you can scroll to the end of the list. But as you can see in the image below in the mobile version is does not work!

Does anyone has an idea how I can solve this? I already have tried adding Containers with padding and margin to the bottom but this sadly doesn't work or leads to rendering issues.

There is also a stackoverflow post which seems to solve this problem but that leads to an rendering issue for me: https://stackoverflow.com/a/63613723/9445999

Image:

enter image description here

Kind regards and thank you!

Jan
  • 1,180
  • 3
  • 23
  • 60

0 Answers0