【问题标题】:ScrollController not working inside GridView with NestedScrollView?ScrollController 不能在带有 NestedScrollView 的 GridView 中工作?
【发布时间】:2021-03-12 02:00:22
【问题描述】:

我在实现 Instagram 类型的个人资料页面时遇到了问题,用户可以在其中通过分页滚动他的帖子。

我实现了一个 NestedScrollView,在它的主体内部我有一个 GridView.builder 来显示用户的帖子。通常,当用户滚动到 GridView 的末尾时,会发送一个滚动通知,如果有更多要加载的帖子,列表也会更新。

我的问题是当我添加 NestedScrollView 时,如果我给 Gridview 一个滚动控制器,Sliver 将无法正常工作,即在 GridView 内滚动只会滚动 GridView 本身,它不会滚动 NestedScrollView。

然而,如果我删除 Gridview 中的 scrollController,我可以正常滚动,但问题出现在 scrollnotifications 上。我必须将 NotificationListener 提供给 NestedScrollView,一旦用户在 gridview 中滚动一行,它就会被调用,因为从 NestedScrollView 的角度来看,它是屏幕的结尾。所以我的分页不起作用,发送了太多读取请求。

所以现在我坚持认为这两种解决方案都不是最佳解决方案。

【问题讨论】:

标签: flutter dart


【解决方案1】:

您必须为 NestedScrollView 和 GridView 放置 ScrollController 才能正确获取偏移量和滚动

【讨论】:

    【解决方案2】:

    NestedScrollViewGridView 一起使用的替代方法是使用ListView,然后在内部GridView 上设置约束。像这样的:

    import 'package:flutter/material.dart';
    
    void main() {
      runApp(MyApp());
    }
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'Sample App',
          home: MyHomePage(),
        );
      }
    }
    
    class MyHomePage extends StatefulWidget {
      @override
      _MyHomePageState createState() => _MyHomePageState();
    }
    
    class _MyHomePageState extends State<MyHomePage> {
      ScrollController _controller;
    
      @override
      void initState() {
        super.initState();
        _controller = ScrollController()..addListener(_scrollListener);
      }
    
      void _scrollListener() {
        if (_controller.position.extentAfter == 0) {
          print('End of list');
        }
      }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: ListView(
            controller: _controller,
            children: [
              Container(
                height: 200,
                color: Colors.indigo,
                alignment: Alignment.center,
                child: Text('Random Box'),
              ),
              ConstrainedBox(
                constraints: BoxConstraints(
                  minHeight: 100,
                  maxHeight: double.infinity,
                ),
                child: GridView.count(
                  shrinkWrap: true,
                  physics: NeverScrollableScrollPhysics(),
                  crossAxisCount: 3,
                  children: List<Widget>.generate(30, (index) => Text('testing')),
                ),
              ),
            ],
          ),
        );
      }
    }
    

    【讨论】:

    • 这个解决方案对我不起作用。谢谢亲爱的。
    猜你喜欢
    • 2019-05-16
    • 1970-01-01
    • 2015-11-11
    • 1970-01-01
    • 2019-07-12
    • 2021-06-16
    • 2020-01-09
    • 2023-03-19
    • 2018-09-28
    相关资源
    最近更新 更多