PageTransition<T> constructor

PageTransition<T>({
  1. Key? key,
  2. required Widget child,
  3. required PageTransitionType type,
  4. Widget? childCurrent = null,
  5. BuildContext? ctx,
  6. bool inheritTheme = false,
  7. Curve curve = Curves.linear,
  8. Alignment? alignment,
  9. Duration duration = const Duration(milliseconds: 300),
  10. Duration reverseDuration = const Duration(milliseconds: 300),
  11. bool fullscreenDialog = false,
  12. bool opaque = false,
  13. RouteSettings? settings,
})

Page transition constructor. We can pass the next page as a child,

Implementation

PageTransition({
  Key? key,
  required this.child,
  required this.type,
  this.childCurrent = null,
  this.ctx,
  this.inheritTheme = false,
  this.curve = Curves.linear,
  this.alignment,
  this.duration = const Duration(milliseconds: 300),
  this.reverseDuration = const Duration(milliseconds: 300),
  this.fullscreenDialog = false,
  this.opaque = false,
  RouteSettings? settings,
})  : assert(inheritTheme ? ctx != null : true,
          "'ctx' cannot be null when 'inheritTheme' is true, set ctx: context"),
      super(
        pageBuilder: (BuildContext context, Animation<double> animation,
            Animation<double> secondaryAnimation) {
          return inheritTheme
              ? InheritedTheme.captureAll(
                  ctx!,
                  child,
                )
              : child;
        },
        transitionDuration: duration,
        reverseTransitionDuration: reverseDuration,
        settings: settings,
        maintainState: true,
        opaque: opaque,
        fullscreenDialog: fullscreenDialog,
        transitionsBuilder: (BuildContext context,
            Animation<double> animation,
            Animation<double> secondaryAnimation,
            Widget child) {
          switch (type) {
            case PageTransitionType.fade:
              return FadeTransition(opacity: animation, child: child);
              // ignore: dead_code
              break;

            /// PageTransitionType.rightToLeft which is the give us right to left transition
            case PageTransitionType.rightToLeft:
              return SlideTransition(
                position: Tween<Offset>(
                  begin: const Offset(1, 0),
                  end: Offset.zero,
                ).animate(animation),
                child: child,
              );
              // ignore: dead_code
              break;

            /// PageTransitionType.leftToRight which is the give us left to right transition
            case PageTransitionType.leftToRight:
              return SlideTransition(
                position: Tween<Offset>(
                  begin: const Offset(-1, 0),
                  end: Offset.zero,
                ).animate(animation),
                child: child,
              );
              // ignore: dead_code
              break;

            /// PageTransitionType.topToBottom which is the give us up to down transition
            case PageTransitionType.topToBottom:
              return SlideTransition(
                position: Tween<Offset>(
                  begin: const Offset(0, -1),
                  end: Offset.zero,
                ).animate(animation),
                child: child,
              );
              // ignore: dead_code
              break;

            /// PageTransitionType.downToUp which is the give us down to up transition
            case PageTransitionType.bottomToTop:
              return SlideTransition(
                position: Tween<Offset>(
                  begin: const Offset(0, 1),
                  end: Offset.zero,
                ).animate(animation),
                child: child,
              );
              // ignore: dead_code
              break;

            /// PageTransitionType.scale which is the scale functionality for transition you can also use curve for this transition

            case PageTransitionType.scale:
              return ScaleTransition(
                alignment: alignment!,
                scale: CurvedAnimation(
                  parent: animation,
                  curve: Interval(
                    0.00,
                    0.50,
                    curve: curve,
                  ),
                ),
                child: child,
              );
              // ignore: dead_code
              break;

            /// PageTransitionType.rotate which is the rotate functionality for transition you can also use alignment for this transition

            case PageTransitionType.rotate:
              return new RotationTransition(
                alignment: alignment!,
                turns: animation,
                child: ScaleTransition(
                  alignment: alignment,
                  scale: animation,
                  child: FadeTransition(
                    opacity: animation,
                    child: child,
                  ),
                ),
              );
              // ignore: dead_code
              break;

            /// PageTransitionType.size which is the rotate functionality for transition you can also use curve for this transition

            case PageTransitionType.size:
              return Align(
                alignment: alignment!,
                child: SizeTransition(
                  sizeFactor: CurvedAnimation(
                    parent: animation,
                    curve: curve,
                  ),
                  child: child,
                ),
              );
              // ignore: dead_code
              break;

            /// PageTransitionType.rightToLeftWithFade which is the fade functionality from right o left

            case PageTransitionType.rightToLeftWithFade:
              return SlideTransition(
                position: Tween<Offset>(
                  begin: const Offset(1.0, 0.0),
                  end: Offset.zero,
                ).animate(animation),
                child: FadeTransition(
                  opacity: animation,
                  child: SlideTransition(
                    position: Tween<Offset>(
                      begin: const Offset(1, 0),
                      end: Offset.zero,
                    ).animate(animation),
                    child: child,
                  ),
                ),
              );
              // ignore: dead_code
              break;

            /// PageTransitionType.leftToRightWithFade which is the fade functionality from left o right with curve

            case PageTransitionType.leftToRightWithFade:
              return SlideTransition(
                position: Tween<Offset>(
                  begin: const Offset(-1.0, 0.0),
                  end: Offset.zero,
                ).animate(
                  CurvedAnimation(
                    parent: animation,
                    curve: curve,
                  ),
                ),
                child: FadeTransition(
                  opacity: animation,
                  child: SlideTransition(
                    position: Tween<Offset>(
                      begin: const Offset(-1, 0),
                      end: Offset.zero,
                    ).animate(animation),
                    child: child,
                  ),
                ),
              );
              // ignore: dead_code
              break;

            case PageTransitionType.rightToLeftJoined:
              assert(childCurrent != null, """
              When using type "rightToLeftJoined" you need argument: 'childCurrent'

              example:
                child: MyPage(),
                childCurrent: this

              """);
              return Stack(
                children: <Widget>[
                  SlideTransition(
                    position: Tween<Offset>(
                      begin: const Offset(0.0, 0.0),
                      end: const Offset(-1.0, 0.0),
                    ).animate(
                      CurvedAnimation(
                        parent: animation,
                        curve: curve,
                      ),
                    ),
                    child: childCurrent,
                  ),
                  SlideTransition(
                    position: Tween<Offset>(
                      begin: const Offset(1.0, 0.0),
                      end: Offset.zero,
                    ).animate(
                      CurvedAnimation(
                        parent: animation,
                        curve: curve,
                      ),
                    ),
                    child: child,
                  )
                ],
              );
              // ignore: dead_code
              break;

            case PageTransitionType.leftToRightJoined:
              assert(childCurrent != null, """
              When using type "leftToRightJoined" you need argument: 'childCurrent'
              example:
                child: MyPage(),
                childCurrent: this

              """);
              return Stack(
                children: <Widget>[
                  SlideTransition(
                    position: Tween<Offset>(
                      begin: const Offset(-1.0, 0.0),
                      end: const Offset(0.0, 0.0),
                    ).animate(
                      CurvedAnimation(
                        parent: animation,
                        curve: curve,
                      ),
                    ),
                    child: child,
                  ),
                  SlideTransition(
                    position: Tween<Offset>(
                      begin: const Offset(0.0, 0.0),
                      end: const Offset(1.0, 0.0),
                    ).animate(
                      CurvedAnimation(
                        parent: animation,
                        curve: curve,
                      ),
                    ),
                    child: childCurrent,
                  )
                ],
              );
              // ignore: dead_code
              break;

            /// FadeTransitions which is the fade transition

            default:
              return FadeTransition(opacity: animation, child: child);
          }
        },
      );