pahmiudahgede
/
MIF_E31222379_MOBILE
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update: improve splash screen transition to navigation

This commit is contained in:
pahmiudahgede 2025-05-27 10:14:55 +07:00
parent de01c1acce
commit 6770e70edd
4 changed files with 177 additions and 125 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
lib/core/router.dart
View File

@ -3,17 +3,35 @@ import 'package:rijig_mobile/core/utils/exportimportview.dart';
final router = GoRouter( final router = GoRouter(
routes: [ routes: [
GoRoute(path: '/', builder: (context, state) => SplashScreen()), GoRoute(path: '/', builder: (context, state) => SplashScreen()),
GoRoute(path: '/cmapview', builder: (context, state) => CollectorRouteMapScreen()), GoRoute(
path: '/cmapview',
builder: (context, state) => CollectorRouteMapScreen(),
),
GoRoute( GoRoute(
path: '/onboarding', path: '/onboarding',
builder: (context, state) => OnboardingPageScreen(), pageBuilder: (context, state) {
var key = state.pageKey;
return transisi(OnboardingPageScreen(), key);
},
), ),
GoRoute(path: '/login', builder: (context, state) => LoginScreen()), GoRoute(path: '/login', builder: (context, state) => LoginScreen()),
GoRoute(path: '/clogin', builder: (context, state) => CloginScreen()), GoRoute(path: '/clogin', builder: (context, state) => CloginScreen()),
GoRoute(path: '/welcomec', builder: (context, state) => WelcomeCollectorScreen()), GoRoute(
GoRoute(path: '/verifidentity', builder: (context, state) => UploadKtpScreen()), path: '/welcomec',
GoRoute(path: '/berandapengepul', builder: (context, state) => ChomeCollectorScreen()), builder: (context, state) => WelcomeCollectorScreen(),
GoRoute(path: '/cpickuphistory', builder: (context, state) => PickupHistoryScreen()), ),
GoRoute(
path: '/verifidentity',
builder: (context, state) => UploadKtpScreen(),
),
GoRoute(
path: '/berandapengepul',
builder: (context, state) => ChomeCollectorScreen(),
),
GoRoute(
path: '/cpickuphistory',
builder: (context, state) => PickupHistoryScreen(),
),
// Rute untuk verifikasi OTP dengan ekstraksi data dari path // Rute untuk verifikasi OTP dengan ekstraksi data dari path
GoRoute( GoRoute(
@ -45,7 +63,10 @@ final router = GoRouter(
// Rute untuk halaman-halaman utama // Rute untuk halaman-halaman utama
GoRoute(path: '/home', builder: (context, state) => HomeScreen()), GoRoute(path: '/home', builder: (context, state) => HomeScreen()),
GoRoute(path: '/dataperforma', builder: (context, state) => DatavisualizedScreen()), GoRoute(
path: '/dataperforma',
builder: (context, state) => DatavisualizedScreen(),
),
GoRoute(path: '/activity', builder: (context, state) => ActivityScreen()), GoRoute(path: '/activity', builder: (context, state) => ActivityScreen()),
GoRoute( GoRoute(
path: '/requestpickup', path: '/requestpickup',
@ -86,3 +107,17 @@ final router = GoRouter(
), ),
], ],
); );
CustomTransitionPage transisi(Widget page, key) {
return CustomTransitionPage(
transitionDuration: const Duration(milliseconds: 1200),
child: page,
key: key,
transitionsBuilder: (key, animation, secondaryAnimation, page) {
return FadeTransition(
opacity: CurveTween(curve: Curves.easeInOut).animate(animation),
child: page,
);
},
);
}

1
lib/core/utils/exportimportview.dart
View File

@ -1,3 +1,4 @@
export 'package:flutter/material.dart';
export 'package:go_router/go_router.dart'; export 'package:go_router/go_router.dart';
export 'package:rijig_mobile/core/utils/navigation.dart'; export 'package:rijig_mobile/core/utils/navigation.dart';
export 'package:rijig_mobile/features/activity/presentation/screen/activity_screen.dart'; export 'package:rijig_mobile/features/activity/presentation/screen/activity_screen.dart';

248
lib/core/utils/navigation.dart
View File

@ -16,9 +16,35 @@ class NavigationPage extends StatefulWidget {
State<NavigationPage> createState() => _NavigationPageState(); State<NavigationPage> createState() => _NavigationPageState();
} }
class _NavigationPageState extends State<NavigationPage> { class _NavigationPageState extends State<NavigationPage>
with SingleTickerProviderStateMixin {
late AnimationController _controller;
late Animation<Offset> _slideAnimation;
int _selectedIndex = 0; int _selectedIndex = 0;
@override
void initState() {
super.initState();
_controller = AnimationController(
duration: const Duration(milliseconds: 2000),
vsync: this,
);
_slideAnimation = Tween<Offset>(
begin: const Offset(1.0, 0),
end: Offset.zero,
).animate(CurvedAnimation(parent: _controller, curve: Curves.easeOut));
_controller.forward();
_loadSelectedIndex();
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
_loadSelectedIndex() async { _loadSelectedIndex() async {
SharedPreferences prefs = await SharedPreferences.getInstance(); SharedPreferences prefs = await SharedPreferences.getInstance();
setState(() { setState(() {
@ -31,136 +57,126 @@ class _NavigationPageState extends State<NavigationPage> {
prefs.setInt('last_selected_index', index); prefs.setInt('last_selected_index', index);
} }
@override
void initState() {
super.initState();
_loadSelectedIndex();
}
void _onItemTapped(int index) { void _onItemTapped(int index) {
if (index == 2) { if (index == 2) {
router.push("/requestpickup"); router.push("/requestpickup");
} else { } else {
setState(() { setState(() => _selectedIndex = index);
_selectedIndex = index;
});
_saveSelectedIndex(index); _saveSelectedIndex(index);
} }
} }
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Scaffold( return Container(
extendBody: true, color: Theme.of(context).scaffoldBackgroundColor,
backgroundColor: whiteColor, child: SlideTransition(
body: IndexedStack( position: _slideAnimation,
index: _selectedIndex, child: Scaffold(
children: const [ extendBody: true,
HomeScreen(), backgroundColor: whiteColor,
ActivityScreen(), body: IndexedStack(
Text(""), index: _selectedIndex,
CartScreen(), children: const [
ProfilScreen(), HomeScreen(),
], ActivityScreen(),
), Text(""),
bottomNavigationBar: Theme( CartScreen(),
data: Theme.of(context).copyWith( ProfilScreen(),
splashFactory: NoSplash.splashFactory, ],
highlightColor: Colors.transparent, ),
), bottomNavigationBar: Visibility(
child: Visibility( visible: _selectedIndex != 2,
visible: _selectedIndex != 2, child: BottomAppBar(
child: BottomAppBar( shape: const CircularNotchedRectangle(),
shape: const CircularNotchedRectangle(), padding: PaddingCustom().paddingHorizontal(2),
padding: PaddingCustom().paddingHorizontal(2),
elevation: 0,
height: 67,
color: primaryColor,
clipBehavior: Clip.antiAlias,
notchMargin: 3.0,
child: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
backgroundColor: Colors.transparent,
elevation: 0, elevation: 0,
showSelectedLabels: true, height: 67,
showUnselectedLabels: true, color: primaryColor,
selectedItemColor: secondaryColor, clipBehavior: Clip.antiAlias,
unselectedItemColor: whiteColor, notchMargin: 3.0,
currentIndex: _selectedIndex, child: BottomNavigationBar(
onTap: _onItemTapped, type: BottomNavigationBarType.fixed,
items: [ backgroundColor: Colors.transparent,
BottomNavigationBarItem( elevation: 0,
icon: Icon(Iconsax.home_2), showSelectedLabels: true,
activeIcon: Icon(Iconsax.home_2, size: 26), showUnselectedLabels: true,
label: 'Beranda', selectedItemColor: secondaryColor,
), unselectedItemColor: whiteColor,
BottomNavigationBarItem( currentIndex: _selectedIndex,
icon: Icon(Iconsax.note_favorite), onTap: _onItemTapped,
activeIcon: Icon(Iconsax.note_favorite, size: 26), items: [
label: 'Aktivitas', BottomNavigationBarItem(
), icon: Icon(Iconsax.home_2),
const BottomNavigationBarItem( activeIcon: Icon(Iconsax.home_2, size: 26),
icon: SizedBox.shrink(), label: 'Beranda',
label: '', ),
), BottomNavigationBarItem(
BottomNavigationBarItem( icon: Icon(Iconsax.note_favorite),
icon: Icon(Iconsax.shopping_cart), activeIcon: Icon(Iconsax.note_favorite, size: 26),
activeIcon: Icon(Iconsax.shopping_cart, size: 26), label: 'Aktivitas',
label: 'Keranjang', ),
), const BottomNavigationBarItem(
BottomNavigationBarItem( icon: SizedBox.shrink(),
icon: Icon(Iconsax.user), label: '',
activeIcon: Icon(Iconsax.user, size: 26), ),
label: 'Profil', BottomNavigationBarItem(
), icon: Icon(Iconsax.shopping_cart),
], activeIcon: Icon(Iconsax.shopping_cart, size: 26),
selectedLabelStyle: Tulisan.customText( label: 'Keranjang',
color: secondaryColor, ),
fontsize: 14, BottomNavigationBarItem(
fontWeight: FontWeight.w600, icon: Icon(Iconsax.user),
), activeIcon: Icon(Iconsax.user, size: 26),
unselectedLabelStyle: Tulisan.customText( label: 'Profil',
color: whiteColor, ),
fontsize: 12, ],
fontWeight: FontWeight.w400, selectedLabelStyle: Tulisan.customText(
), color: secondaryColor,
),
),
),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
floatingActionButton: Container(
width: 78,
height: 78,
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: LinearGradient(
colors: [secondaryColor, primaryColor],
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
),
border: Border.all(color: whiteColor, width: 4),
),
child: RawMaterialButton(
onPressed: () {
router.push("/requestpickup");
},
shape: const CircleBorder(),
elevation: 0,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Iconsax.archive_2, color: whiteColor, size: 30),
Text(
"Mulai",
style: Tulisan.customText(
color: whiteColor,
fontsize: 14, fontsize: 14,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
), ),
unselectedLabelStyle: Tulisan.customText(
color: whiteColor,
fontsize: 12,
fontWeight: FontWeight.w400,
),
), ),
], ),
),
floatingActionButtonLocation:
FloatingActionButtonLocation.centerDocked,
floatingActionButton: Container(
width: 78,
height: 78,
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: LinearGradient(
colors: [secondaryColor, primaryColor],
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
),
border: Border.all(color: whiteColor, width: 4),
),
child: RawMaterialButton(
onPressed: () => router.push("/requestpickup"),
shape: const CircleBorder(),
elevation: 0,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Iconsax.archive_2, color: whiteColor, size: 30),
Text(
"Mulai",
style: Tulisan.customText(
color: whiteColor,
fontsize: 14,
fontWeight: FontWeight.w600,
),
),
],
),
),
), ),
), ),
), ),

4
lib/features/launch/screen/splash_screen.dart
View File

@ -80,8 +80,8 @@ class SplashScreenState extends State<SplashScreen> {
if (_isCheckingConnection) if (_isCheckingConnection)
Align( Align(
alignment: Alignment.center, alignment: Alignment.bottomCenter,
child: CircularProgressIndicator(), child: CircularProgressIndicator(color: whiteColor,),
), ),
], ],
), ),