92 lines
3.0 KiB
Dart
92 lines
3.0 KiB
Dart
import 'package:flutter/material.dart';
|
|
|
|
/// Custom page route with smooth fade transition
|
|
class FadePageRoute<T> extends PageRouteBuilder<T> {
|
|
final Widget page;
|
|
final Duration duration;
|
|
|
|
FadePageRoute({
|
|
required this.page,
|
|
this.duration = const Duration(milliseconds: 400),
|
|
}) : super(
|
|
pageBuilder: (context, animation, secondaryAnimation) => page,
|
|
transitionDuration: duration,
|
|
reverseTransitionDuration: duration,
|
|
transitionsBuilder: (context, animation, secondaryAnimation, child) {
|
|
return FadeTransition(
|
|
opacity: animation.drive(
|
|
Tween<double>(
|
|
begin: 0.0,
|
|
end: 1.0,
|
|
).chain(CurveTween(curve: Curves.easeInOut)),
|
|
),
|
|
child: child,
|
|
);
|
|
},
|
|
);
|
|
}
|
|
|
|
/// Custom page route with slide up + fade transition
|
|
class SlideUpFadePageRoute<T> extends PageRouteBuilder<T> {
|
|
final Widget page;
|
|
final Duration duration;
|
|
|
|
SlideUpFadePageRoute({
|
|
required this.page,
|
|
this.duration = const Duration(milliseconds: 350),
|
|
}) : super(
|
|
pageBuilder: (context, animation, secondaryAnimation) => page,
|
|
transitionDuration: duration,
|
|
reverseTransitionDuration: duration,
|
|
transitionsBuilder: (context, animation, secondaryAnimation, child) {
|
|
final offsetAnimation =
|
|
Tween<Offset>(
|
|
begin: const Offset(0, 0.1),
|
|
end: Offset.zero,
|
|
).animate(
|
|
CurvedAnimation(parent: animation, curve: Curves.easeOutCubic),
|
|
);
|
|
|
|
final fadeAnimation = Tween<double>(
|
|
begin: 0.0,
|
|
end: 1.0,
|
|
).animate(CurvedAnimation(parent: animation, curve: Curves.easeIn));
|
|
|
|
return FadeTransition(
|
|
opacity: fadeAnimation,
|
|
child: SlideTransition(position: offsetAnimation, child: child),
|
|
);
|
|
},
|
|
);
|
|
}
|
|
|
|
/// Custom page route with scale + fade transition (good for splash to onboarding)
|
|
class ScaleFadePageRoute<T> extends PageRouteBuilder<T> {
|
|
final Widget page;
|
|
final Duration duration;
|
|
|
|
ScaleFadePageRoute({
|
|
required this.page,
|
|
this.duration = const Duration(milliseconds: 450),
|
|
}) : super(
|
|
pageBuilder: (context, animation, secondaryAnimation) => page,
|
|
transitionDuration: duration,
|
|
reverseTransitionDuration: duration,
|
|
transitionsBuilder: (context, animation, secondaryAnimation, child) {
|
|
final scaleAnimation = Tween<double>(begin: 0.95, end: 1.0).animate(
|
|
CurvedAnimation(parent: animation, curve: Curves.easeOutCubic),
|
|
);
|
|
|
|
final fadeAnimation = Tween<double>(
|
|
begin: 0.0,
|
|
end: 1.0,
|
|
).animate(CurvedAnimation(parent: animation, curve: Curves.easeIn));
|
|
|
|
return FadeTransition(
|
|
opacity: fadeAnimation,
|
|
child: ScaleTransition(scale: scaleAnimation, child: child),
|
|
);
|
|
},
|
|
);
|
|
}
|