Listview在颤动中强制滚动到顶部

Posted 2023-02-23

【中文标题】Listview在颤动中强制滚动到顶部

【英文标题】：Listview force scrolling to the top in flutter

【发布时间】：2021-06-09 03:35:14

【问题描述】：

列表视图代码

    return FutureBuilder<bool>(
      future: getData(),
      builder: (BuildContext context, AsyncSnapshot<bool> snapshot) 
        if (!snapshot.hasData) 
          return SizedBox();
         else 
          return Container(
            margin: PHONE ? EdgeInsets.only(top:AppBar().preferredSize.height + MediaQuery.of(context).padding.top + 90, bottom: 90)
            : EdgeInsets.only(top:AppBar().preferredSize.height + MediaQuery.of(context).padding.top + 140, bottom: 100),
            child: ListView.builder(
              physics: BouncingScrollPhysics(),
              itemCount: data.length,
              addAutomaticKeepAlives: true,
              scrollDirection: Axis.vertical,
              itemBuilder: (BuildContext context, int index) 
                widget.animationController.forward();
                return AnimatedBuilder(
                  animation: widget.animationController,
                  builder: (BuildContext context, Widget child) 
                    return ProgramsTitleView(
                      animation: Tween<double>(begin: 0.0, end: 1.0).animate(
                        CurvedAnimation(
                          parent: widget.animationController,
                          curve: Interval((1 / data.length) * index, 1.0,
                              curve: Curves.fastOutSlowIn),
                        ),
                      ),
                      animationController: widget.animationController,
                      titleText: data[index]['Heading'],
                      type: widget.screen,
                    );
                  ,
                );
              ,
            ),
          );
        
      ,
    );

我有一个列表视图，它的数据是从 http 请求中填充的。奇怪的是，它可以正确加载数据并正确向下滚动，但是如果我向上滚动一点，无论我之前向下滚动多远，它都会强制滚动到顶部。 我到处找，但没有找到有同样问题的人。我是否遗漏了导致此错误的某些内容？

【参考方案1】：

在这种情况下，我认为最好使用StreamBuilder 而不是FutureBuilder，因为它只会在数据发生变化时重建屏幕。因此，在您的getData() 函数中，您可以将数据添加到Stream。

final controller = StreamController();

getData() async 
  final data = await _someCallToApi();
  controller.add(data);

然后在 UI 中收听：

 return StreamBuilder(
      stream: controller.stream,
      builder: (BuildContext context, AsyncSnapshot<bool> snapshot) 
        if (!snapshot.hasData) 
          return SizedBox();
 ...