I am trying to use ListView.builder to display a horizontal list in a Stack but am encountering this weird bug when scrolling ListView if I set itemCount: 10
. If I set itemCount: 20
the ListView scrolls like normal.
I have tested in the emulator (Galaxy Nexus 720x1280 android 5.0) and on a real device (Nokia 7 plus, android 9.0). How can I fix this?
class BugPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Stack(
children: <Widget>[
Positioned(
left: 20.0,
right: 20.0,
height: 60.0,
bottom: 70.0,
child: Row(
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Expanded(
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: 10, // Overflow when scroll.
itemBuilder: (BuildContext context, int index) {
return Padding(
padding: const EdgeInsets.symmetric(
horizontal: 3.0,
),
child: Container(
width: 40.0,
height: 40.0,
color: Colors.red,
child: Center(child: Text("$index")),
),
);
},
),
),
SizedBox(width: 10.0),
FloatingActionButton(
backgroundColor: Colors.blue,
onPressed: () {},
child: new Icon(
Icons.add,
color: Colors.black,
),
),
],
),
),
],
),
),
);
}
}
Expected output:
Actual output:
And a video of the problem
I tried your code and run with bigger intemcount too without problems, but i have an advice, change the
SizedBox(width: 10.0)
for a padding around the button
Padding(
padding: const EdgeInsets.only(left: 10),
child: FloatingActionButton(
backgroundColor: Colors.blue,
onPressed: () {},
child: new Icon(
Icons.add,
color: Colors.black,
),
)
)
在我更新到最新版本后,这个错误似乎出现在旧的颤振版本中,一切正常。
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.