I have a scrollable list with a FloatingActionButton
. I would like to make the list to finish before the FloatingActionButton
because last item of list isn't visible anymore(FAB it's over list item)
return Scaffold(
body: ListView(
scrollDirection: Axis.vertical,
controller: _scrollController,
shrinkWrap: true,
children: <Widget>[
_buildUpcomingExpansionTileEvents(myUpcomingEvents),
_buildPastExpansionTileEvents(myPastEvents),
],
),
floatingActionButton: UnicornDialer(
parentButtonBackground: Colors.blue,
orientation: UnicornOrientation.VERTICAL,
parentButton: Icon(OMIcons.add),
childButtons: childButtons));
How could I change my list to finish with one empty item? Or what's the best solution to this problem?
FloatingActionButton
has size of 56
for non-mini and 40
for mini, so what you can do is use padding
in ListView
like:
ListView(
padding: EdgeInsets.only(bottom: 56), // if you have non-mini FAB else use 40
// ...
),
To solve this I just add a sized box as the last element in the list. That way you still get the end of list highlight in the correct place when the user scrolls to the bottom of the list.
ListView(
scrollDirection: Axis.vertical,
controller: _scrollController,
shrinkWrap: true,
children: <Widget>[
_buildUpcomingExpansionTileEvents(myUpcomingEvents),
_buildPastExpansionTileEvents(myPastEvents),
SizedBox(
height: 100, // or whatever height works for your design
),
],
),
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With