How can I add extra bottom spacing in ListView?
Assuming you are using ListView
, there is a very nice and simple solution to this.
You probably do not want to add padding around the ListView
itself as that would make some area of your UI unused.
ListView
has apadding
parameter for exactly this use case. You can essentially add some padding to the bottom of your ListView
that is part of the scrollable area. This means that you will only start seeing this padding once you have scrolled all the way to the bottom. This will allow you to drag the last few items above the FloatingActionButton
.
To find an appropriate value for the padding, you can make use of kFloatingActionButtonMargin
and _kExtendedSizeConstraints
, which is not accessible, thus, I will just use 48
like this.
This means that you will want to add the following to your ListView
:
ListView(
padding: const EdgeInsets.only(bottom: kFloatingActionButtonMargin + 48),
..
)
Here is a working example:
import 'package:flutter/material.dart';
main() {
runApp(MaterialApp(
home: Scaffold(
body: ListView.builder(
padding: const EdgeInsets.only(bottom: kFloatingActionButtonMargin + 48),
itemCount: 23,
itemBuilder: (context, index) => ListTile(
trailing: Text('$index'),
)),
floatingActionButton: FloatingActionButton(
onPressed: () {},
),
)));
}
Expandable( ListView.builder( ... padding: EdgeInsets.only(bottom: 200), ... ) )