Flutter Navigator.pushNamed 路由动画设置及 onGenerateRoute 使用详解

如果你想要使用 Navigator.pushNamed 方法设置路由动画，但是 onGenerateRoute 没有被调用，那么可能是因为你没有在 MaterialApp 中设置路由。你需要在 MaterialApp 中设置 routes 参数来指定路由映射表。

示例代码：

MaterialApp(
  routes: {
    '/': (BuildContext context) => HomePage(),
    '/detail': (BuildContext context) => DetailPage(),
  },
  onGenerateRoute: (RouteSettings settings) {
    // handle your dynamic routes here
  },
);

在上面的示例中，我们使用 routes 参数来指定两个路由，分别是 '/ ' 和 '/detail ' 。当我们调用 Navigator.pushNamed('/detail ') 时，Flutter 会根据路由映射表来查找对应的路由，然后展示对应的页面。

同时，我们也可以通过 onGenerateRoute 回调来处理动态路由。当我们调用 Navigator.pushNamed('/dynamic-route ') 时，Flutter 会调用 onGenerateRoute 回调来处理这个动态路由。

如果你想要设置路由动画，可以在对应的页面中重写 buildPage 方法，并在其中使用 PageRouteBuilder 来自定义路由动画。

示例代码：

class DetailPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return buildPage(
      context,
      child: Text('Detail Page '),
      settings: RouteSettings(name: '/detail '),
      transitionDuration: Duration(milliseconds: 500),
      transitionsBuilder: (BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation, Widget child) {
        return FadeTransition(
          opacity: Tween<double>(begin: 0.0, end: 1.0).animate(animation),
          child: child,
        );
      },
    );
  }
}

在上面的示例中，我们重写了 buildPage 方法，并通过 transitionsBuilder 来设置自定义路由动画。在 transitionsBuilder 中我们使用了一个 FadeTransition 来实现淡入淡出的效果。

希望这些内容能够帮助你解决问题。