【问题标题】:Flutter scroll slowly to the bottom of a dynamic ListviewFlutter缓慢滚动到动态Listview的底部
【发布时间】:2021-07-25 07:21:09
【问题描述】:

我有一个列表视图,它的项目可能每次都不同。我想让它自动滚动。

我试过这段代码

scrollController.animateTo(
      scrollController.position.maxScrollExtent,
      duration: Duration(seconds: 10),
      curve: Curves.easeOut);

它非常适用于小型列表视图,但是当列表视图项目为 100 或更多时,它开始移动得如此之快。

当列表视图有更多项目但它混乱时,我也尝试延长持续时间

【问题讨论】:

  • 你是通过api获取数据的吗?
  • 数据不是问题我从本地数据库正确获取数据。
  • 您是否一次获取所有数据?或者你正在使用分页?
  • 是的,我立即获取数据并填充列表视图,然后我希望它开始滚动。

标签: flutter dart flutter-listview


【解决方案1】:

问题是由动画本身引起的,而不是由持续时间引起的。 我通过增加持续时间和设置来解决它 curve: Curves.linear.

【讨论】:

    【解决方案2】:
    // Declaring the controller and the item size
    ScrollController _scrollController;
    final itemSize = 100.0;
    
    // Initializing
    @override
    void initState() {
      _scrollController = ScrollController();
      _scrollController.addListener(_scrollListener);
      super.initState();
    }
    
    // Your list widget (must not be nested lists)
    ListView.builder(
          controller: _scrollController,
          itemCount: <Your list length>,
          itemExtent: itemSize,
          itemBuilder: (context, index) {
              return ListTile(<your items>);
          },
    ),
    
    // With the listener and the itemSize, you can calculate which item
    // is on screen using the provided callBack. Something like this:
    void _scrollListener() {
      setState(() {
        var index = (_scrollController.offset / itemSize).round() + 1;
      });
    }
    

    【讨论】:

    • 没有时间不是问题。我已经说过,当我设置更长的时间时,它仍然可以工作,但它会以一种凌乱的方式移动。就像它停止然后移动
    • scrollController.position.maxScrollExtent 更改此
    • 改成什么?
    • 我改了答案看看
    • 项目大小不是静态的,它会根据里面的内容而改变。有没有其他不使用高度的解决方案
    【解决方案3】:
    import 'dart:async';
    import 'package:flutter/material.dart';
    
    class Home extends StatefulWidget {
      @override
      _HomeState createState() => _HomeState();
    }
    
    class _HomeState extends State<Home> {
      final _controller = ScrollController();
      
      @override
      void dispose() {
        _controller.dispose();
        super.dispose();
      }
    
      @override
      Widget build(BuildContext context) {
        Timer(
          Duration(seconds: 2),
              () => _controller.animateTo(
                _controller.position.maxScrollExtent,
                duration: Duration(seconds: 2),
                curve: Curves.fastOutSlowIn,
              ),
        );
        return Scaffold(
          body: ListView.builder(itemBuilder:(context, index) {
            return Text('hi');
          },
         controller: _controller,
          )
        );
      }
    }
    
    

    【讨论】:

    • 这段代码等待两秒钟,然后开始快速滚动。我的问题是快速滚动,但不是时间问题
    • 您可以使用Curves.easeIn 或任何其他类。有很多选择。
    • 谢谢 Ujjwal。我通过将曲线设置为Curves.linear来解决它。
    猜你喜欢
    • 2018-06-03
    • 2023-03-26
    • 2020-07-16
    • 2016-11-22
    • 1970-01-01
    • 2018-02-27
    • 1970-01-01
    • 2021-07-31
    • 1970-01-01
    相关资源
    最近更新 更多