Re-Quest/mobile-app
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: remove redundant AnimatedSwitcher and update routing transitions to use slide animations for detail screens

Browse Source
This commit is contained in:
pradeepkumar
2026-04-02 17:57:57 +05:30
parent 18cf495672
commit 2913947a34
2 changed files with 75 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
lib/core/widgets/app_shell.dart
View File

@@ -83,23 +83,8 @@ class _AppShellState extends State<AppShell> {
child: const HomeHeader(),
),
Expanded(
child: AnimatedSwitcher(
duration: const Duration(milliseconds: 250),
switchInCurve: Curves.easeOut,
switchOutCurve: Curves.easeIn,
transitionBuilder: (child, animation) {
return FadeTransition(
opacity: animation,
child: child,
);
},
child: SizedBox(
key: ValueKey(widget.child.runtimeType.hashCode ^
widget.child.hashCode),
child: widget.child,
),
),
),
],
),
bottomNavigationBar: const AppBottomNavBar(),

114
lib/routing/app_router.dart
View File

@@ -132,17 +132,7 @@ final routerProvider = Provider<GoRouter>((ref) {
);
},
),
GoRoute(
path: '/agents/detail/:id',
pageBuilder: (context, state) {
final id = state.pathParameters['id']!;
return CustomTransitionPage(
key: state.pageKey,
child: AgentDetailScreen(agentId: id),
transitionsBuilder: _fadeTransition,
);
},
),
// ── Tab routes (fade) ──
GoRoute(
path: '/messages',
pageBuilder: (context, state) => CustomTransitionPage(
@@ -153,6 +143,51 @@ final routerProvider = Provider<GoRouter>((ref) {
transitionsBuilder: _fadeTransition,
),
),
GoRoute(
path: '/agent/network',
pageBuilder: (context, state) => CustomTransitionPage(
key: state.pageKey,
child: const AgentNetworkScreen(),
transitionDuration: const Duration(milliseconds: 200),
reverseTransitionDuration: const Duration(milliseconds: 150),
transitionsBuilder: _fadeTransition,
),
),
GoRoute(
path: '/profile',
pageBuilder: (context, state) => CustomTransitionPage(
key: state.pageKey,
child: const ProfileSettingsScreen(),
transitionDuration: const Duration(milliseconds: 200),
reverseTransitionDuration: const Duration(milliseconds: 150),
transitionsBuilder: _fadeTransition,
),
),
GoRoute(
path: '/notifications',
pageBuilder: (context, state) => CustomTransitionPage(
key: state.pageKey,
child: const NotificationsScreen(),
transitionDuration: const Duration(milliseconds: 200),
reverseTransitionDuration: const Duration(milliseconds: 150),
transitionsBuilder: _fadeTransition,
),
),
// ── Detail/push routes (slide from right) ──
GoRoute(
path: '/agents/detail/:id',
pageBuilder: (context, state) {
final id = state.pathParameters['id']!;
return CustomTransitionPage(
key: state.pageKey,
child: AgentDetailScreen(agentId: id),
transitionDuration: const Duration(milliseconds: 250),
reverseTransitionDuration: const Duration(milliseconds: 200),
transitionsBuilder: _slideTransition,
);
},
),
GoRoute(
path: '/messages/chat/:id',
pageBuilder: (context, state) {
@@ -171,7 +206,9 @@ final routerProvider = Provider<GoRouter>((ref) {
pageBuilder: (context, state) => CustomTransitionPage(
key: state.pageKey,
child: const FaqScreen(),
transitionsBuilder: _fadeTransition,
transitionDuration: const Duration(milliseconds: 250),
reverseTransitionDuration: const Duration(milliseconds: 200),
transitionsBuilder: _slideTransition,
),
),
GoRoute(
@@ -179,7 +216,9 @@ final routerProvider = Provider<GoRouter>((ref) {
pageBuilder: (context, state) => CustomTransitionPage(
key: state.pageKey,
child: const ContactScreen(),
transitionsBuilder: _fadeTransition,
transitionDuration: const Duration(milliseconds: 250),
reverseTransitionDuration: const Duration(milliseconds: 200),
transitionsBuilder: _slideTransition,
),
),
GoRoute(
@@ -187,23 +226,9 @@ final routerProvider = Provider<GoRouter>((ref) {
pageBuilder: (context, state) => CustomTransitionPage(
key: state.pageKey,
child: const AboutScreen(),
transitionsBuilder: _fadeTransition,
),
),
GoRoute(
path: '/agent/network',
pageBuilder: (context, state) => CustomTransitionPage(
key: state.pageKey,
child: const AgentNetworkScreen(),
transitionsBuilder: _fadeTransition,
),
),
GoRoute(
path: '/profile',
pageBuilder: (context, state) => CustomTransitionPage(
key: state.pageKey,
child: const ProfileSettingsScreen(),
transitionsBuilder: _fadeTransition,
transitionDuration: const Duration(milliseconds: 250),
reverseTransitionDuration: const Duration(milliseconds: 200),
transitionsBuilder: _slideTransition,
),
),
GoRoute(
@@ -211,15 +236,9 @@ final routerProvider = Provider<GoRouter>((ref) {
pageBuilder: (context, state) => CustomTransitionPage(
key: state.pageKey,
child: const AgentEditProfileScreen(),
transitionsBuilder: _fadeTransition,
),
),
GoRoute(
path: '/notifications',
pageBuilder: (context, state) => CustomTransitionPage(
key: state.pageKey,
child: const NotificationsScreen(),
transitionsBuilder: _fadeTransition,
transitionDuration: const Duration(milliseconds: 250),
reverseTransitionDuration: const Duration(milliseconds: 200),
transitionsBuilder: _slideTransition,
),
),
GoRoute(
@@ -227,7 +246,9 @@ final routerProvider = Provider<GoRouter>((ref) {
pageBuilder: (context, state) => CustomTransitionPage(
key: state.pageKey,
child: const SupportChatScreen(),
transitionsBuilder: _fadeTransition,
transitionDuration: const Duration(milliseconds: 250),
reverseTransitionDuration: const Duration(milliseconds: 200),
transitionsBuilder: _slideTransition,
),
),
GoRoute(
@@ -237,7 +258,9 @@ final routerProvider = Provider<GoRouter>((ref) {
return CustomTransitionPage(
key: state.pageKey,
child: PaymentSuccessScreen(sessionId: sessionId),
transitionsBuilder: _fadeTransition,
transitionDuration: const Duration(milliseconds: 250),
reverseTransitionDuration: const Duration(milliseconds: 200),
transitionsBuilder: _slideTransition,
);
},
),
@@ -286,11 +309,15 @@ Widget _slideTransition(
begin: const Offset(1, 0),
end: Offset.zero,
).animate(CurvedAnimation(parent: animation, curve: Curves.easeOut)),
child: Container(
color: Colors.white,
child: child,
),
);
}
/// Smooth fade transition for tab-to-tab navigation.
/// Uses a white container behind to prevent content overlap during transition.
Widget _fadeTransition(
BuildContext context,
Animation<double> animation,
@@ -298,8 +325,11 @@ Widget _fadeTransition(
Widget child,
) {
return FadeTransition(
opacity: CurveTween(curve: Curves.easeInOut).animate(animation),
opacity: CurveTween(curve: Curves.easeIn).animate(animation),
child: Container(
color: Colors.white,
child: child,
),
);
}