blob: a9a59011d44bd632948f134bc3cc2cb19f571d95 [file] [log] [blame] [view]
GoRouter allows you to customize the transition animation for each GoRoute. To
configure a custom transition animation, provide a `pageBuilder` parameter
to the GoRoute constructor:
```dart
GoRoute(
path: 'details',
pageBuilder: (context, state) {
return CustomTransitionPage(
key: state.pageKey,
child: DetailsScreen(),
transitionsBuilder: (context, animation, secondaryAnimation, child) {
// Change the opacity of the screen using a Curve based on the the animation's
// value
return FadeTransition(
opacity:
CurveTween(curve: Curves.easeInOutCirc).animate(animation),
child: child,
);
},
);
},
),
```
For a complete example, see the [transition animations
sample](https://github.com/flutter/packages/blob/main/packages/go_router/example/lib/transition_animations.dart).
For more information on animations in Flutter, visit the
[Animations](https://docs.flutter.dev/development/ui/animations) page on
flutter.dev.