Flutter：如何自动滚动到 SingleChildScrollView 的末尾

Posted 2023-02-23

【中文标题】Flutter：如何自动滚动到 SingleChildScrollView 的末尾

【英文标题】：Flutter : How to Automaticallly scroll to end of SingleChildScrollView

【发布时间】：2020-08-09 17:58:28

【问题描述】：

我有一个 SingleChildScrollView，它的 scrollDirection 设置为 Horizo​​ntal，其中 5 个子小部件放置在 Row Widget 内。 我想以编程方式滚动到行中的最后一个小部件，当到达最后一个小部件时（等待 2 秒）我想向后滚动。

SingleChildScrollView(
    scrollDirection:Axis.horizontal,
    child:Row(
            children:<Widget>[
                           Widget(),
                           Widget(),
                           Widget(),
                           Widget(),
                           Widget(),  
                         ],
            ), 
    ),

)

【参考方案1】：

您可以通过以下方式使用滚动控制器来做到这一点。

 ScrollController _controller;
  @override
  void initState() 
    super.initState();
    _controller = ScrollController();
     WidgetsBinding.instance.addPostFrameCallback((_) 
  _controller
      .animateTo(_controller.position.maxScrollExtent,
          duration: Duration(seconds: 1), curve: Curves.ease)
      .then((value) async 
    await Future.delayed(Duration(seconds: 2));
    _controller.animateTo(_controller.position.minScrollExtent,
        duration: Duration(seconds: 1), curve: Curves.ease);
  );
);
  

  callMeWidget() 
    return Container(
      height: 100,
      width: 100,
      color: Colors.red,
      margin: EdgeInsets.all(10),
    );
  

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      body: Container(
        child: SingleChildScrollView(
          controller: _controller,
          scrollDirection: Axis.horizontal,
          child: Row(
            children: <Widget>[
              callMeWidget(),
              callMeWidget(),
              callMeWidget(),
              callMeWidget(),
              callMeWidget(),
            ],
          ),
        ),
      ),
    );
  

【讨论】：

这确实解决了一部分问题。但是在列表到达末尾后，我想向后滚动。这应该在延迟 2 秒后发生。