TwoDimensional scrolling foundation #125437

Piinks · 2023-04-24T20:45:27Z

From the 2D scrolling proposal: flutter.dev/go/2D-Foundation ✅ updated 4/25

Follow up issues:

This adds a mostly abstract foundation for 2D scrolling in Flutter.

With these base classes, developers will be able to construct widgets that scroll in both dimensions and can lazily load their children for the best performance. This implementation is meant to be flexible in order to support different kinds of 2D compositions, from tables to scatter plots.

The upcoming TableView, TreeView, etc widgets (coming soon in flutter/packages) are built on top of this foundation.

Pre-launch Checklist

I read the Contributor Guide and followed the process outlined there for submitting PRs.
I read the Tree Hygiene wiki page, which explains my responsibilities.
I read and followed the Flutter Style Guide, including Features we expect every widget to implement.
I signed the CLA.
I listed at least one issue that this PR fixes in the description above.
I updated/added relevant documentation (doc comments with ///).
I added new tests to check the change I am making, or this PR is test-exempt.
All existing and new tests are passing.

If you need help, consider asking for advice on the #hackers-new channel on Discord.

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

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

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

goderbauer · 2023-04-25T08:30:50Z

I'll have to block some time to look at this. In the meantime, can you make the checks pass?

Piinks · 2023-04-25T16:04:58Z

I'll have to block some time to look at this.

Of course! Take your time. :)

In the meantime, can you make the checks pass?

Oof sorry! I thought I caught all of them. On it!

Piinks · 2023-04-25T18:30:20Z

packages/flutter/test/widgets/two_dimensional_viewport_test.dart

+      xLayoutOffset += 200;
+    }
+    if (applyDimensions) {
+      verticalOffset.applyContentDimensions(0, 200 * 100 - viewportDimension.height);


This is the only thing I am still unsure of. I tried to write some logic to estimate the max scroll extent for the user, but it was really hard to guess what they were building or how long it would be in one or both dimensions.

So right now, the user has to call applyContentDimensions. I currently have a check that will tell them to do so if they have not.

The other thing I considered was exposing a maxScrollOffset getter that the subclasses would have to implement, and then the super class could call applyContentDimensions with that at the end of performLayout.

I like the getter approach, curious to know what you think first though. :)

Either seems fine to me. If we want people to call applyContentDimensions within layoutChildSequence we should document that, though. The getter may be a little less flexible (which could be fine), but simpler to implement.

goderbauer

Comments from initial read-through to familiarize myself with this large PR. It's not a full review yet and I didn't get to two_dimensional_viewport.dart and the test file yet.

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

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

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

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

Piinks · 2023-05-01T22:00:22Z

I am having branch issues. I really do not want to close this, but the Github UI is not updating with the code.

Piinks · 2023-05-01T23:09:45Z

Ok I think my branch issues are behind me. I responded to the last review and left a few questions for feedback. I will push tests next now that I have everything fixed.

goderbauer

Finished initial read-through of the last few remaining files.

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

packages/flutter/test/widgets/two_dimensional_viewport_test.dart

goderbauer · 2023-05-02T13:27:50Z

packages/flutter/test/widgets/two_dimensional_viewport_test.dart

+      xLayoutOffset += 200;
+    }
+    if (applyDimensions) {
+      verticalOffset.applyContentDimensions(0, 200 * 100 - viewportDimension.height);


Either seems fine to me. If we want people to call applyContentDimensions within layoutChildSequence we should document that, though. The getter may be a little less flexible (which could be fine), but simpler to implement.

goderbauer

Overall, this LGTM. It is missing some test coverage, though.

goderbauer · 2023-05-08T07:26:59Z

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

+  /// Subclasses must implement this function and will typically wrap their
+  /// children in [RepaintBoundary] widgets.
+  ///
+  /// The values returned by this method are cached. To indicate that the


Can you also just call "notifyListeners" as the class level comment indicated?

I think so, added more to the doc.

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

goderbauer · 2023-05-08T09:03:28Z

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

+    for (final RenderBox child in _children.values) {
+      final TwoDimensionalViewportParentData childParentData = parentDataOf(child);
+      final Rect childRect = childParentData.paintOffset & child.size;
+      if (childRect.contains(position)) {


Doesn't child.hitTest below already contain this check?

flutter/packages/flutter/lib/src/rendering/box.dart

Line 2478 in 65dfb55

if (_size!.contains(position)) {

Excellent point, fixed!

Looks like this wasn't resolved after all?

Oh right. I changed it, and then had a bug and ended up writing it back in. Let me double check. Thanks for pointing it out! I did not realize I ended up reverting it.

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

goderbauer · 2023-05-08T09:22:32Z

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

+  void _startLayout();
+  void _buildChild(ChildVicinity index);
+  void _reuseChild(ChildVicinity index);
+  void _endLayout();


Maybe consider making the methods public. That way, people can implement their own TwoDimensionalChildManager if they wanted to and having a public class with no visible methods is kinda strange.

Yeah, I think that is where we started a conversation about finding a way to make it private.
Would folks actually be able to implement their own? So much of the implementation relies on private class members.

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

goderbauer

Overall, this LGTM. It is missing some test coverage, though. :)

goderbauer

LGTM

goderbauer · 2023-05-26T18:25:35Z

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

+    for (final RenderBox child in _children.values) {
+      final TwoDimensionalViewportParentData childParentData = parentDataOf(child);
+      final Rect childRect = childParentData.paintOffset & child.size;
+      if (childRect.contains(position)) {


Looks like this wasn't resolved after all?

flutter/flutter@ee162e4...3db9504 2023-05-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 340936f7c03c to a4d4ad9dae1a (1 revision) (flutter/flutter#127772) 2023-05-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from 57e491a46e05 to 340936f7c03c (1 revision) (flutter/flutter#127767) 2023-05-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from a37b1a38d97a to 57e491a46e05 (1 revision) (flutter/flutter#127765) 2023-05-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from b1698020bd57 to a37b1a38d97a (1 revision) (flutter/flutter#127761) 2023-05-27 engine-flutter-autoroll@skia.org Roll Flutter Engine from 9e97c7379c7f to b1698020bd57 (1 revision) (flutter/flutter#127758) 2023-05-27 engine-flutter-autoroll@skia.org Roll Flutter Engine from 0f38a0f0a18a to 9e97c7379c7f (1 revision) (flutter/flutter#127755) 2023-05-27 engine-flutter-autoroll@skia.org Roll Flutter Engine from 1187168472a7 to 0f38a0f0a18a (1 revision) (flutter/flutter#127752) 2023-05-27 engine-flutter-autoroll@skia.org Roll Flutter Engine from 3426cb827efb to 1187168472a7 (1 revision) (flutter/flutter#127745) 2023-05-27 engine-flutter-autoroll@skia.org Roll Flutter Engine from 795db50e7453 to 3426cb827efb (9 revisions) (flutter/flutter#127738) 2023-05-27 tessertaha@gmail.com Updated the `ToggleButtons` API doc to link to `SegmentedButton` (flutter/flutter#127021) 2023-05-26 nbosch@google.com Remove more `test_api/src` imports (flutter/flutter#127716) 2023-05-26 31859944+LongCatIsLooong@users.noreply.github.com Move shared inline widget logic to `RenderInlineWidgetContainerDefaults` (flutter/flutter#127308) 2023-05-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from 3b5b5fc96b8f to 795db50e7453 (1 revision) (flutter/flutter#127720) 2023-05-26 pq@users.noreply.github.com Update collection-fors to prefer final (as per updated `prefer_final_in_for_each`) (flutter/flutter#127511) 2023-05-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from eed12f36f595 to 3b5b5fc96b8f (1 revision) (flutter/flutter#127713) 2023-05-26 gspencergoog@users.noreply.github.com Remove references to deprecated `ThemeData.primaryColorBrightness` (flutter/flutter#127238) 2023-05-26 katelovett@google.com TwoDimensional scrolling foundation (flutter/flutter#125437) 2023-05-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from 858d9753453c to eed12f36f595 (2 revisions) (flutter/flutter#127702) 2023-05-26 36861262+QuncCccccc@users.noreply.github.com Remove button announcement for `MenuItemButton` and `SubmenuButton` (flutter/flutter#127620) 2023-05-26 chillers@google.com Reland "Update labeler action wildcards #127524" (flutter/flutter#127690) 2023-05-26 vashworth@google.com Revert "Log all lines from ios-deploy (#127502)" (flutter/flutter#127684) 2023-05-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from ec7b0ae3599f to 858d9753453c (2 revisions) (flutter/flutter#127700) 2023-05-26 tessertaha@gmail.com Add M3 date range picker tests and fix header background theme color (flutter/flutter#127662) 2023-05-26 reidbaker@google.com Support minifcation for apps that depend on AGP 8 and integration_test (flutter/flutter#127628) 2023-05-26 gspencergoog@users.noreply.github.com Bump Snippet version (flutter/flutter#127688) 2023-05-26 chris@bracken.jp [Linux] Use up_client_get_devices2 when possible (flutter/flutter#127699) 2023-05-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from 84f2fc16e55d to ec7b0ae3599f (3 revisions) (flutter/flutter#127698) 2023-05-26 5236035+fzyzcjy@users.noreply.github.com Fix `TextField` error in production environment because it wrongly uses ancestor render boxes (flutter/flutter#126324) 2023-05-26 127535196+JsGjKJzi@users.noreply.github.com Interactive viewer doesn't appear to respect the trackpadScrollCausesScale parameter (flutter/flutter#127114) 2023-05-26 chillers@google.com Remove release timeline (flutter/flutter#127685) 2023-05-26 engine-flutter-autoroll@skia.org Manual roll Flutter Engine from 8573f3b63a1f to 84f2fc16e55d (7 revisions) (flutter/flutter#127676) If this roll has caused a breakage, revert this CL and stop the roller using the controls here: https://autoroll.skia.org/r/flutter-packages Please CC bmparr@google.com,rmistry@google.com,stuartmorgan@google.com on the revert to ensure that a human is aware of the problem. To file a bug in Packages: https://github.com/flutter/flutter/issues/new/choose To report a problem with the AutoRoller itself, please file a bug: https://bugs.chromium.org/p/skia/issues/entry?template=Autoroller+Bug Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

x4080 · 2023-08-10T22:20:20Z

hello, how can I use this ? is there any example ?

Thanks

flutter-dashboard bot added f: scrolling Viewports, list views, slivers, etc. framework flutter/packages/flutter repository. See also f: labels. labels Apr 24, 2023

Piinks requested a review from goderbauer April 24, 2023 20:45

Piinks commented Apr 24, 2023

View reviewed changes

packages/flutter/lib/src/widgets/scroll_delegate.dart Outdated Show resolved Hide resolved

Piinks commented Apr 24, 2023

View reviewed changes

packages/flutter/lib/src/widgets/scroll_delegate.dart Outdated Show resolved Hide resolved

Piinks commented Apr 24, 2023

View reviewed changes

packages/flutter/lib/src/widgets/scrollable.dart Outdated Show resolved Hide resolved

Piinks commented Apr 24, 2023

View reviewed changes

packages/flutter/lib/src/widgets/two_dimensional_viewport.dart Outdated Show resolved Hide resolved

Piinks commented Apr 24, 2023

View reviewed changes

packages/flutter/lib/src/widgets/two_dimensional_viewport.dart Outdated Show resolved Hide resolved

Piinks commented Apr 25, 2023

View reviewed changes

Piinks mentioned this pull request Apr 25, 2023

Add 2D scrolling foundation to the framework #125505

Closed

Piinks changed the title ~~[WIP] TwoDimensional* Foundation~~ [WIP] TwoDimensional scrolling foundation Apr 25, 2023

Piinks added the c: new feature Nothing broken; request for a new capability label Apr 25, 2023

Piinks force-pushed the 2DTime branch from eef0e1d to 367966c Compare April 25, 2023 18:53

goderbauer reviewed Apr 26, 2023

View reviewed changes

Piinks commented Apr 26, 2023

View reviewed changes

packages/flutter/lib/src/widgets/two_dimensional_scroll_view.dart Show resolved Hide resolved

Piinks force-pushed the 2DTime branch 4 times, most recently from 0ad8747 to b3add8d Compare May 1, 2023 21:57

goderbauer reviewed May 2, 2023

View reviewed changes

Piinks force-pushed the 2DTime branch from 1eb345b to 1c86a0f Compare May 4, 2023 00:46

Piinks requested a review from goderbauer May 4, 2023 00:53

goderbauer reviewed May 8, 2023

View reviewed changes

This was referenced May 8, 2023

2D Follow up: Keep alive support #126297

Closed

2D Follow up: More sample code #126298

Open

Tweak doc

331a529

goderbauer approved these changes May 26, 2023

View reviewed changes

Fix hit test regression

77310f4

Piinks added framework flutter/packages/flutter repository. See also f: labels. f: scrolling Viewports, list views, slivers, etc. labels May 26, 2023

Merge branch 'master' into 2DTime

97effc1

github-actions bot removed f: scrolling Viewports, list views, slivers, etc. framework flutter/packages/flutter repository. See also f: labels. labels May 26, 2023

Piinks added f: scrolling Viewports, list views, slivers, etc. framework flutter/packages/flutter repository. See also f: labels. autosubmit Merge PR when tree becomes green via auto submit App labels May 26, 2023

auto-submit bot merged commit 0f1a95d into flutter:master May 26, 2023
71 checks passed

engine-flutter-autoroll mentioned this pull request May 27, 2023

Roll Flutter from ee162e4b7f4f to fe22aaca5d6c (24 revisions) flutter/packages#4094

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 27, 2023

0f1a95d19 TwoDimensional scrolling foundation (flutter/flutter#125437)

ed05ea0

engine-flutter-autoroll mentioned this pull request May 27, 2023

Roll Flutter from ee162e4b7f4f to fe22aaca5d6c (24 revisions) flutter/packages#4095

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 27, 2023

0f1a95d19 TwoDimensional scrolling foundation (flutter/flutter#125437)

979f4c9

engine-flutter-autoroll mentioned this pull request May 27, 2023

Roll Flutter from ee162e4b7f4f to c23aadc77cc1 (25 revisions) flutter/packages#4096

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 27, 2023

0f1a95d19 TwoDimensional scrolling foundation (flutter/flutter#125437)

4fbe929

engine-flutter-autoroll mentioned this pull request May 28, 2023

Roll Flutter from ee162e4b7f4f to 08b06137349e (30 revisions) flutter/packages#4097

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 28, 2023

0f1a95d19 TwoDimensional scrolling foundation (flutter/flutter#125437)

dd53c13

engine-flutter-autoroll mentioned this pull request May 28, 2023

Roll Flutter from ee162e4b7f4f to 3db9504dcda2 (31 revisions) flutter/packages#4098

Merged

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 28, 2023

0f1a95d19 TwoDimensional scrolling foundation (flutter/flutter#125437)

277f81a

HansMuller mentioned this pull request Jun 2, 2023

Flutter Framework Team: Notable Commits #121415

Open

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 16, 2023

0f1a95d19 TwoDimensional scrolling foundation (flutter/flutter#125437)

1c194be

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 17, 2023

0f1a95d19 TwoDimensional scrolling foundation (flutter/flutter#125437)

873784b

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 17, 2023

0f1a95d19 TwoDimensional scrolling foundation (flutter/flutter#125437)

99bb376

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 17, 2023

0f1a95d19 TwoDimensional scrolling foundation (flutter/flutter#125437)

0f82991

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

TwoDimensional scrolling foundation #125437

TwoDimensional scrolling foundation #125437

Piinks commented Apr 24, 2023 •

edited

goderbauer commented Apr 25, 2023

Piinks commented Apr 25, 2023

Piinks Apr 25, 2023

goderbauer May 2, 2023

goderbauer left a comment

Piinks commented May 1, 2023

Piinks commented May 1, 2023

goderbauer left a comment

goderbauer May 2, 2023

goderbauer left a comment

goderbauer May 8, 2023

Piinks May 8, 2023

goderbauer May 8, 2023

Piinks May 8, 2023

goderbauer May 26, 2023

Piinks May 26, 2023

goderbauer May 8, 2023

Piinks May 8, 2023

goderbauer left a comment

goderbauer left a comment

goderbauer May 26, 2023

x4080 commented Aug 10, 2023

TwoDimensional scrolling foundation #125437

TwoDimensional scrolling foundation #125437

Conversation

Piinks commented Apr 24, 2023 • edited

Pre-launch Checklist

goderbauer commented Apr 25, 2023

Piinks commented Apr 25, 2023

Choose a reason for hiding this comment

Choose a reason for hiding this comment

goderbauer left a comment

Choose a reason for hiding this comment

Piinks commented May 1, 2023

Piinks commented May 1, 2023

goderbauer left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

goderbauer left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

goderbauer left a comment

Choose a reason for hiding this comment

goderbauer left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

x4080 commented Aug 10, 2023

Piinks commented Apr 24, 2023 •

edited