Flutter Navigator.pushNamed 指定路由动画 - 不使用 push 方法

可以通过以下两种方式给 Navigator.pushNamed 指定路由动画，不使用 push 方法：

1. 在 MaterialApp 中指定路由动画

在 MaterialApp 的构造函数中，可以通过设置 navigatorKey 和 onGenerateRoute 属性来指定 Navigator 的配置。其中，navigatorKey 用于获取 NavigatorState 对象，onGenerateRoute 用于生成路由并指定路由动画。例如：

final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();

MaterialApp(
  navigatorKey: navigatorKey,
  onGenerateRoute: (settings) {
    switch (settings.name) {
      case '/':
        return MaterialPageRoute(
          builder: (_) => HomePage(),
          settings: settings,
        );
      case '/detail':
        return PageRouteBuilder(
          pageBuilder: (_, __, ___) => DetailPage(),
          transitionDuration: Duration(seconds: 1),
          transitionsBuilder: (_, animation, __, child) {
            return SlideTransition(
              position: Tween(begin: Offset(1, 0), end: Offset(0, 0)).animate(animation),
              child: child,
            );
          },
        );
      default:
        return MaterialPageRoute(
          builder: (_) => UnknownPage(),
          settings: settings,
        );
    }
  },
);

在上述代码中，onGenerateRoute 定义了三个路由：'/','/detail' 和其他未知路由。对于 '/detail' 路由，我们使用 PageRouteBuilder 指定了一个从右侧滑入的动画效果。

然后，在需要跳转到 '/detail' 路由的地方，可以使用以下代码：

navigatorKey.currentState.pushNamed('/detail');

这个方法会自动根据 onGenerateRoute 中定义的路由生成 DetailPage，并指定路由动画。

2. 使用 PageRouteBuilder 手动指定路由动画

如果不想在 MaterialApp 中指定路由动画，也可以在跳转路由时使用 PageRouteBuilder 手动指定路由动画。例如：

Navigator.of(context).push(
  PageRouteBuilder(
    pageBuilder: (_, __, ___) => DetailPage(),
    transitionDuration: Duration(seconds: 1),
    transitionsBuilder: (_, animation, __, child) {
      return SlideTransition(
        position: Tween(begin: Offset(1, 0), end: Offset(0, 0)).animate(animation),
        child: child,
      );
    },
  ),
);

这个方法不使用 Navigator.pushNamed，而是直接使用 Navigator.of(context).push 方法，并将 PageRouteBuilder 作为参数传入。在 PageRouteBuilder 中，我们指定了一个从右侧滑入的动画效果。

需要注意的是，这种方式不能像第一种方式一样自动根据路由名称生成路由页面。因此，需要手动指定路由页面的构造函数。