Question

final builder = OpenUpwardsPageTransitionsBuilder();

Navigator.push(
  context,
  PageRouteBuilder(
    pageBuilder: (_, __, ___) => Page2(),
    transitionsBuilder: builder, // error
  ),
);

我了解的是，我只能在PageTransitionsBuilder内设置Theme，有什么方法可以在Navigator内使用它吗？

Answer 1

最简单的解决方案是自定义PageRouteBuilder：

class MyPageRouteBuilder<T> extends PageRouteBuilder<T> {
  final PageTransitionsBuilder pageTransitionsBuilder;

  MyPageRouteBuilder({
    @required RoutePageBuilder pageBuilder,
    @required this.pageTransitionsBuilder,
  }) : assert(pageTransitionsBuilder != null), super(pageBuilder: pageBuilder);

  @override
  Widget buildTransitions(BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation, Widget child) {
    return pageTransitionsBuilder.buildTransitions(this, context, animation, secondaryAnimation, child);
  }
}

这里仅将pageBuilder传递给super()，但是您可以添加PageRouteBuilder接受的任何命名参数（例如transitionDuration）

现在，您可以将其用于：

Navigator.of(context).push(
  MyPageRouteBuilder(
    pageBuilder: (ctx, a1, a2) => Page2(),
    pageTransitionsBuilder: OpenUpwardsPageTransitionsBuilder(),
  )
);

Answer 2

Navigator.push(
  context,
  PageRouteBuilder(
    pageBuilder: (ctx, a1, a2) => Screen2(),
    transitionsBuilder: (ctx, anim, a2, child) => FadeTransition(opacity: anim, child: child),
    transitionDuration: Duration(milliseconds: 3000),
  ),
);

您可以根据需要在应用程序中更改毫秒时间。

导航到其他屏幕时如何使用PageTransitionsBuilder？

2 个答案: