diff --git a/assets/images/wallet_screen/bg.png b/assets/images/wallet_screen/bg.png new file mode 100644 index 0000000..b62e171 Binary files /dev/null and b/assets/images/wallet_screen/bg.png differ diff --git a/assets/images/wallet_screen/deposit.png b/assets/images/wallet_screen/deposit.png new file mode 100644 index 0000000..2ee209e Binary files /dev/null and b/assets/images/wallet_screen/deposit.png differ diff --git a/assets/images/wallet_screen/withdraw.png b/assets/images/wallet_screen/withdraw.png new file mode 100644 index 0000000..c0cbebc Binary files /dev/null and b/assets/images/wallet_screen/withdraw.png differ diff --git a/lib/core/styles/app_text.dart b/lib/core/styles/app_text.dart index 91be127..7b8de3b 100644 --- a/lib/core/styles/app_text.dart +++ b/lib/core/styles/app_text.dart @@ -82,6 +82,8 @@ class AppText { //Academy static const String videosTitle = "Videos"; + //Wallet + static const String walletTitle = "Wallet balance"; //Dialog static const String exitText = "Exit"; diff --git a/lib/features/MainScreens/Academy/presentation/pages/detailsScreen.dart b/lib/features/MainScreens/Academy/presentation/pages/detailsScreen.dart index 3d28bc4..92072f8 100644 --- a/lib/features/MainScreens/Academy/presentation/pages/detailsScreen.dart +++ b/lib/features/MainScreens/Academy/presentation/pages/detailsScreen.dart @@ -181,7 +181,6 @@ class _AcademyDetailsScreenState extends State { videos[index], fit: BoxFit.cover, height: 160.h, - // alignment: Alignment.topCenter, ), ), ); diff --git a/lib/features/MainScreens/Portfolio/presentation/pages/portfolioScreen.dart b/lib/features/MainScreens/Portfolio/presentation/pages/portfolioScreen.dart index ef12c34..bd9773d 100644 --- a/lib/features/MainScreens/Portfolio/presentation/pages/portfolioScreen.dart +++ b/lib/features/MainScreens/Portfolio/presentation/pages/portfolioScreen.dart @@ -115,7 +115,7 @@ class _PortfolioScreenState extends State { child: Container( decoration: BoxDecoration( color: Colors.white, - borderRadius: BorderRadius.all(Radius.circular(20.0)), + borderRadius: const BorderRadius.all(Radius.circular(20.0)), boxShadow: [ BoxShadow( color: Colors.black.withOpacity(0.15), @@ -156,7 +156,7 @@ class _PortfolioScreenState extends State { fontSize: 12.sp, fontWeight: FontWeight.w500, ), - ) + ), ], ), Text( diff --git a/lib/features/MainScreens/Wallet/presentation/pages/walletScreen.dart b/lib/features/MainScreens/Wallet/presentation/pages/walletScreen.dart index dec5122..d2e8a7a 100644 --- a/lib/features/MainScreens/Wallet/presentation/pages/walletScreen.dart +++ b/lib/features/MainScreens/Wallet/presentation/pages/walletScreen.dart @@ -1,4 +1,8 @@ import 'package:flutter/material.dart'; +import 'package:flutter/widgets.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; +import 'package:google_fonts/google_fonts.dart'; +import 'package:tanami_app/core/styles/app_text.dart'; class WalletScreen extends StatefulWidget { const WalletScreen({super.key}); @@ -10,6 +14,148 @@ class WalletScreen extends StatefulWidget { class _WalletScreenState extends State { @override Widget build(BuildContext context) { - return Scaffold(body: Text('Wallet'),); + return Scaffold( + backgroundColor: Colors.white, + body: CustomScrollView( + slivers: [ + SliverAppBar( + elevation: 0, + scrolledUnderElevation: 0, + expandedHeight: 230.0, + automaticallyImplyLeading: false, + snap: false, + pinned: true, + floating: false, + flexibleSpace: LayoutBuilder( + builder: (BuildContext context, BoxConstraints constraints) { + return FlexibleSpaceBar( + titlePadding: + const EdgeInsets.only(left: 30, top: 0, bottom: 15), + background: Stack( + fit: StackFit.expand, + children: [ + Image.asset( + 'assets/images/wallet_screen/bg.png', // Replace with your image asset + fit: BoxFit.cover, + ), + Padding( + padding: const EdgeInsets.only(left: 40.0), + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + AppText.walletTitle, + style: GoogleFonts.dmSans( + color: const Color(0xFF343434), + fontSize: 14.sp, + fontWeight: FontWeight.w700, + ), + ), + SizedBox( + height: 4.h, + ), + Text( + 'SAR 178,000', + style: GoogleFonts.dmSans( + color: const Color(0xFF191B1E), + fontSize: 28.sp, + fontWeight: FontWeight.w700, + ), + ), + ], + ), + ), + ], + ), + ); + }), + backgroundColor: Colors.white, + ), + SliverToBoxAdapter( + child: Padding( + padding: const EdgeInsets.symmetric(horizontal: 18.0), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Center( + child: Container( + decoration: BoxDecoration( + color: Colors.grey.withOpacity(0.2), + borderRadius: + const BorderRadius.all(Radius.circular(20.0)), + ), + child: Padding( + padding: const EdgeInsets.symmetric( + horizontal: 40.0, vertical: 10.0), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceEvenly, + children: [ + Column( + children: [ + Container( + decoration: const BoxDecoration( + shape: BoxShape.circle, + color: Colors.black, + ), + child: Padding( + padding: const EdgeInsets.all(8.0), + child: Image.asset( + 'assets/images/wallet_screen/deposit.png', + height: 20.h, + ), + ), + ), + Text( + 'Deposit', + style: GoogleFonts.dmSans( + color: const Color(0xFF363636), + fontSize: 12.sp, + fontWeight: FontWeight.w700, + ), + ), + ], + ), + VerticalDivider( + color: Colors.black, + width: 20.0, + ), + Column( + children: [ + Container( + decoration: const BoxDecoration( + shape: BoxShape.circle, + color: Colors.black, + ), + child: Padding( + padding: const EdgeInsets.all(8.0), + child: Image.asset( + 'assets/images/wallet_screen/withdraw.png', + height: 20.h, + ), + ), + ), + Text( + 'Withdraw', + style: GoogleFonts.dmSans( + color: const Color(0xFF363636), + fontSize: 12.sp, + fontWeight: FontWeight.w700, + ), + ), + ], + ), + ], + ), + ), + ), + ) + ], + ), + ), + ), + ], + ), + ); } -} \ No newline at end of file +} diff --git a/pubspec.yaml b/pubspec.yaml index 03b6b36..8cedd73 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -101,6 +101,7 @@ flutter: - assets/images/bottom_bar/inactive/ - assets/images/portfolio_screen/ - assets/images/academy_screen/ + - assets/images/wallet_screen/ - assets/images/biometric_screen/ - assets/images/biometric_screen/png/ - assets/images/biometric_screen/svg/