I currently have a stack with a backdrop for my AppBar and the contents of my page.
I'm displaying a Container in the center of the page, positioned with the Positioned widget, which contains a grid/listview.
@override
Widget build(BuildContext context) {
return Scaffold(
extendBodyBehindAppBar: true,
appBar: VehicleScreenAppBar(
title: title,
context: context,
),
body: LayoutBuilder(
builder: (contxt, vehicleListConstraints) {
return Stack(
overflow: Overflow.visible,
children: <Widget>[
AppBarBackDrop(constraints: vehicleListConstraints),
Positioned(
top: vehicleListConstraints.maxHeight * .15,
left: (vehicleListConstraints.maxWidth - vehicleListConstraints.maxWidth * .9) / 2,
child: Container(
color: Colors.red,
height: vehicleListConstraints.maxHeight * .6,
width: vehicleListConstraints.maxWidth * .9,
child: ListView.builder(
itemCount: 20,
itemBuilder: (context, i) {
return Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
height: 50,
color: Colors.blue,
child: Text('text'),
),
);
},
),
),
)
],
);
},
),
);
}

The problem that I am running into is that the grid/listview do not scroll when I have Positioned widget AND I have explicitly named any BUT NOT ALL of its constructors, i.e. top:, bottom:, left:, right:. (I'm lazily building the grid/listview lazily via builder).
I have a work around/hack where I remove the Positioned and replace it with a PageView. The PageView then has a children: <Widget> [ Container() ] that I then position via the margin constructors' top: and left:.
This will work for now, but not something that I want to implement for production. How can I get the grid/listview to scroll within a Positioned widget WITHOUT naming all of its constructors?
Positioned is a widget that comes built-in with flutter SDK. Postioned does exactly what it sounds like, which is it arbitrarily positioned widgets on top of each other. It is usually used to position child widgets in Stack widget or similar. It only works for Stateless and Stateful widgets.
For scroll-able widgets wrapped inside the positioned widget, you should give all the parameters (left, right , top , bottom) of Positioned widget a value then it will work.
Positioned(
top: 20.0,
left: 20.0,
right:0.0,
bottom:0.0
child: SizedBox(
//what ever code is)),
)
)
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