【Flutter】画面遷移時に下から上に出るアニメーションサンプル

2021年12月18日

Navigator.push(
  context,
  PageRouteBuilder(
    pageBuilder: (context, animation, secondaryAnimation) {
      return const MyPage(); // 遷移するページ
    },
    transitionsBuilder:
        (context, animation, secondaryAnimation, child) {
      const Offset begin = Offset(0.0, 1.0);
      const Offset end = Offset.zero;
      final Animatable<Offset> tween = Tween(begin: begin, end: end)
          .chain(CurveTween(curve: Curves.easeInOut));
      final Animation<Offset> position = animation.drive(tween);
      return SlideTransition(
        position: position,
        child: child,
      );
    },
  ),
);