Solvedflutter Unexpected top padding in ListView put inside scaffold with no appBar
✔️Accepted Answer
Yeah this is intentional. If you put a widget before the ListView
, you should wrap the ListView
with a MediaQuery.removePadding
widget (with removeTop: true
).
Other Answers:
Yeah this is intentional. If you put a widget before the
ListView
, you should wrap theListView
with aMediaQuery.removePadding
widget (withremoveTop: true
).
Thank you very much!
This code solved my problem:
Widget _myListView(){
return MediaQuery.removePadding(
context: context,
removeTop: true,
child: ListView.builder(
.......
)
);
}
Just had this problem, top SliverPadding
is set to 20.0
by default. Looking at docs I see:
/// By default, [ListView] will automatically pad the list's scrollable
/// extremities to avoid partial obstructions indicated by [MediaQuery]'s
/// padding. To avoid this behavior, override with a zero [padding] property.
The solution that worked for me was to set the ListView padding to zero as here
child: ListView.builder(
padding: EdgeInsets.zero,
itemBuilder: (context, index) {
return Card(...);
},
),
Most likely this is not the most recommended way, but since I can define the size of the ListView through its parent that is a Container, and the Card() widget has its own defined size. One of most likely many solutions for this problem. Felt like sharing it as none of the options above suited my situation.
I do not feel the documentation is helpful. I would be lost without an example line of code.
I did this to remove all padding. Then pad each of your rows using container widget. I'm not an expert at all so please advise.
padding: const EdgeInsets.all(0.0)
If you put
ListView
somewhere insideScaffold
having noappBar
,ListView
has top padding. There is no padding ifappBar
is present. There is no padding if you specifyEdgeInsets.zero
padding forListView
explicitly. See following code snipped for exampleSee screenshot:
Flutter Doctor: