flutter / flutter

Flutter makes it easy and fast to build beautiful apps for mobile and beyond
https://flutter.dev
BSD 3-Clause "New" or "Revised" License
162.29k stars 26.66k forks source link

Navigator without transitions not working #147862

Closed aleripe closed 1 week ago

aleripe commented 1 week ago

Steps to reproduce

  1. Create a widget with a nested navigator and a no animation delegate (taken from Flutter documentation)
  2. Navigate using a MaterialPageRoute

Expected results

Navigation happens without any animation

Actual results

An unexpected animation with a dark background occurs

Code sample

Code sample ```dart import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Issue', theme: ThemeData( colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple), useMaterial3: true, ), home: const MyHomePage(title: 'Flutter Issue'), ); } } class MyHomePage extends StatefulWidget { const MyHomePage({super.key, required this.title}); final String title; @override State createState() => _MyHomePageState(); } class NoAnimationTransitionDelegate extends TransitionDelegate { @override Iterable resolve({ required List newPageRouteHistory, required Map locationToExitingPageRoute, required Map> pageRouteToPagelessRoutes, }) { final List results = []; for (final RouteTransitionRecord pageRoute in newPageRouteHistory) { if (pageRoute.isWaitingForEnteringDecision) { pageRoute.markForAdd(); } results.add(pageRoute); } for (final RouteTransitionRecord exitingPageRoute in locationToExitingPageRoute.values) { if (exitingPageRoute.isWaitingForExitingDecision) { exitingPageRoute.markForRemove(); final List? pagelessRoutes = pageRouteToPagelessRoutes[exitingPageRoute]; if (pagelessRoutes != null) { for (final RouteTransitionRecord pagelessRoute in pagelessRoutes) { pagelessRoute.markForRemove(); } } } results.add(exitingPageRoute); } return results; } } class _MyHomePageState extends State { final GlobalKey _navigatorKey = GlobalKey(); @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( backgroundColor: Theme.of(context).colorScheme.inversePrimary, title: Text(widget.title), ), body: Row( children: [ Flexible( child: ListView( children: [ ListTile( title: const Text('Page 1'), onTap: () => _navigatorKey.currentState!.pushNamed('page1'), ), ListTile( title: const Text('Page 2'), onTap: () => _navigatorKey.currentState!.pushNamed('page2'), ), ListTile( title: const Text('Page 3'), onTap: () => _navigatorKey.currentState!.pushNamed('page3'), ), ], ), ), Flexible( child: Navigator( key: _navigatorKey, initialRoute: '/', transitionDelegate: NoAnimationTransitionDelegate(), onGenerateRoute: (settings) { switch (settings.name) { case 'page2': return MaterialPageRoute( builder: (context) { return const Page2(); }, ); case 'page3': return MaterialPageRoute( builder: (context) { return const Page3(); }, ); default: return MaterialPageRoute( builder: (context) { return const Page1(); }, ); } }, ), ), ], ), ); } } class Page1 extends StatelessWidget { const Page1({super.key}); @override Widget build(BuildContext context) { return const Text('Page 1'); } } class Page2 extends StatelessWidget { const Page2({super.key}); @override Widget build(BuildContext context) { return const Text('Page 2'); } } class Page3 extends StatelessWidget { const Page3({super.key}); @override Widget build(BuildContext context) { return const Text('Page 3'); } } ```

Screenshots or Video

No response

Logs

No response

Flutter Doctor output

Doctor output ```console [√] Flutter (Channel stable, 3.16.8, on Microsoft Windows [Versione 10.0.19045.4355], locale it-IT) • Flutter version 3.16.8 on channel stable at C:\flutter • Upstream repository https://github.com/flutter/flutter.git • Framework revision 67457e669f (4 months ago), 2024-01-16 16:22:29 -0800 • Engine revision 6e2ea58a5c • Dart version 3.2.5 • DevTools version 2.28.5 [√] Windows Version (Installed version of Windows is version 10 or higher) [√] Android toolchain - develop for Android devices (Android SDK version 33.0.0) • Android SDK at C:\Users\Riperi\AppData\Local\Android\sdk • Platform android-33, build-tools 33.0.0 • Java binary at: C:\Program Files\Android\Android Studio\jbr\bin\java • Java version OpenJDK Runtime Environment (build 17.0.10+0--11572160) • All Android licenses accepted. [√] Chrome - develop for the web • Chrome at C:\Program Files (x86)\Google\Chrome\Application\chrome.exe [!] Visual Studio - develop Windows apps (Visual Studio Professional 2022 17.9.6) • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Professional • Visual Studio Professional 2022 version 17.9.34728.123 X Visual Studio is missing necessary components. Please re-run the Visual Studio installer for the "Desktop development with C++" workload, and include these components: MSVC v142 - VS 2019 C++ x64/x86 build tools - If there are multiple build tool versions available, install the latest C++ CMake tools for Windows Windows 10 SDK [√] Android Studio (version 2023.3) • Android Studio at C:\Program Files\Android\Android Studio • 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.10+0--11572160) [√] VS Code (version 1.89.0) • VS Code at C:\Users\Riperi\AppData\Local\Programs\Microsoft VS Code • Flutter extension version 3.46.0 [√] Connected device (3 available) • Windows (desktop) • windows • windows-x64 • Microsoft Windows [Versione 10.0.19045.4355] • Chrome (web) • chrome • web-javascript • Google Chrome 124.0.6367.91 • Edge (web) • edge • web-javascript • Microsoft Edge 124.0.2478.80 [√] Network resources • All expected network resources are available. ```
danagbemava-nc commented 1 week ago

Hi @aleripe, you appear to be using an older version of flutter, can you upgrade to the latest version of flutter stable (3.19.6) to see if you still experience this issue? If you do, please provide the updated output of flutter doctor -v.

Also, what platform(s) are you seeing this issue on?

aleripe commented 1 week ago

Hi @danagbemava-nc , I just updated with the same result (on web and Android)

[√] Flutter (Channel stable, 3.19.6, on Microsoft Windows [Versione 10.0.19045.4355], locale it-IT)
    • Flutter version 3.19.6 on channel stable at C:\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 54e66469a9 (3 weeks ago), 2024-04-17 13:08:03 -0700
    • Engine revision c4cd48e186
    • Dart version 3.3.4
    • DevTools version 2.31.1

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
    • Android SDK at C:\Users\Riperi\AppData\Local\Android\sdk
    • Platform android-33, build-tools 33.0.0
    • Java binary at: C:\Program Files\Android\Android Studio\jbr\bin\java
    • Java version OpenJDK Runtime Environment (build 17.0.10+0--11572160)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files (x86)\Google\Chrome\Application\chrome.exe

[!] Visual Studio - develop Windows apps (Visual Studio Professional 2022 17.9.6)
    • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Professional
    • Visual Studio Professional 2022 version 17.9.34728.123
    X Visual Studio is missing necessary components. Please re-run the Visual Studio installer for the "Desktop development with C++" workload, and include these components:       
        MSVC v142 - VS 2019 C++ x64/x86 build tools
         - If there are multiple build tool versions available, install the latest
        C++ CMake tools for Windows
        Windows 10 SDK

[√] Android Studio (version 2023.3)
    • Android Studio at C:\Program Files\Android\Android Studio
    • 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.10+0--11572160)

[√] VS Code (version 1.89.0)
    • VS Code at C:\Users\Riperi\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.46.0

[√] Connected device (3 available)
    • Windows (desktop) • windows • windows-x64    • Microsoft Windows [Versione 10.0.19045.4355]
    • Chrome (web)      • chrome  • web-javascript • Google Chrome 124.0.6367.91
    • Edge (web)        • edge    • web-javascript • Microsoft Edge 124.0.2478.80

[√] Network resources
    • All expected network resources are available.
danagbemava-nc commented 1 week ago

Hi @aleripe, can you try setting the pageTransitionsTheme of your ThemeData to a transition that doesn't use any animation to see if that helps?

You can define one like so

class NoAnimationTransitionBuilder extends PageTransitionsBuilder {
  const NoAnimationTransitionBuilder();
  @override
  Widget buildTransitions<T>(PageRoute<T> route, BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation, Widget child) {
    return child;
  }
}

and set the theme like below

theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        pageTransitionsTheme: const PageTransitionsTheme(
          builders: {
            TargetPlatform.android: NoAnimationTransitionBuilder(),
            TargetPlatform.iOS: NoAnimationTransitionBuilder(),
            TargetPlatform.linux: NoAnimationTransitionBuilder(),
            TargetPlatform.macOS: NoAnimationTransitionBuilder(),
            TargetPlatform.windows: NoAnimationTransitionBuilder(),
          },
        ),
aleripe commented 1 week ago

Hi @danagbemava-nc , I don't want to disable all transitions but just those in that specific navigator (to get rid of that grey background scrim).

danagbemava-nc commented 1 week ago

Thanks for the clarification.

Reproducible using the code sample provided above.

flutter doctor -v ``` [!] Flutter (Channel stable, 3.19.6, on macOS 14.4.1 23E224 darwin-arm64, locale en-GB) • Flutter version 3.19.6 on channel stable at /Users/nexus/dev/sdks/flutter ! Warning: `flutter` on your path resolves to /Users/nexus/dev/sdks/flutters/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutter. Consider adding /Users/nexus/dev/sdks/flutter/bin to the front of your path. ! Warning: `dart` on your path resolves to /Users/nexus/dev/sdks/flutters/bin/dart, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutter. Consider adding /Users/nexus/dev/sdks/flutter/bin to the front of your path. • Upstream repository https://github.com/flutter/flutter.git • Framework revision 54e66469a9 (3 weeks ago), 2024-04-17 13:08:03 -0700 • Engine revision c4cd48e186 • Dart version 3.3.4 • DevTools version 2.31.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 34.0.0) • Android SDK at /Users/nexus/Library/Android/sdk • Platform android-34, build-tools 34.0.0 • Java binary at: /Users/nexus/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314) • All Android licenses accepted. [✓] Xcode - develop for iOS and macOS (Xcode 15.3) • Xcode at /Applications/Xcode-15.3.0.app/Contents/Developer • Build 15E204a • CocoaPods version 1.15.2 [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 2023.1) • Android Studio at /Users/nexus/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.7+0-17.0.7b1000.6-10550314) [✓] IntelliJ IDEA Ultimate Edition (version 2023.2.5) • IntelliJ at /Users/nexus/Applications/IntelliJ IDEA Ultimate.app • Flutter plugin version 77.2.2 • Dart plugin version 232.10286 [✓] VS Code (version 1.88.1) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.88.0 [✓] Connected device (5 available) • Pixel 7 (mobile) • adb-28291FDH2001SA-5Lv71w._adb-tls-connect._tcp. • android-arm64 • Android 14 (API 34) • Nexus (mobile) • 00008020-001875E83A38002E • ios • iOS 17.4.1 21E236 • Dean’s iPad (mobile) • 00008103-000825C811E3401E • ios • iOS 17.4.1 21E236 • macOS (desktop) • macos • darwin-arm64 • macOS 14.4.1 23E224 darwin-arm64 • Chrome (web) • chrome • web-javascript • Google Chrome 124.0.6367.119 [✓] Network resources • All expected network resources are available. ! Doctor found issues in 1 category. ``` ``` [✓] Flutter (Channel master, 3.22.0-25.0.pre.6, on macOS 14.4.1 23E224 darwin-arm64, locale en-GB) • Flutter version 3.22.0-25.0.pre.6 on channel master at /Users/nexus/dev/sdks/flutters • Upstream repository https://github.com/flutter/flutter.git • Framework revision 05f1f342ea (9 hours ago), 2024-05-07 00:56:24 -0400 • Engine revision 80470584e1 • Dart version 3.5.0 (build 3.5.0-131.0.dev) • DevTools version 2.35.0 [✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0) • Android SDK at /Users/nexus/Library/Android/sdk • Platform android-34, build-tools 34.0.0 • Java binary at: /Users/nexus/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314) • All Android licenses accepted. [✓] Xcode - develop for iOS and macOS (Xcode 15.3) • Xcode at /Applications/Xcode-15.3.0.app/Contents/Developer • Build 15E204a • CocoaPods version 1.15.2 [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 2023.1) • Android Studio at /Users/nexus/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.7+0-17.0.7b1000.6-10550314) [✓] IntelliJ IDEA Ultimate Edition (version 2023.2.5) • IntelliJ at /Users/nexus/Applications/IntelliJ IDEA Ultimate.app • Flutter plugin version 77.2.2 • Dart plugin version 232.10286 [✓] VS Code (version 1.88.1) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.88.0 [✓] Connected device (6 available) • Pixel 7 (mobile) • adb-28291FDH2001SA-5Lv71w._adb-tls-connect._tcp. • android-arm64 • Android 14 (API 34) • Nexus (mobile) • 00008020-001875E83A38002E • ios • iOS 17.4.1 21E236 • Dean’s iPad (mobile) • 00008103-000825C811E3401E • ios • iOS 17.4.1 21E236 • macOS (desktop) • macos • darwin-arm64 • macOS 14.4.1 23E224 darwin-arm64 • Mac Designed for iPad (desktop) • mac-designed-for-ipad • darwin • macOS 14.4.1 23E224 darwin-arm64 • Chrome (web) • chrome • web-javascript • Google Chrome 124.0.6367.119 [✓] Network resources • All expected network resources are available. • No issues found! ```
goderbauer commented 1 week ago

Thank you for the report. As documented, the transitionDelegate is only considered for Page transitions (i.e. when the pages property changes), not for regular Route transitions:

The delegate used for deciding how routes transition in or off the screen during the pages updates.

https://main-api.flutter.dev/flutter/widgets/Navigator/transitionDelegate.html