flutter - 控制 Flutter ListView 的滚动

Question

我想为 ListView 实现自动滚动功能，但我不知道如何正确控制它。

我有 2 个按钮。一种会使 ListView 开始滚动到底部，另一种会使 ListView 停止滚动。

我知道我可以使用 ScollController 和 animateTo 自动滚动到底部，但我不知道如何停止。这是实现自动滚动功能的正确方法吗？如果是，那么我该如何停止滚动？

标签： flutterdart

Answer 1

您可以通过覆盖animateTo到当前位置来停止滚动，如下所示

   _scrollController.animateTo(_scrollController.offset,
                    duration: Duration(milliseconds: 5000),
                    curve: Curves.fastOutSlowIn);

检查以下示例

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Example',
      home: new MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  ScrollController _scrollController = new ScrollController();

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: ListView.builder(
        controller: _scrollController,
        itemCount: 50,
        itemBuilder: (_, index) =>
            ListTile(title: Text('ListTile ' + index.toString())),
      ),
      bottomSheet: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          RaisedButton(
            child: Text("Start Down"),
            onPressed: () {
              setState(() {
                _scrollController.animateTo(
                    _scrollController.position.maxScrollExtent,
                    duration: Duration(milliseconds: 5000),
                    curve: Curves.fastOutSlowIn);
              });
            },
          ),
          RaisedButton(
            child: Text("Stop"),
            onPressed: () {
              setState(() {
                _scrollController.animateTo(_scrollController.offset,
                    duration: Duration(milliseconds: 5000),
                    curve: Curves.fastOutSlowIn);
              });
            },
          )
        ],
      ),
    );
  }
}