Adds animateToItem to the CarouselController #162694

Mairramer · 2025-02-04T21:18:24Z

Closes #161368
This PR adds the animateToItem method to the CarouselController, enabling smooth, index-based navigation for carousels with fixed or dynamically-sized items (via flexWeights).

teste.mov

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.
I followed the breaking change policy and added Data Driven Fixes where supported.
All existing and new tests are passing.

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

flutter-dashboard · 2025-02-05T12:55:03Z

This pull request has been changed to a draft. The currently pending flutter-gold status will not be able to resolve until a new commit is pushed or the change is marked ready for review again.

For more guidance, visit Writing a golden file test for package:flutter.

Reviewers: Read the Tree Hygiene page and make sure this patch meets those guidelines before LGTMing.

QuncCccccc

Thanks so much for adding this new feature! Overall this looks great. Just left some thoughts below:)

QuncCccccc · 2025-02-12T07:42:17Z

packages/flutter/lib/src/material/carousel.dart

+
+  double _getTargetOffset(_CarouselPosition position, int index, bool hasFlexWeights) {
+    if (!hasFlexWeights) {
+      return index * _carouselState!._itemExtent!;


Should we constrain the index to between [0, children.length - 1]?

Although it doesn't cause an error, it results in a large scroll before returning to the last valid position. So yes, we can constrain the index.

Yes, we might want to assert that the index is in range.

packages/flutter/lib/src/material/carousel.dart

QuncCccccc · 2025-02-13T23:04:03Z

packages/flutter/lib/src/material/carousel.dart

+    final int totalWeight = weights.reduce((int a, int b) => a + b);
+    final double dimension = position.viewportDimension;
+
+    final bool isLastItem = index == carouselState.widget.children.length - 1;


I actually think only controlling the last item is not enough. When consumeMaxWeight is false, the behavior animating to other items is still different than when consumeMaxWeight is true.

Screen.Recording.2025-02-13.at.2.58.44.PM.mov

I made a small change to the logic, but I feel like I missed something.

Piinks · 2025-02-14T17:00:21Z

packages/flutter/test/material/carousel_test.dart

+    expect(realOffset(), controller.offset);
+  });
+
+  testWidgets('CarouselView animateToItem with flexWeights', (WidgetTester tester) async {


There should be several variants of this test, with different flex weights and numbers of children.

I just submitted several tests to cover various scenarios. If there is any missing, I will send it.

Piinks

Hey @Mairramer thanks for sending another PR! Some questions I wonder on this, how does setting a shrinkOffset affect this? Does this work when itemSnapping is true?

packages/flutter/test/material/carousel_test.dart

Mairramer · 2025-02-14T18:08:33Z

Hey @Mairramer thanks for sending another PR! Some questions I wonder on this, how does setting a shrinkOffset affect this? Does this work when itemSnapping is true?

Yes, works with itemSnapping.
About shrinkOffset I may have to adjust it, but I believe we won't have a problem (I'm trying to imagine some use cases).

QuncCccccc · 2025-02-19T18:48:00Z

packages/flutter/lib/src/material/carousel.dart

+    }
+
+    final bool hasFlexWeights = _carouselState!._flexWeights?.isNotEmpty ?? false;
+    index = index.clamp(0, _carouselState!.widget.children.length - 1);


NICE! Thanks!

packages/flutter/lib/src/material/carousel.dart

…oller

QuncCccccc

LGTM:) Thanks for adding the new feature!

packages/flutter/lib/src/material/carousel.dart

…oller

Piinks

This also LGTM, thank you!

…#162694)

flutter/flutter@2578d97...321fbc0 2025-03-06 [email protected] Roll Skia from fefecd49e03a to ccd8cc23aa94 (1 revision) (flutter/flutter#164712) 2025-03-06 [email protected] [web] Detect scrollable semantics nodes more reliably (flutter/flutter#164491) 2025-03-06 [email protected] [windows] wire the focus request and the focus events through the Windows platform (flutter/flutter#164296) 2025-03-06 [email protected] Roll Skia from 02897747c7d5 to fefecd49e03a (1 revision) (flutter/flutter#164701) 2025-03-06 [email protected] Roll Skia from e315b0ab7c84 to 02897747c7d5 (1 revision) (flutter/flutter#164677) 2025-03-06 [email protected] Roll Skia from 0c3880f94970 to e315b0ab7c84 (1 revision) (flutter/flutter#164669) 2025-03-06 [email protected] [Impeller] use device private on non-iOS devices. (flutter/flutter#164601) 2025-03-05 [email protected] Roll Skia from 43294a662fd0 to 0c3880f94970 (1 revision) (flutter/flutter#164661) 2025-03-05 [email protected] Add a workflow (only triggered from rest events) for hasing experiment (flutter/flutter#164657) 2025-03-05 [email protected] Roll Skia from 4cf9f0b77d41 to 43294a662fd0 (4 revisions) (flutter/flutter#164649) 2025-03-05 [email protected] Adds animateToItem to the CarouselController (flutter/flutter#162694) 2025-03-05 [email protected] Cleanup content context (flutter/flutter#164229) 2025-03-05 [email protected] Fix: Update CupertinoSheetRoute transition rounded corner (flutter/flutter#163700) 2025-03-05 [email protected] [Impeller] fix macOS managed memory. (flutter/flutter#164635) 2025-03-05 [email protected] [skwasm] Clear font collection cache when font is loaded manually. (flutter/flutter#164588) 2025-03-05 [email protected] Fix race condition causing crash when interacting with an animating scrollable (flutter/flutter#164392) 2025-03-05 [email protected] Use dwds 24.3.6 and pass uri for the reload scripts path to FrontendServerDdcLibraryBundleProvider (flutter/flutter#164582) 2025-03-05 [email protected] Roll Packages from 9e4684e to abba683 (8 revisions) (flutter/flutter#164630) 2025-03-05 [email protected] Roll Skia from 7e4323f72c9d to 4cf9f0b77d41 (1 revision) (flutter/flutter#164622) 2025-03-05 [email protected] Fix to Linux_pixel_7pro integration_ui_keyboard_resize test flakiness (flutter/flutter#162308) 2025-03-05 [email protected] Roll Skia from 03a3f653d64e to 7e4323f72c9d (1 revision) (flutter/flutter#164599) 2025-03-05 [email protected] Implement `clipPath` Mutator for hcpp (flutter/flutter#164525) 2025-03-05 98614782+auto-submit[bot]@users.noreply.github.com Reverts "[Impeller] use DeviceLocal textures for gifs on non-iOS devices. (#164573)" (flutter/flutter#164600) 2025-03-05 [email protected] [macos] prefer integrated GPU. (flutter/flutter#164569) 2025-03-05 [email protected] Enforce minSdk constraint for Android Flutter (flutter/flutter#164251) 2025-03-05 [email protected] Add `clipRSuperellipse`, and use them for dialogs (flutter/flutter#161111) 2025-03-05 [email protected] Roll Skia from 46705a22edc3 to 03a3f653d64e (1 revision) (flutter/flutter#164590) 2025-03-05 [email protected] when resetting FlutterPlatformViewsController, clear out some additional internal state to prevent it from carrying over across a Hot Restart (flutter/flutter#164456) 2025-03-05 [email protected] Roll Fuchsia Linux SDK from Rt6pxGFLVAJHduM0V... to fhm5z889sA5T1AQao... (flutter/flutter#164583) 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 [email protected],[email protected] 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://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

…#162694)

flutter/flutter@2578d97...321fbc0 2025-03-06 [email protected] Roll Skia from fefecd49e03a to ccd8cc23aa94 (1 revision) (flutter/flutter#164712) 2025-03-06 [email protected] [web] Detect scrollable semantics nodes more reliably (flutter/flutter#164491) 2025-03-06 [email protected] [windows] wire the focus request and the focus events through the Windows platform (flutter/flutter#164296) 2025-03-06 [email protected] Roll Skia from 02897747c7d5 to fefecd49e03a (1 revision) (flutter/flutter#164701) 2025-03-06 [email protected] Roll Skia from e315b0ab7c84 to 02897747c7d5 (1 revision) (flutter/flutter#164677) 2025-03-06 [email protected] Roll Skia from 0c3880f94970 to e315b0ab7c84 (1 revision) (flutter/flutter#164669) 2025-03-06 [email protected] [Impeller] use device private on non-iOS devices. (flutter/flutter#164601) 2025-03-05 [email protected] Roll Skia from 43294a662fd0 to 0c3880f94970 (1 revision) (flutter/flutter#164661) 2025-03-05 [email protected] Add a workflow (only triggered from rest events) for hasing experiment (flutter/flutter#164657) 2025-03-05 [email protected] Roll Skia from 4cf9f0b77d41 to 43294a662fd0 (4 revisions) (flutter/flutter#164649) 2025-03-05 [email protected] Adds animateToItem to the CarouselController (flutter/flutter#162694) 2025-03-05 [email protected] Cleanup content context (flutter/flutter#164229) 2025-03-05 [email protected] Fix: Update CupertinoSheetRoute transition rounded corner (flutter/flutter#163700) 2025-03-05 [email protected] [Impeller] fix macOS managed memory. (flutter/flutter#164635) 2025-03-05 [email protected] [skwasm] Clear font collection cache when font is loaded manually. (flutter/flutter#164588) 2025-03-05 [email protected] Fix race condition causing crash when interacting with an animating scrollable (flutter/flutter#164392) 2025-03-05 [email protected] Use dwds 24.3.6 and pass uri for the reload scripts path to FrontendServerDdcLibraryBundleProvider (flutter/flutter#164582) 2025-03-05 [email protected] Roll Packages from 9e4684e to abba683 (8 revisions) (flutter/flutter#164630) 2025-03-05 [email protected] Roll Skia from 7e4323f72c9d to 4cf9f0b77d41 (1 revision) (flutter/flutter#164622) 2025-03-05 [email protected] Fix to Linux_pixel_7pro integration_ui_keyboard_resize test flakiness (flutter/flutter#162308) 2025-03-05 [email protected] Roll Skia from 03a3f653d64e to 7e4323f72c9d (1 revision) (flutter/flutter#164599) 2025-03-05 [email protected] Implement `clipPath` Mutator for hcpp (flutter/flutter#164525) 2025-03-05 98614782+auto-submit[bot]@users.noreply.github.com Reverts "[Impeller] use DeviceLocal textures for gifs on non-iOS devices. (#164573)" (flutter/flutter#164600) 2025-03-05 [email protected] [macos] prefer integrated GPU. (flutter/flutter#164569) 2025-03-05 [email protected] Enforce minSdk constraint for Android Flutter (flutter/flutter#164251) 2025-03-05 [email protected] Add `clipRSuperellipse`, and use them for dialogs (flutter/flutter#161111) 2025-03-05 [email protected] Roll Skia from 46705a22edc3 to 03a3f653d64e (1 revision) (flutter/flutter#164590) 2025-03-05 [email protected] when resetting FlutterPlatformViewsController, clear out some additional internal state to prevent it from carrying over across a Hot Restart (flutter/flutter#164456) 2025-03-05 [email protected] Roll Fuchsia Linux SDK from Rt6pxGFLVAJHduM0V... to fhm5z889sA5T1AQao... (flutter/flutter#164583) 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 [email protected],[email protected] 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://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

github-actions bot added framework flutter/packages/flutter repository. See also f: labels. f: material design flutter/packages/flutter/material repository. labels Feb 4, 2025

Mairramer marked this pull request as draft February 5, 2025 12:50

Mairramer marked this pull request as ready for review February 5, 2025 12:55

Piinks requested review from Piinks and QuncCccccc February 5, 2025 19:22

QuncCccccc reviewed Feb 12, 2025

View reviewed changes

Mairramer requested a review from QuncCccccc February 12, 2025 12:48

QuncCccccc reviewed Feb 13, 2025

View reviewed changes

Mairramer added 6 commits February 14, 2025 08:32

feat: adds animateToItem to the CarouselController class

c262d10

dart fix

8661e3b

fix

ef30a88

fix

1207325

fix

d5540cf

small fixes

3f923d1

Mairramer force-pushed the feat/add-animateToItem-into-carousel-controller branch from 4c4e849 to 3f923d1 Compare February 14, 2025 11:32

improve logic

8b203db

Mairramer requested a review from QuncCccccc February 14, 2025 13:01

Piinks reviewed Feb 14, 2025

View reviewed changes

packages/flutter/test/material/carousel_test.dart Show resolved Hide resolved

test: addes a lot of tests

dd47ee0

fix outrange scrolling

5714a08

Mairramer requested a review from Piinks February 14, 2025 18:10

Mairramer added 2 commits February 14, 2025 15:28

fix

bf892db

fix

6b74821

QuncCccccc reviewed Feb 19, 2025

View reviewed changes

Mairramer and others added 2 commits February 19, 2025 16:03

small fixes

b866a07

Merge branch 'master' into feat/add-animateToItem-into-carousel-contr…

8239f21

…oller

fix

3b89a0b

Mairramer requested a review from QuncCccccc February 25, 2025 11:51

Merge branch 'master' into feat/add-animateToItem-into-carousel-contr…

c0e33fb

…oller

QuncCccccc approved these changes Feb 26, 2025

View reviewed changes

packages/flutter/lib/src/material/carousel.dart Outdated Show resolved Hide resolved

Mairramer and others added 6 commits February 26, 2025 16:00

nit

0f7de40

fix

f5d6df5

Merge branch 'master' into feat/add-animateToItem-into-carousel-contr…

af569f5

…oller

fix

d593d66

fix rebase

28a3d14

Merge branch 'master' into feat/add-animateToItem-into-carousel-contr…

86fc160

…oller

Piinks approved these changes Mar 5, 2025

View reviewed changes

Piinks added the autosubmit Merge PR when tree becomes green via auto submit App label Mar 5, 2025

auto-submit bot added this pull request to the merge queue Mar 5, 2025

Merged via the queue into flutter:master with commit 40e4c5e Mar 5, 2025
74 of 75 checks passed

flutter-dashboard bot removed the autosubmit Merge PR when tree becomes green via auto submit App label Mar 5, 2025

engine-flutter-autoroll mentioned this pull request Mar 6, 2025

Roll Flutter from 2578d97f32c8 to 099e6d39fe38 (27 revisions) flutter/packages#8806

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 6, 2025

40e4c5e Adds animateToItem to the CarouselController (flutter/flutter…

d697705

…#162694)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 6, 2025

40e4c5e Adds animateToItem to the CarouselController (flutter/flutter…

8e9b7c9

…#162694)

engine-flutter-autoroll mentioned this pull request Mar 6, 2025

Roll Flutter from 2578d97f32c8 to d778ed25a485 (28 revisions) flutter/packages#8807

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 6, 2025

40e4c5e Adds animateToItem to the CarouselController (flutter/flutter…

0c13645

…#162694)

engine-flutter-autoroll mentioned this pull request Mar 6, 2025

Roll Flutter from 2578d97f32c8 to 321fbc0e7e81 (29 revisions) flutter/packages#8808

Merged

Piinks mentioned this pull request Mar 7, 2025

Flutter Notable Commits - 2025 #161460

Open

Piinks mentioned this pull request Mar 25, 2025

✨ Implement animateToItem Method in CarouselController to Animate to Specific Item #161472

Closed

9 tasks

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

40e4c5e Adds animateToItem to the CarouselController (flutter/flutter…

3874222

…#162694)

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

40e4c5e Adds animateToItem to the CarouselController (flutter/flutter…

676b166

…#162694)

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

40e4c5e Adds animateToItem to the CarouselController (flutter/flutter…

b1ef859

…#162694)

Adds animateToItem to the CarouselController #162694

Adds animateToItem to the CarouselController #162694

Uh oh!

Conversation

Mairramer commented Feb 4, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Pre-launch Checklist

Uh oh!

flutter-dashboard bot commented Feb 5, 2025

Uh oh!

QuncCccccc left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Piinks left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Mairramer commented Feb 14, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

QuncCccccc left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Piinks left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Mairramer commented Feb 4, 2025 •

edited

Loading

Mairramer commented Feb 14, 2025 •

edited

Loading