Flutter自定義路由PageRouteBuilder

自定義路由翻轉，漸變，左右滑動

方法如下：

1. 首先繼承 PageRouteBuilder ，重寫方法
2. 將MaterialPageRoute改為showSearch

　　

import 'package:flutter/material.dart';


class animation_route extends PageRouteBuilder {

  final Widget widget;

  animation_route(this.widget)
  : super(
    transitionDuration: const Duration(milliseconds: 500), //設置動畫時長500毫秒
    pageBuilder: (
      BuildContext context,
      Animation<double> animation1,
      Animation<double> animation2){
      return widget;
    },
    transitionsBuilder: (
      BuildContext context,
      Animation<double> animation1,
      Animation<double> animation2,
      Widget child
    ){
      //漸變過渡
//      return FadeTransition(//漸變過渡 0.0-1.0
//        opacity: Tween(begin: 0.0, end: 1.0).animate(CurvedAnimation(
//          parent: animation1, //動畫樣式
//          curve: Curves.fastOutSlowIn, //動畫曲線
//        )),
//        child: child,
//      );
      //翻轉縮放
//      return RotationTransition(
//        turns: Tween(begin: 0.0, end: 1.0).
//        animate(
//          CurvedAnimation(
//            parent: animation1,
//            curve: Curves.fastOutSlowIn,
//          )
//        ),
//        child: ScaleTransition(
//          scale: Tween(begin: 0.0, end: 1.0).
//          animate(CurvedAnimation(parent: animation1, curve: Curves.fastOutSlowIn)),
//          child: child,
//        ),
//      );
      //左右滑動
      return SlideTransition(
        position: Tween<Offset>(
          begin: Offset(-1.0, 0.0),
          end: Offset(0.0, 0.0)
        )
        .animate(CurvedAnimation(parent: animation1, curve: Curves.fastOutSlowIn)),
        child: child,
      );
    }

  );


}

　　使用方法

Navigator.push(context, MaterialPageRoute(builder: (context){ return test(); })); 改為Navigator.push(context, animation_route(test()));