dartflutter-animationanimatewithdurationflutter-dialog

Is it possible to use another transition for showing a dialog than for hiding


When using showGeneralDialog - is it possible to use a different transition and duration for displaying a dialog than for hiding the dialog again?

E.g. a Curves.elasticOut for showing and a shorter Curve.linear transition for hiding?


Solution

  • The showGeneralDialog method has the following signature:

    Future<T?> showGeneralDialog<T extends Object?>(
    {required BuildContext context,
    required RoutePageBuilder pageBuilder,
    bool barrierDismissible = false,
    String? barrierLabel,
    Color barrierColor = const Color(0x80000000),
    Duration transitionDuration = const Duration(milliseconds: 200),
    RouteTransitionsBuilder? transitionBuilder,
    bool useRootNavigator = true,
    RouteSettings? routeSettings,
    Offset? anchorPoint}
    )
    

    Per the documentation, the RouteTransitionBuilder object :

    "...is used to define how the route arrives on and leaves off the screen. By default, the transition is a linear fade of the page's contents."

    The RouteTransitionBuilder has the following signature:

    RouteTransitionsBuilder = Widget Function(
    BuildContext context,
    Animation<double> animation,
    Animation<double> secondaryAnimation,
    Widget child
    )
    

    The two Animation objects are used for:

    animation: When the Navigator pushes a route on the top of its stack, the new route's primary animation runs from 0.0 to 1.0. When the Navigator pops the topmost route this animation runs from 1.0 to 0.0. secondaryAnimation: When the Navigator pushes a new route on the top of its stack, the old topmost route's secondaryAnimation runs from 0.0 to 1.0. When the Navigator pops the topmost route, the secondaryAnimation for the route below it runs from 1.0 to 0.0.

    If you want to have a different animation and duration, you can create your own RouteTransitionBuilder with its own animations and attach an animationController to it with a specific duration.