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