我实现了一个偏移量,以将列表视图向下推到屏幕高度的四分之一,以适应列表视图上方显示的图像(不在代码中)。但是现在当我向下滚动到最后一个磁贴时,列表视图又跳回了上层。
import 'package:flutter/material.dart';
class ProductsPage extends StatelessWidget {
var data = [
{
"title": "Lorem ipsum dolor",
},
{
"title": "Lorem ipsum dolor",
},
{
"title": "Lorem ipsum dolor",
},
{
"title": "Lorem ipsum dolor",
},
{
"title": "Lorem ipsum dolor",
},
];
@override
Widget build(BuildContext context) {
return new Scaffold(
backgroundColor: Colors.white,
body: new Stack(
children: <Widget>[
new Transform.translate(
offset:
new Offset(0.0, MediaQuery.of(context).size.height / 4),
child: new ListView.builder(
padding: const EdgeInsets.all(0.0),
scrollDirection: Axis.vertical,
primary: true,
itemCount: data.length,
itemBuilder: (BuildContext content, int index) {
return ListItem(
title: data[index]["title"],
);
},
),
),
],
),
);
}
}
class ListItem extends StatefulWidget {
String title;
ListItem({this.title});
@override
_ListItemState createState() => new _ListItemState();
}
class _ListItemState extends State<ListItem> {
@override
Widget build(BuildContext context) {
return new Row(
children: <Widget>[
new Container(width: 10.0, height: 190.0, color: Colors.black),
new Expanded(
child: Container(
color: Colors.black,
child: new Padding(
padding:
const EdgeInsets.symmetric(vertical: 40.0, horizontal: 20.0),
child: new Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Text(
widget.title,
style: TextStyle(
color: Colors.grey.shade800,
fontSize: 18.0,
fontWeight: FontWeight.bold),
),
],
),
),
),
),
],
);
}
}
该代码有望生成一个可滚动的列表,您可以在列表中的任何位置停下来,而无需自动滚动回到顶部。