如何滑动到右侧的新页面而不是颤动的底部？

Question

将新页面转移到焦点的默认颤动动画是从底部向上滑动。我如何更改此行为并从右侧或左侧滑入新页面？

      Navigator.push(
        context,
          new PageRouteBuilder(
          pageBuilder: (BuildContext context, _, __) {
            return new SearchView();
          }
          )
      );

Answer 1

查看 CupertinoPageRoute:

A modal route that replaces the entire screen with an iOS transition.

The page slides in from the right and exits in reverse. The page also shifts to the left in parallax when another page enters to cover it.

The page slides in from the bottom and exits in reverse with no parallax effect for fullscreen dialogs.

flutter gallery 示例应用程序中有它的演示：

Navigator.of(context, rootNavigator: true).push(
  new CupertinoPageRoute<bool>(
    fullscreenDialog: true,
    builder: (BuildContext context) => new Tab3Dialog(),
  ),
);

Answer 2

你可以用你想要的动画创建一个函数

Route createRoute(Widget page) {
  return PageRouteBuilder(
    pageBuilder: (context, animation, secondaryAnimation) => page,
    transitionsBuilder: (context, animation, secondaryAnimation, child) {
      const begin = Offset(1.0, 0.0);
      const end = Offset.zero;
      const curve = Curves.ease;

      var tween = Tween(begin: begin, end: end).chain(CurveTween(curve: curve));

      return SlideTransition(
        position: animation.drive(tween),
        child: child,
      );
    },
  );
}

每次推送到新屏幕时调用它

Navigator.of(context).push(createRoute(SearchView()))

如果你想改变方向你需要改变begin的偏移量如果你想改变你需要改变的效果 SlideTransition

如何滑动到右侧的新页面而不是颤动的底部？

How to slide to new page on the right instead of the bottom in flutter?

dart

material-design

flutter

flutter-layout