Dynamic Widget Positioning in Flutter for Bottom or Content End

Adjusting the Screen According to Device Size

When creating a screen, there are cases where you need to place buttons at the bottom of the screen according to the device size, as shown in the example below. However, there are also situations where you need to align buttons at the bottom of the content, like a footer, when the initially loaded internal content becomes lengthy.

Utilizing CustomScrollView and Slivers

First, place CustomScrollView at the top and use SliverToBoxAdapter within the slivers option to define areas. Then, for the remaining area, you can use SliverFillRemaining to position it. The important thing here is to give the SliverFillRemaining the option hasScrollBody: false (otherwise, it will fill the entire screen when scrolling).

With this approach, you can cover cases like A/B in example above.

While it may sound a bit complex in words, looking at example screen below may make it easier understand.