我通过以下实现进行了简单的淡入淡出页面转换:
return new PageRouteBuilder(
opaque: true,
pageBuilder: (BuildContext context, Animation<double> animation,
Animation<double> secondaryAnimation) {
return new FadeTransition(opacity: animation, child: route);
});
当新页面出现时它会起作用,它会在新页面中淡出,但旧页面仍然可见,而新页面不是100%淡入。
理想情况下,我希望以前一页淡出的方式工作,然后新的淡入淡出。我知道我可以以某种方式使用secondaryAnimation,但目前无法解决。我尝试将另一个FadeTransition
作为一个孩子进行嵌套并使用它,但在这种情况下,我的路线会快速消失并消失(因为次要现在为0)
修改:这不是MaterialApp
,而是基于WidgetsApp
Edit2 :发现我也可以使用路由器设置中的isInitialRoute
,我可以在这里以某种方式应用它吗?
答案 0 :(得分:1)
来自Flutter源代码注释:
/// Signature for the [PageRouteBuilder] function that builds the route's
/// transitions.
///
/// See [ModalRoute.buildTransitions] for complete definition of the parameters.
typedef Widget RouteTransitionsBuilder(BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation, Widget child);
并进一步:
/// We've used [PageRouteBuilder] to demonstrate the [buildTransitions] method
/// here. The body of an override of the [buildTransitions] method would be
/// defined in the same way.
///
/// When the [Navigator] pushes a route on the top of its stack, the
/// [secondaryAnimation] can be used to define how the route that was on
/// the top of the stack leaves the screen. Similarly when the topmost route
/// is popped, the secondaryAnimation can be used to define how the route
/// below it reappears on the screen. When the Navigator pushes a new route
/// on the top of its stack, the old topmost route's secondaryAnimation
/// runs from 0.0 to 1.0. When the Navigator pops the topmost route, the
/// secondaryAnimation for the route below it runs from 1.0 to 0.0.
///
/// The example below adds a transition that's driven by the
/// [secondaryAnimation]. When this route disappears because a new route has
/// been pushed on top of it, it translates in the opposite direction of
/// the new route. Likewise when the route is exposed because the topmost
/// route has been popped off.
///
/// ```dart
/// transitionsBuilder: (
/// BuildContext context,
/// Animation<double> animation,
/// Animation<double> secondaryAnimation,
/// Widget child,
/// ) {
/// return new SlideTransition(
/// position: new AlignmentTween(
/// begin: const Offset(0.0, 1.0),
/// end: Offset.zero,
/// ).animate(animation),
/// child: new SlideTransition(
/// position: new TweenOffset(
/// begin: Offset.zero,
/// end: const Offset(0.0, 1.0),
/// ).animate(secondaryAnimation),
/// child: child,
/// ),
/// );
/// }
/// ```
///
/// In practice the `secondaryAnimation` is used pretty rarely.
///
/// The arguments to this method are as follows:
///
/// * `context`: The context in which the route is being built.
/// * [animation]: When the [Navigator] pushes a route on the top of its stack,
/// the new route's primary [animation] runs from 0.0 to 1.0. When the [Navigator]
/// pops the topmost route this animation runs from 1.0 to 0.0.
/// * [secondaryAnimation]: When the Navigator pushes a new route
/// on the top of its stack, the old topmost route's [secondaryAnimation]
/// runs from 0.0 to 1.0. When the [Navigator] pops the topmost route, the
/// [secondaryAnimation] for the route below it runs from 1.0 to 0.0.
/// * `child`, the page contents.
///
/// See also:
///
/// * [buildPage], which is used to describe the actual contents of the page,
/// and whose result is passed to the `child` argument of this method.
我的个人建议是,当文档含糊不清或缺少搜索代码时;)
最佳