AnimatedCrossFade size transition does not respect reverseDuration #127780

Activity

1. mernen commented on May 29, 2023

   

   mernen

   on May 29, 2023

   Last edited by mernen

   ContributorAuthor

   More actions

   While investigating this issue, I found something odd:

   The reverseDuration is passed on to AnimatedSize here:

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

   Lines 379 to 385 in cab21c2

   	child: AnimatedSize(
   	alignment: widget.alignment,
   	duration: widget.duration,
   	reverseDuration: widget.reverseDuration,
   	curve: widget.sizeCurve,
   	child: widget.layoutBuilder(topChild, topKey, bottomChild, bottomKey),
   	),

   But that doesn’t make much sense — AnimatedSize, being an implicitly animated widget, doesn’t have a concept of going forwards or backwards. Indeed, as far as I know, no other implicitly-animated widget (such as AnimatedOpacity or AnimatedScale) has a reverseDuration property.

   Going further, the reverseDuration manages to reach all the way into RenderAnimatedSize’s AnimationController:

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

   Lines 87 to 91 in cab21c2

   	_controller = AnimationController(
   	vsync: vsync,
   	duration: duration,
   	reverseDuration: reverseDuration,
   	)..addListener(() {

   …but, as far as I can tell, this is never used, since this controller only goes forward().

   So it seems to me that this property should be deprecated and eventually removed from AnimatedSize and RenderAnimatedSize, and AnimatedCrossFade should take the responsibility of passing AnimatedSize the appropriate duration.
2. huycozy

   added

   in triagePresently being triaged by the triage teamPresently being triaged by the triage team

   on May 29, 2023
3. huycozy commented on May 29, 2023

   

   huycozy

   on May 29, 2023

   Member

   More actions

   Hi @mernen
   I'm not sure I'm seeing this clearly, but I'm seeing the same duration between the size transition going forward and back. The only difference that can be clear to see is that when returning to firstChild from secondChild (with showFirst), the width of the blue Container quickly shrinks to the target size. Is the issue there?
4. huycozy

   added

   waiting for responseThe Flutter team cannot make further progress on this issue until the original reporter respondsThe Flutter team cannot make further progress on this issue until the original reporter responds

   on May 29, 2023
5. mernen commented on May 29, 2023

   

   mernen

   on May 29, 2023

   ContributorAuthor

   More actions

   The duration is set to 1 second, and reverseDuration is set to 5 seconds. The size transition (on the black border) is always 1 second long, though, i.e. it's always using duration, and never reverseDuration.

   The size clipping looks bad but it's entirely unrelated — I apologize for the confusion this causes. I'll adjust the demo later so we have a clearer illustration.
6. github-actions

   removed

   waiting for responseThe Flutter team cannot make further progress on this issue until the original reporter respondsThe Flutter team cannot make further progress on this issue until the original reporter responds

   on May 29, 2023
7. mernen commented on May 29, 2023

   

   mernen

   on May 29, 2023

   ContributorAuthor

   More actions

   @huycozy I've updated the linked DartPad, the video, and the explanation of what to observe. Hopefully this will make things clearer.
8. huycozy commented on May 30, 2023

   

   huycozy

   on May 30, 2023

   Member

   More actions

   Thank you for updating the sample, it's more evident than previous one. Reproduced this issue on the latest stable and master channels.

   flutter doctor -v (stable and master)

   [✓] Flutter (Channel stable, 3.10.2, on macOS 13.0.1 22A400 darwin-x64, locale en-VN)
       • Flutter version 3.10.2 on channel stable at /Users/huynq/Documents/GitHub/flutter
       • Upstream repository https://github.com/flutter/flutter.git
       • Framework revision 9cd3d0d9ff (22 hours ago), 2023-05-23 20:57:28 -0700
       • Engine revision 90fa3ae28f
       • Dart version 3.0.2
       • DevTools version 2.23.1
   
   [✓] Android toolchain - develop for Android devices (Android SDK version 32.0.0)
       • Android SDK at /Users/huynq/Library/Android/sdk
       • Platform android-33, build-tools 32.0.0
       • ANDROID_HOME = /Users/huynq/Library/Android/sdk
       • 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)
       • Xcode at /Applications/Xcode.app/Contents/Developer
       • Build 14E222b
       • CocoaPods version 1.11.3
   
   [✓] 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.78.1)
       • VS Code at /Applications/Visual Studio Code.app/Contents
       • Flutter extension version 3.64.0
   
   [✓] Connected device (3 available)
       • RMX2001 (mobile) • EUYTFEUSQSRGDA6D • android-arm64  • Android 11 (API 30)
       • macOS (desktop)  • macos            • darwin-x64     • macOS 13.0.1 22A400 darwin-x64
       • Chrome (web)     • chrome           • web-javascript • Google Chrome 113.0.5672.126
   
   [✓] Network resources
       • All expected network resources are available.
   
   • No issues found!

   [!] Flutter (Channel master, 3.11.0-14.0.pre.73, on macOS 13.0.1 22A400 darwin-x64, locale en-VN)
       • Flutter version 3.11.0-14.0.pre.73 on channel master at /Users/huynq/Documents/GitHub/flutter_master
       ! Warning: `flutter` on your path resolves to /Users/huynq/Documents/GitHub/flutter/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/huynq/Documents/GitHub/flutter_master. Consider adding /Users/huynq/Documents/GitHub/flutter_master/bin to the front of your path.
       ! Warning: `dart` on your path resolves to /Users/huynq/Documents/GitHub/flutter/bin/dart, which is not inside your current Flutter SDK checkout at /Users/huynq/Documents/GitHub/flutter_master. Consider adding /Users/huynq/Documents/GitHub/flutter_master/bin to the front of your path.
       • Upstream repository https://github.com/flutter/flutter.git
       • Framework revision 59128bd61e (49 minutes ago), 2023-05-29 22:35:15 -0400
       • Engine revision 93a8d41549
       • Dart version 3.1.0 (build 3.1.0-155.0.dev)
       • DevTools version 2.23.1
       • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.
   
   [✓] Android toolchain - develop for Android devices (Android SDK version 32.0.0)
       • Android SDK at /Users/huynq/Library/Android/sdk
       • Platform android-33, build-tools 32.0.0
       • ANDROID_HOME = /Users/huynq/Library/Android/sdk
       • 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)
       • Xcode at /Applications/Xcode.app/Contents/Developer
       • Build 14E222b
       • CocoaPods version 1.11.3
   
   [✓] 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.78.2)
       • VS Code at /Applications/Visual Studio Code.app/Contents
       • Flutter extension version 3.64.0
   
   [✓] Connected device (3 available)
       • RMX2001 (mobile) • EUYTFEUSQSRGDA6D • android-arm64  • Android 11 (API 30)
       • macOS (desktop)  • macos            • darwin-x64     • macOS 13.0.1 22A400 darwin-x64
       • Chrome (web)     • chrome           • web-javascript • Google Chrome 113.0.5672.126
   
   [✓] Network resources
       • All expected network resources are available.
   
   ! Doctor found issues in 1 category.
9. huycozy

   added

   frameworkflutter/packages/flutter repository. See also f: labels.flutter/packages/flutter repository. See also f: labels.

   a: animationAnimation APIsAnimation APIs

   p: material_uimaterial_ui package in flutter/packagesmaterial_ui package in flutter/packages

   has reproducible stepsThe issue has been confirmed reproducible and is ready to work onThe issue has been confirmed reproducible and is ready to work on

   found in release: 3.10Found to occur in 3.10Found to occur in 3.10

   found in release: 3.11Found to occur in 3.11Found to occur in 3.11

   and removed

   in triagePresently being triaged by the triage teamPresently being triaged by the triage team

   on May 30, 2023
10. HansMuller

    removed

    p: material_uimaterial_ui package in flutter/packagesmaterial_ui package in flutter/packages

    on May 31, 2023
11. goderbauer

    added

    P2Important issues not at the top of the work listImportant issues not at the top of the work list

    on Jun 6, 2023
12. flutter-triage-bot

    added

    team-frameworkOwned by Framework teamOwned by Framework team

    triaged-frameworkTriaged by Framework teamTriaged by Framework team

    on Jul 8, 2023
13. auto-submit

    closed this as completedin #194860on Nov 6, 2026
14. patevs

    added a commit that references this issue on Nov 6, 2026

    Use reverseDuration for the AnimatedCrossFade size animation (flutter…

    ...

    This issue will close once commit eea8e06 is merged into the 'master' branch.

    eea8e06