首页 > 解决方案 > 分页滚动控制器 ScrollPhysics

问题描述

尝试对 ListView 进行分页。但是在包含物理参数时无法使用宽度 ScrollNotification - ListView 中的参数(忽略它)。但是,如果我删除物理参数,我的widjet visuali 不会滚动!

import 'package:flutter/material.dart';
import 'package:news_api_app/models/NewsModels/NewsModel.dart';
import 'BlogTile.dart';

class NewsListView extends StatefulWidget {
  final NewsModel newsModel;

  NewsListView({required this.newsModel});

  @override
  _NewsListViewState createState() => _NewsListViewState();
}

class _NewsListViewState extends State<NewsListView> {
  late ScrollController _controller;

  _scrollListener() {
    if (_controller.offset >= _controller.position.maxScrollExtent &&
        !_controller.position.outOfRange) {
      setState(() {
        print("reach the bottom");
      });
    }
    if (_controller.offset <= _controller.position.minScrollExtent &&
        !_controller.position.outOfRange) {
      setState(() {
        print("reach the top");
      });
    }
  }

  @override
  void initState() {
    _controller = ScrollController();
    _controller.addListener(_scrollListener);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    var articles = widget.newsModel.getArticleList;
    return Container(
      child: SingleChildScrollView(
        child: Container(
          padding: EdgeInsets.symmetric(horizontal: 16),
          child: Column(
            children: [
              ///Blogs
              Container(
                padding: EdgeInsets.only(top: 16),
                child: Expanded(
                  child: NotificationListener<ScrollNotification>(
                    onNotification: (scrollNotification) {
                      if (scrollNotification is ScrollNotification) {
                        print("sd");
                      }
                      if (scrollNotification is ScrollStartNotification) {
                        print("Start");
                      } else if (scrollNotification
                          is ScrollUpdateNotification) {
                        print("Update");
                        ;
                      } else if (scrollNotification is ScrollEndNotification) {
                        print("End");
                      }
                      return false;
                    },
                    child: ListView.builder(
                      controller: _controller,
                      shrinkWrap: true,
                      scrollDirection: Axis.vertical,
                      physics: const ClampingScrollPhysics(),
                      itemCount: articles.length,
                      itemBuilder: (context, index) {
                        return BlogTile(
                          title: articles[index].title,
                          desc: articles[index].description,
                          imageUrl: articles[index].urlImage,
                          url: articles[index].url,
                        );
                      },
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

可能是它与主题隔离。我怎么能做到。目标是分页ListView。在 NewsModel 中已经有 page 和 pageSize var!

标签: flutterlistviewscroll

解决方案


推荐阅读