Navigator without transitions not working #147862

aleripe · 2024-05-06T13:39:24Z

Steps to reproduce

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

Expected results

Navigation happens without any animation

Actual results

An unexpected animation with a dark background occurs

Code sample

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<MyHomePage> createState() => _MyHomePageState();
}

class NoAnimationTransitionDelegate extends TransitionDelegate<void> {
  @override
  Iterable<RouteTransitionRecord> resolve({
    required List<RouteTransitionRecord> newPageRouteHistory,
    required Map<RouteTransitionRecord?, RouteTransitionRecord>
        locationToExitingPageRoute,
    required Map<RouteTransitionRecord?, List<RouteTransitionRecord>>
        pageRouteToPagelessRoutes,
  }) {
    final List<RouteTransitionRecord> results = <RouteTransitionRecord>[];

    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<RouteTransitionRecord>? pagelessRoutes =
            pageRouteToPagelessRoutes[exitingPageRoute];
        if (pagelessRoutes != null) {
          for (final RouteTransitionRecord pagelessRoute in pagelessRoutes) {
            pagelessRoute.markForRemove();
          }
        }
      }
      results.add(exitingPageRoute);
    }
    return results;
  }
}

class _MyHomePageState extends State<MyHomePage> {
  final GlobalKey<NavigatorState> _navigatorKey = GlobalKey<NavigatorState>();

  @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

[√] 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 · 2024-05-06T13:54:36Z

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 · 2024-05-06T14:36:57Z

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 · 2024-05-07T07:21:21Z

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 · 2024-05-07T09:58:36Z

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 · 2024-05-07T13:49:40Z

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 · 2024-05-07T22:23:14Z

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

danagbemava-nc added the in triage Presently being triaged by the triage team label May 6, 2024

danagbemava-nc added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 6, 2024

github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 6, 2024

danagbemava-nc added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 7, 2024

github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 7, 2024

goderbauer closed this as completed May 7, 2024

danagbemava-nc added the r: invalid Issue is closed as not valid label May 8, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Navigator without transitions not working #147862

Navigator without transitions not working #147862

aleripe commented May 6, 2024

danagbemava-nc commented May 6, 2024

aleripe commented May 6, 2024

danagbemava-nc commented May 7, 2024

aleripe commented May 7, 2024

danagbemava-nc commented May 7, 2024

goderbauer commented May 7, 2024 •

edited

Navigator without transitions not working #147862

Navigator without transitions not working #147862

Comments

aleripe commented May 6, 2024

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

danagbemava-nc commented May 6, 2024

aleripe commented May 6, 2024

danagbemava-nc commented May 7, 2024

aleripe commented May 7, 2024

danagbemava-nc commented May 7, 2024

goderbauer commented May 7, 2024 • edited

goderbauer commented May 7, 2024 •

edited