Skip to content

Fix a scrolling stutter caused by dragging scrollbar #121786

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Mar 9, 2023

Conversation

xu-baolin
Copy link
Member

@xu-baolin xu-baolin commented Mar 2, 2023

Related #121574

@flutter-dashboard flutter-dashboard bot added f: scrolling Viewports, list views, slivers, etc. framework flutter/packages/flutter repository. See also f: labels. labels Mar 2, 2023
// position, and jump to that position.
final double scrollOffsetGlobal = scrollbarPainter.getTrackToScroll(primaryDelta + _startDragThumbOffset!);
double scrollOffsetGlobal = scrollbarPainter.getTrackToScroll(primaryDeltaFromDragStart + _startDragThumbOffset!);
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When the scroll metrics shrink, fall back to the previous logic(before #112434) and give up making the scrollbar follow the pointer. However, the stuttering of the bar is unavoidable as the metrics get bigger and smaller.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In this case, why would the scroll metrics shrink? The ListView's children don't change.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If I remember correctly, in the lazy loading list, it is estimated according to the size of the current item.

Copy link
Contributor

@HansMuller HansMuller Mar 3, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Interesting. That doesn't seem like a great heuristic in this case. Allowing the max scroll extents to shrink implies that we're guessing that items that have been scrolled out of view have become smaller because the current (in view) items are smaller. That could certainly happen, but it doesn't seem like a common case when the list's children aren't changing.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have checked a few native apps and seen that @xu-baolin's behavior here is the most common. The scrollbar will instead jump away from the pointer, but remain engaged with the drag gesture, allowing the pointer and the bar to continue separate from each other.
My first thought was to keep the thumb with the pointer and then update it after the drag is released, but that is not the behavior I am seeing on multiple apps on mobile and desktop.
Developers may want to be able to choose between the two, but I think for right now we should match the native behavior and maybe file an issue to see if there is interest in the other.

@xu-baolin xu-baolin requested a review from Piinks March 2, 2023 12:22
Copy link
Contributor

@Piinks Piinks left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for this @xu-baolin. I should be finished reviewing shortly

// position, and jump to that position.
final double scrollOffsetGlobal = scrollbarPainter.getTrackToScroll(primaryDelta + _startDragThumbOffset!);
double scrollOffsetGlobal = scrollbarPainter.getTrackToScroll(primaryDeltaFromDragStart + _startDragThumbOffset!);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have checked a few native apps and seen that @xu-baolin's behavior here is the most common. The scrollbar will instead jump away from the pointer, but remain engaged with the drag gesture, allowing the pointer and the bar to continue separate from each other.
My first thought was to keep the thumb with the pointer and then update it after the drag is released, but that is not the behavior I am seeing on multiple apps on mobile and desktop.
Developers may want to be able to choose between the two, but I think for right now we should match the native behavior and maybe file an issue to see if there is interest in the other.

Copy link
Contributor

@Piinks Piinks left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, I think there is still a lot of room for improvement on how we estimate the max scroll extent, but that is a separate issue. (I filed this a while back: #97676)

Thanks for the quick patch!

@Piinks Piinks added the autosubmit Merge PR when tree becomes green via auto submit App label Mar 9, 2023
@auto-submit auto-submit bot merged commit c0e748f into flutter:master Mar 9, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 9, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 10, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 10, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 10, 2023
hannah-hyj pushed a commit to hannah-hyj/flutter that referenced this pull request Mar 11, 2023
Fix a scrolling stutter caused by dragging scrollbar
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 11, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 12, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 10, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 10, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
autosubmit Merge PR when tree becomes green via auto submit App f: scrolling Viewports, list views, slivers, etc. framework flutter/packages/flutter repository. See also f: labels.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants