Ballistic scrolling broken if there are items with different heights

Demonstration:

The problem, as far as I can tell, is caused by RenderSliverList max scroll offset estimation changes during scrolling resulting in ScrollPosition.applyContentDimensions triggering unnecessary new ballistic activities.

Btw. Flutter Gallery License View seems to suffer from same issue.

[✓] Flutter (Channel master, v0.11.10-pre.3, on Mac OS X 10.14 18A389, locale en-US)
    • Flutter version 0.11.10-pre.3 at /Users/Matej/Projects/flutter/flutter
    • Framework revision 06e4ccc9a9 (8 hours ago), 2018-11-25 04:55:23 -0500
    • Engine revision 99e73d8c64
    • Dart version 2.1.0 (build 2.1.0-dev.9.4 f9ebf21297)

[✗] Android toolchain - develop for Android devices
    ✗ Unable to locate Android SDK.
      Install Android Studio from: https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the Android SDK components.
      (or visit https://flutter.io/setup/#android-setup for detailed instructions).
      If Android SDK has been installed to a custom location, set $ANDROID_HOME to that location.
      You may also want to add it to your PATH environment variable.


[✓] iOS toolchain - develop for iOS devices (Xcode 10.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 10.1, Build version 10B61
    • ios-deploy 1.9.4
    • CocoaPods version 1.5.3

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.io/setup/#android-setup for detailed instructions).

[!] IntelliJ IDEA Community Edition (version 2018.2.1)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
    • For information about installing plugins, see
      https://flutter.io/intellij-setup/#installing-the-plugins

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

[✓] Connected device (2 available)
    • Matej’s iPhone X • f7e7ead1f9b5f3e2574cfbd9bc264fbcd5772a6c • ios • iOS 12.1
    • iPhone 5s        • 824BB8C4-B563-40E4-9632-B8393A91C531     • ios • iOS 12.1 (simulator)

The stack trace from #11599 seems relevant. goBallistic calls are triggered every time viewport size estimation chages (which is frequent with uneven rows) and each goBallistic call brings scrolling to premature stop.

Persists with de v1.16.4-pre.33

Persists with current master 1.21.0-6.0.pre.38

flutter doctor -v

[✓] Flutter (Channel master, 1.21.0-6.0.pre.38, on Mac OS X 10.15.6 19G73, locale en-GB)
    • Flutter version 1.21.0-6.0.pre.38 at /Users/nevercode/dev/flutter
    • Framework revision 8e0eee9008 (5 hours ago), 2020-07-26 23:38:01 -0700
    • Engine revision 626244a72c
    • Dart version 2.9.0 (build 2.9.0-21.0.dev a3815b6590)
    • Pub download mirror https://pub.flutter-io.cn
    • Flutter download mirror https://storage.flutter-io.cn

 
[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
    • Android SDK at /Users/nevercode/Library/Android/sdk
    • Platform android-29, build-tools 29.0.3
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6222593)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 11.6)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.6, Build version 11E708
    • CocoaPods version 1.9.1

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

[✓] Android Studio (version 4.0)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 47.1.2
    • Dart plugin version 193.7361
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6222593)

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

[✓] Connected device (5 available)
    • Redmi Note 7 (mobile)       • 6345c469                                 • android-arm64  • Android 9 (API 28)
    • Nevercode’s iPhone (mobile) • b668e524315069f3db3661ac11ff1f66afafebdb • ios            • iOS 13.6
    • macOS (desktop)             • macos                                    • darwin-x64     • Mac OS X 10.15.6 19G73
    • Web Server (web)            • web-server                               • web-javascript • Flutter Tools
    • Chrome (web)                • chrome                                   • web-javascript • Google Chrome 84.0.4147.89

• No issues found!

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',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

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

class _MyHomePageState extends State<MyHomePage> {
  bool _wrapping = true;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("Ballistic Issues"),
          actions: <Widget>[
            Switch(
              activeColor: Colors.white,
              value: _wrapping,
              onChanged: (bool newValue) {
                setState(() {
                  _wrapping = newValue;
                });
              },
            )
          ],
        ),
        body: ListView.builder(
          itemBuilder: (BuildContext context, int index) {
            String text = "Item at $index";
            if (_wrapping && index % 7 == 0) {
              text += ". Very long label that should wrap. " +
                  "Very long label that should wrap.";
            }
            return Padding(
              padding: EdgeInsets.all(10.0),
              child: Text(
                text,
                style: Theme.of(context).textTheme.subhead,
              ),
            );
          },
          itemCount: 500,
        ));
  }
}

I'm not sure how useful it is, but I've been using this approach to fix it for a while. Might not be perfect but it works much better than the default behavior.

Do we need to restart the ballistic scroll at all when the dimensions change?

I think this particular bug was fixed by #59623, I cannot longer reproduce it. The fix in this PR seems to be more a workaround of a bug in #11599, but it works out.

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.

Navigation Menu

Repository navigation

Ballistic scrolling broken if there are items with different heights #24715

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Ballistic scrolling broken if there are items with different heights #24715

Description

Activity

knopp commented on Nov 26, 2018

VladyslavBondarenko commented on Apr 2, 2020

VladyslavBondarenko commented on Jul 27, 2020

knopp commented on Aug 29, 2020

Hixie commented on Aug 29, 2020

nt4f04uNd commented on Dec 18, 2021

github-actions commented on Jan 1, 2022

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions