Breaking News: Grepper is joining You.com. Read the official announcement!

flutter infinite scroll listview

YOU.com answered on September 11, 2023 Popularity 6/10 Helpfulness 3/10

answer flutter infinite scroll listview

flutter infinite scroll listview

Comment

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Infinite Scroll ListView'),
        ),
        body: InfiniteScrollListView(),
      ),
    );
  }
}

class InfiniteScrollListView extends StatefulWidget {
  @override
  _InfiniteScrollListViewState createState() => _InfiniteScrollListViewState();
}

class _InfiniteScrollListViewState extends State<InfiniteScrollListView> {
  ScrollController _scrollController = ScrollController();
  List<String> _listItems = List.generate(20, (index) => 'Item ${index + 1}');
  bool _isLoading = false;

  @override
  void initState() {
    super.initState();
    _scrollController.addListener(_scrollListener);
  }

  @override
  void dispose() {
    _scrollController.removeListener(_scrollListener);
    _scrollController.dispose();
    super.dispose();
  }

  void _scrollListener() {
    if (_scrollController.offset >= _scrollController.position.maxScrollExtent &&
        !_scrollController.position.outOfRange) {
      setState(() {
        _isLoading = true;
      });

      // Simulate a delay to fetch more data
      Future.delayed(Duration(seconds: 2), () {
        setState(() {
          _listItems.addAll(
              List.generate(20, (index) => 'Item ${_listItems.length + index + 1}'));
          _isLoading = false;
        });
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      itemCount: _listItems.length + 1,
      itemBuilder: (context, index) {
        if (index == _listItems.length) {
          return _isLoading
              ? Center(child: CircularProgressIndicator())
              : Container();
        }
        return ListTile(
          title: Text(_listItems[index]),
        );
      },
      controller: _scrollController,
    );
  }
}

Popularity 6/10 Helpfulness 3/10 Language dart

Source: Grepper

Link to this answer
Share Copy Link

Contributed on Sep 11 2023

YOU.com

0 Answers Avg Quality 2/10

flutter infinite scroll listview

Contents

More Related Answers

flutter infinite scroll listview

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.