颤动:动画过渡到命名路线

问题描述

当我使用 Navigator.pushNamed(context，"/someRoute"); 时，有一个最小的动画，它会从屏幕底部沿新路线滑动(在Android上，外观可能会有所不同在iOS上).

When I use Navigator.pushNamed(context, "/someRoute");, there is a minimal animation which slides in the new route from the bottom of the screen (on Android, might look different on iOS).

如何在此过渡中添加自定义动画?

How can I add a custom animation to this transition?

我发现本文，其中包含用于未命名路线的一些非常简洁的示例代码.它们实现了自己的类，该类继承自 PageRouteBuilder ，并且可以像这样使用: Navigator.push(context，SlideRightRoute(page:Screen2())).但是 PageRouteBuilder 不是窗口小部件，并且不能在 MaterialApp 中注册为路由.因此，我看不到如何将其应用于命名路由.

I found this article, which has some very neat sample code for unnamed routes. They implement their own class which inherits from PageRouteBuilder and can be used like this: Navigator.push(context, SlideRightRoute(page: Screen2())). But a PageRouteBuilder is not a Widget and can't be registered as a route in MaterialApp. So I don't see how to apply this to named routes.

推荐答案

您需要在 MaterialApp 小部件中使用 onGenerateRoute .

You need to use onGenerateRoute in your MaterialApp widget.

onGenerateRoute: (settings) {
  if (settings.name == "/someRoute") {
    return PageRouteBuilder(
      pageBuilder: (_, __, ___) => SomePage(),
      transitionsBuilder: (_, a, __, c) => FadeTransition(opacity: a, child: c)
    );
  }
  // unknown route
  return MaterialPageRoute(builder: (_) => UnknownPage());
},

这篇关于颤动:动画过渡到命名路线的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！