Skip to content

GridView/SliverGrid infinity scroll when [builder] returns null and itemCount is not used #130685

Closed
#132511
Closed
GridView/SliverGrid infinity scroll when [builder] returns null and itemCount is not used#130685
#132511
Assignees
Piinks
Labels
P2Important issues not at the top of the work listf: scrollingViewports, list views, slivers, etc.found in release: 3.10Found to occur in 3.10found in release: 3.13Found to occur in 3.13frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onr: fixedIssue is closed as already fixed in a newer versionteam-frameworkOwned by Framework teamtriaged-frameworkTriaged by Framework team

Description

@AhmedLSayed9
AhmedLSayed9
opened on Jul 16, 2023

Is there an existing issue for this?

Steps to reproduce

  1. Run the sample.
  2. Scroll to the end of the grid view.

Expected results

The GridView should end when itemCount is not explicitly determined and the builder returns null at some point. This is necessary when you need a builder to create the elements on-demand. It works fine with ListView (included at the code sample).

As per API docs, if itemCount is null, the number of children is determined by the least index for which [builder] returns null.

Actual results

The GridView keep scrolling to infinite and sometimes bounce to the top of the list after some scrolling.

I suspect this behavior is occurring due to estimateMaxScrollOffset return infinite when childCount is null:

flutter/packages/flutter/lib/src/widgets/sliver.dart

Line 920 in 4f437d4

return double.infinity;

Code sample

Code sample 
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  final String title;

  const MyHomePage({
    Key? key,
    required this.title,
  }) : super(key: key);

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: GridView.builder(
        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3,
          crossAxisSpacing: 16,
          mainAxisSpacing: 16,
        ),
        itemBuilder: (context, index) {
          if (index == 12) return null;
          return Container(
            height: 100,
            width: 100,
            color: Colors.orange,
            alignment: Alignment.center,
            child: Text('item ${index+1}'),
          );
        },
      ),
      /*
      // Using ListView works fine:
      body: ListView.builder(
        itemBuilder: (context, index) {
          if (index == 12) return null;
          return Container(
            height: 100,
            width: 100,
            color: Colors.orange,
            alignment: Alignment.center,
            child: Text('item ${index+1}'),
          );
        },
      ),
      */
    );
  }
}

Flutter Doctor output

Doctor output 
[✓] Flutter (Channel stable, 3.10.5, on macOS 13.4.1 22F82 darwin-arm64, locale en-EG)
    • Flutter version 3.10.5 on channel stable at /Users/bx777/development/sdks/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 796c8ef792 (5 weeks ago), 2023-06-13 15:51:02 -0700
    • Engine revision 45f6e00911
    • Dart version 3.0.5
    • DevTools version 2.23.1

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
    • Android SDK at /Users/bx777/Library/Android/sdk
    • Platform android-33, build-tools 33.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.15+0-b2043.56-8887301)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14E300c
    • CocoaPods version 1.12.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.15+0-b2043.56-8887301)

[✓] VS Code (version 1.80.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.68.0

[✓] Connected device (3 available)
    • sdk gphone64 arm64 (mobile) • emulator-5554 • android-arm64  • Android 13 (API 33) (emulator)
    • macOS (desktop)             • macos         • darwin-arm64   • macOS 13.4.1 22F82 darwin-arm64
    • Chrome (web)                • chrome        • web-javascript • Google Chrome 114.0.5735.198

[✓] Network resources
    • All expected network resources are available.

• No issues found!

Activity

  1. dam-ease
    added
    in triagePresently being triaged by the triage team
    on Jul 17, 2023

  2. dam-ease commented on Jul 17, 2023

    @dam-ease
    dam-ease
    on Jul 17, 2023

    Hi @AhmedLSayed9. Thanks for filing this issue. I am able to reproduce this behavior on the latest master and stable channels.

    With GridView/SilverGrid With ListView
    Simulator.Screen.Recording.-.iPhone.14.Pro.-.2023-07-17.at.12.02.43.mp4
    Simulator.Screen.Recording.-.iPhone.14.Pro.-.2023-07-17.at.12.02.04.mp4
    flutter doctor -v 

    [✓] Flutter (Channel stable, 3.10.6, on macOS 13.0 22A380 darwin-arm64, locale
    en-NG)
    • Flutter version 3.10.6 on channel stable at
      /Users/damilolaalimi/sdks/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision f468f3366c (4 days ago), 2023-07-12 15:19:05 -0700
    • Engine revision cdbeda788a
    • Dart version 3.0.6
    • DevTools version 2.23.1

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/damilolaalimi/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /Applications/Android
      Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      17.0.6+0-17.0.6b802.4-9586694)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14E300c
    • CocoaPods version 1.12.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build
      17.0.6+0-17.0.6b802.4-9586694)

[✓] VS Code (version 1.80.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.60.0

[✓] Connected device (3 available)
    • iPhone 14 Pro Max (mobile) • BB55E997-7F31-462D-B3B1-6B177D9B40C7 • ios
      • com.apple.CoreSimulator.SimRuntime.iOS-16-4 (simulator)
    • macOS (desktop)            • macos                                •
      darwin-arm64   • macOS 13.0 22A380 darwin-arm64
    • Chrome (web)               • chrome                               •
      web-javascript • Google Chrome 114.0.5735.198

[✓] Network resources
    • All expected network resources are available.

• No issues found!

    [✓] Flutter (Channel master, 3.13.0-3.0.pre.91, on macOS 13.0 22A380 darwin-arm64, locale en-NG)
    • Flutter version 3.13.0-3.0.pre.91 on channel master at /Users/damilolaalimi/fvm/versions/master
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 5a866a031f (9 hours ago), 2023-07-16 17:36:30 -0700
    • Engine revision 683087731f
    • Dart version 3.1.0 (build 3.1.0-315.0.dev)
    • DevTools version 2.25.0

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/damilolaalimi/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b802.4-9586694)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14E300c
    • CocoaPods version 1.12.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b802.4-9586694)

[✓] VS Code (version 1.80.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.60.0

[✓] Connected device (3 available)
    • iPhone 14 Pro Max (mobile) • BB55E997-7F31-462D-B3B1-6B177D9B40C7 • ios            • com.apple.CoreSimulator.SimRuntime.iOS-16-4 (simulator)
    • macOS (desktop)            • macos                                • darwin-arm64   • macOS 13.0 22A380 darwin-arm64
    • Chrome (web)               • chrome                               • web-javascript • Google Chrome 114.0.5735.198

[✓] Network resources
    • All expected network resources are available.

• No issues found!

  3. dam-ease
    added
    frameworkflutter/packages/flutter repository. See also f: labels.
    f: scrollingViewports, list views, slivers, etc.
    has reproducible stepsThe issue has been confirmed reproducible and is ready to work on
    found in release: 3.10Found to occur in 3.10
    found in release: 3.12Found to occur in 3.12
    team-frameworkOwned by Framework team
    found in release: 3.13Found to occur in 3.13
    and removed
    in triagePresently being triaged by the triage team
    found in release: 3.12Found to occur in 3.12
    on Jul 17, 2023
  4. goderbauer
    added
    P2Important issues not at the top of the work list
    triaged-frameworkTriaged by Framework team
    on Jul 18, 2023

  5. xiaomanzijia commented on Jul 19, 2023

    @xiaomanzijia
    xiaomanzijia
    on Jul 19, 2023

    In theory, there would be no code like this because flutter 3.13 already supports null safety. The compilation error is as follows：

    Error: The value 'null' can't be returned from a function with return type 'Widget' because 'Widget' is not nullable.

    • 'Widget' is from 'package:flutter/src/widgets/framework.dart' ('../../../flutter/packages/flutter/lib/src/widgets/framework.dart').
      if (index == 12) return null;
      ^

  6. AhmedLSayed9 commented on Jul 19, 2023

    @AhmedLSayed9
    AhmedLSayed9
    on Jul 19, 2023
    ContributorAuthor

    In theory, there would be no code like this because flutter 3.13 already supports null safety.

    Does this mean itemCount will be required? or else, how will infinity list without an itemCount (on-demand items) determine when the list ends?

  7. Piinks
    self-assigned this
    on Aug 14, 2023
  8. auto-submit
    closed this as completedin #132511on Aug 15, 2023
  9. auto-submit
    added a commit that references this issue on Aug 15, 2023

    Fix extent for null returning builder in GridView (#132511)

    9d94279

  10. xiaomanzijia commented on Aug 15, 2023

    @xiaomanzijia
    xiaomanzijia
    on Aug 15, 2023 via email
  11. dam-ease
    added
    r: fixedIssue is closed as already fixed in a newer version
    on Aug 28, 2023

  12. github-actions commented on Sep 11, 2023

    @github-actions
    github-actionsbot
    on Sep 11, 2023

    This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

  13. github-actions
    locked as resolved and limited conversation to collaborators on Sep 11, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

P2Important issues not at the top of the work listf: scrollingViewports, list views, slivers, etc.found in release: 3.10Found to occur in 3.10found in release: 3.13Found to occur in 3.13frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onr: fixedIssue is closed as already fixed in a newer versionteam-frameworkOwned by Framework teamtriaged-frameworkTriaged by Framework team

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions