如何滚动到中的特殊小部件ListView?例如Container,ListView如果我按下特定的按钮,我想自动滚动到其中的某个。
ListView
Container
ListView(children: <Widget>[ Container(...), Container(...), #scroll for example to this container Container(...) ]);
到目前为止,最简单的解决方案是使用Scrollable.ensureVisible(context)。因为它可以为您完成所有工作,并且可以使用任何大小的小部件。使用获取上下文GlobalKey。
Scrollable.ensureVisible(context)
GlobalKey
问题是ListView不会渲染不可见的项目。这意味着你的目标很可能不会建 在所有 。这意味着你的目标将没有context; 阻止您在无需进行其他工作的情况下使用该方法。
context
最后,最简单的解决方案是将您ListView的替换为,SingleChilScrollView然后将您的孩子打包成Column。范例:
SingleChilScrollView
Column
class ScrollView extends StatelessWidget { final dataKey = new GlobalKey(); @override Widget build(BuildContext context) { return new Scaffold( primary: true, appBar: new AppBar( title: const Text('Home'), ), body: new SingleChildScrollView( child: new Column( children: <Widget>[ new SizedBox(height: 160.0, width: double.infinity, child: new Card()), new SizedBox(height: 160.0, width: double.infinity, child: new Card()), new SizedBox(height: 160.0, width: double.infinity, child: new Card()), // destination new Card( key: dataKey, child: new Text("data\n\n\n\n\n\ndata"), ) ], ), ), bottomNavigationBar: new RaisedButton( onPressed: () => Scrollable.ensureVisible(dataKey.currentContext), child: new Text("Scroll to data"), ), ); } }
注意 :虽然这使您可以轻松滚动到所需项目,但仅对小型预定义列表考虑此方法。至于更大的列表,您会遇到性能问题。
但是有可能Scrollable.ensureVisible与之合作ListView;尽管这需要更多工作。
Scrollable.ensureVisible