From fce7910f8ed07f97fae107a713df540baee72d37 Mon Sep 17 00:00:00 2001 From: jayesh Date: Tue, 11 Jun 2024 16:53:29 +0530 Subject: [PATCH] invest screen ui --- android/app/build.gradle | 4 + assets/images/invest_screen/svg/apple_pay.svg | 3 + .../language_screen/png/orange_info.png | Bin 0 -> 1655 bytes lib/core/routes/route_name.dart | 1 + lib/core/routes/routes.dart | 11 +- lib/core/styles/app_color.dart | 2 + lib/core/styles/app_images.dart | 4 + lib/core/styles/app_text.dart | 35 +++ .../pages/invest_details_screen.dart | 7 +- .../pages/payment/invest_payment_layout.dart | 24 ++ .../pages/payment/invest_payment_screen.dart | 20 ++ .../payment/invest_pay_bottom_section.dart | 67 ++++++ .../payment/invest_pay_method_section.dart | 199 +++++++++++++++ .../payment/invest_pay_top_section.dart | 227 ++++++++++++++++++ .../components/text_from_field_widget.dart | 2 + lib/shared/components/text_widget.dart | 5 +- 16 files changed, 606 insertions(+), 5 deletions(-) create mode 100644 assets/images/invest_screen/svg/apple_pay.svg create mode 100644 assets/images/language_screen/png/orange_info.png create mode 100644 lib/features/MainScreens/Invest/presentation/pages/payment/invest_payment_layout.dart create mode 100644 lib/features/MainScreens/Invest/presentation/pages/payment/invest_payment_screen.dart create mode 100644 lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_bottom_section.dart create mode 100644 lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_method_section.dart create mode 100644 lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_top_section.dart diff --git a/android/app/build.gradle b/android/app/build.gradle index 92a39db..f69a367 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -54,6 +54,10 @@ android { buildTypes { release { + //Enable the proguard + minifyEnabled true + shrinkResources true + // useProguard true // TODO: Add your own signing config for the release build. // Signing with the debug keys for now, so `flutter run --release` works. signingConfig signingConfigs.debug diff --git a/assets/images/invest_screen/svg/apple_pay.svg b/assets/images/invest_screen/svg/apple_pay.svg new file mode 100644 index 0000000..1152c3d --- /dev/null +++ b/assets/images/invest_screen/svg/apple_pay.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/language_screen/png/orange_info.png b/assets/images/language_screen/png/orange_info.png new file mode 100644 index 0000000000000000000000000000000000000000..79c23eaeb9b4cc9e4ad2ef9cd3b1113bf0151eba GIT binary patch literal 1655 zcmV--28j8IP)@~0drDELIAGL9O(c600d`2O+f$vv5yP^a}Z-2p~6LkI&jdolJ(Z_#u~5GMq9`2e*bzIFPTcdW zWz54e);vJQ`j7A6&e!>wRk@Q#xVndzk@ zwE&doZ;nj1lLYZUPs%hq<*!MB7^u+H!ZyYjT60*M-arF}7z@y!UJxT(Hzw5bqk|r1 zP5T4$5EM}8VdD$R{dq1Uj0BK#Br(mGFelW+OfL*D3PJ5A_VqRNRw3qSeSB(#bKa03_?VEfPGT+1fq+^3b0`%TdoXdH@HFfLm zh3|=wlr!a|UXVzD64DPmY%<6*hJFv^1&P}0Hl)12HdfOO=9FKq=&$~13lMwx#{MD^ zMEYK!C4lIBJs;nK(ZfScw=>ofpw}(Xg1Q@&yC3UKP-+R__juHs6u+xyGc5r;4_|^w zgxp-L(@xbu#DC6y3?Q57^aE-SI2yynmaLdm_nk@sBA+{8QzED%hf)BK!;dl458PI^ zQ8l3X>KkB;h+|Y$ZFI6AUiC6W=iyZgz#+&gY5`*Q0AsuiI$_2xg%cn;a`wot5rq@r z-5;$B-#dJtAL+Jnh2pNA2f$ z{qt^iT>=t)t^wDq0XiosGI$X()BXyI_*i z)M=!*E5c_15)(mdSgsrg^jo#il{MLNpBb&J#h1PxuH;sO>i@jW&;$DYz;iIV?C2iU z(4LB*L51;2z;UDN;jwO8Z2_ul5Kgb5j)a(<6JEg_#kwb8PKmKlH7Iv! zUMu1uo}oyU5G_Juq`lAA&CXDmFG*g(0(Zy|k8sDEFs}@0EC6-LVbYXqBoPH(>*jr8 zszv$gPiRojKekyBt$1x!QN z*_ExVqk{J`Gpb;;5yrohChngl+rq7*FG8lq7i3?$cyvX`-1vgbwHVb#s#*=H{t75DJiwx%@OsHRo z-=jf)OzZf5-iY;YnqHW<5pvEm)GY+k8$4Ncs{%I(<Te1G)Kb;e@2*_~}!2CQSN5h}qf&-98)F|%G)6Lkg%0)(xBZ~1p8GUVx zKgw_r(kr@Bj5)e7QKP7W3=o@(#r{^g#WFxEucv(wP6=?Hz92JEgqkcGB0kF2Lz!OR zIG@&@*})xBn@}Ds5oa3$G+i<{!!QiPFbu;m%zxB_#r(vRN|*ou002ovPDHLkV1nA? B2MYiI literal 0 HcmV?d00001 diff --git a/lib/core/routes/route_name.dart b/lib/core/routes/route_name.dart index b17021c..ce41194 100644 --- a/lib/core/routes/route_name.dart +++ b/lib/core/routes/route_name.dart @@ -64,4 +64,5 @@ class RouteName { //invest static const String investDetailScreen = "investDetailScreen"; + static const String investPaymentScreen = "investPaymentScreen"; } diff --git a/lib/core/routes/routes.dart b/lib/core/routes/routes.dart index ed6891d..20949e4 100644 --- a/lib/core/routes/routes.dart +++ b/lib/core/routes/routes.dart @@ -4,14 +4,12 @@ import 'package:go_router/go_router.dart'; import 'package:tanami_app/core/routes/route_name.dart'; import 'package:tanami_app/features/MainScreens/Academy/presentation/pages/academy_details_screen.dart'; import 'package:tanami_app/features/MainScreens/Invest/presentation/pages/invest_details_screen.dart'; - +import 'package:tanami_app/features/MainScreens/Invest/presentation/pages/payment/invest_payment_screen.dart'; import 'package:tanami_app/features/MainScreens/Portfolio/presentation/pages/portfolio_details_screen.dart'; import 'package:tanami_app/features/MainScreens/Wallet/presentation/pages/walletDetails.dart'; - import 'package:tanami_app/features/biometric/presentation/pages/biometric_screen.dart'; import 'package:tanami_app/features/changePassword/presentation/pages/change_password_screen.dart'; import 'package:tanami_app/features/contactAdmin/presentation/pages/contact_admin_screen.dart'; - import 'package:tanami_app/features/countrySelection/presentation/pages/choose_country_screen.dart'; import 'package:tanami_app/features/deleteAccount/presentation/pages/delete_account_screen.dart'; import 'package:tanami_app/features/forgotPassword/presentation/pages/restore_password_screen.dart'; @@ -201,6 +199,13 @@ final goRouter = GoRouter( return const InvestDetailsScreen(); }, ), + GoRoute( + name: RouteName.investPaymentScreen, + path: RouteName.investPaymentScreen, + builder: (context, state) { + return const InvestPaymentScreen(); + }, + ), ], ), ], diff --git a/lib/core/styles/app_color.dart b/lib/core/styles/app_color.dart index c75199a..6e0cf78 100644 --- a/lib/core/styles/app_color.dart +++ b/lib/core/styles/app_color.dart @@ -80,6 +80,7 @@ class AppColor { //Language Color static const Color languageTextColor = Color(0xFF015698); + static const Color infoTextColor = Color(0xFFDF7B00); //Delete Account Color static const Color descriptionText = Color(0xFFC6C6C6); @@ -90,4 +91,5 @@ class AppColor { static const Color investKycBoxShadow1Color = Color(0xFF90D4FF); static const Color investKycBoxShadow2Color = Color(0xA0DAF0FF); static const Color investTextColor = Color(0xFF066123); + static const Color investPaymentTextColor = Color(0xFF535353); } diff --git a/lib/core/styles/app_images.dart b/lib/core/styles/app_images.dart index 4e8f49c..1d49b22 100644 --- a/lib/core/styles/app_images.dart +++ b/lib/core/styles/app_images.dart @@ -102,6 +102,8 @@ class AppImages { //Language static const String infoIcon = 'assets/images/language_screen/png/info_icon.png'; + static const String orangenInfoIcon = + 'assets/images/language_screen/png/orange_info.png'; //Invest static const String investIcon = @@ -112,4 +114,6 @@ class AppImages { static const String walletIcon = 'assets/images/invest_screen/svg/wallet.svg'; static const String timeSquareIcon = 'assets/images/invest_screen/svg/time_square.svg'; + static const String applePayIcon = + 'assets/images/invest_screen/svg/apple_pay.svg'; } diff --git a/lib/core/styles/app_text.dart b/lib/core/styles/app_text.dart index d6be32b..384bda0 100644 --- a/lib/core/styles/app_text.dart +++ b/lib/core/styles/app_text.dart @@ -129,6 +129,7 @@ class AppText { //Wallet static const String walletTitle = "Wallet balance"; + static const String walletText = "Wallet"; static const String day = "Today"; static const String onHold = "On hold"; @@ -204,4 +205,38 @@ class AppText { static const String holdingPeriodText = "Holding period"; static const String minimumInvestmentText = "Minimum investment"; static const String keyMeritsIOfnvestmentText = "Key Merits of Investment"; + static const String investmentDetailsText = "Investment details"; + static const String enterInvestmentAmountText = "Enter investment amount"; + static const String thisIsUsdInvestmentOpportunityText = + "This is a USD investment opportunity. Funds will be converted into USD upon confirmation."; + static const String choosePaymentMethodText = "Choose payment method"; + static const String balanceText = "Balance"; + static const String applePayText = "Apple Pay"; + static const String gPayText = "Gpay Pay"; + static const String instantTransferFundsApplePayText = + "Instant transfer of funds using Apple Pay!"; + static const String instantTransferFundsGpayPayText = + "Instant transfer of funds using Gpay Pay!"; + static const String retailInvestirCanInvestMaxText = + "Retail investors can invest a maximum of SAR 200,000 in this opportunity."; + static const String upgradeYourInvestorStatusToIncreaseText = + "Upgrade your investor status to increase your investment limit."; + static const String currentExchangeText = "Current Exchange"; + static const String feeText = "Fee"; + static const String debitedAmountText = "Debited amount"; + static const String totalInvestmentAmountText = "Total Investment amount"; + static const String confirmInvestmentText = "Confirm investment"; + static const String paymentMethodText = "Payment method"; + static const String totalDebitedAmountText = "Total debited amount"; + static const String unableToProcessTransactionText = + "Unable to process transaction"; + static const String investmentOpportunityHasReachedMaxcapText = + "Investment opportunity has reached maximum capacity"; + static const String backToInvestmentText = "Back to Investment"; + static const String otpCheckIsFailedText = "OTP Check is failed..."; + static const String pleaseTryAgainText = "Please try again"; + static const String tryAgainText = "Try again"; + static const String investmentConfirmationText = "Investment confirmation"; + static const String enterAmountText = "Enter Amount"; + static const String pleaseEnterAmountText = "Please Enter Amount"; } diff --git a/lib/features/MainScreens/Invest/presentation/pages/invest_details_screen.dart b/lib/features/MainScreens/Invest/presentation/pages/invest_details_screen.dart index d495009..4ae7e41 100644 --- a/lib/features/MainScreens/Invest/presentation/pages/invest_details_screen.dart +++ b/lib/features/MainScreens/Invest/presentation/pages/invest_details_screen.dart @@ -1,9 +1,12 @@ import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; +import 'package:tanami_app/core/routes/route_name.dart'; +import 'package:tanami_app/core/routes/routes.dart'; import 'package:tanami_app/core/styles/app_color.dart'; import 'package:tanami_app/core/styles/app_text.dart'; import 'package:tanami_app/shared/components/button_widget.dart'; + import '../../../../../shared/components/appbar_widget.dart'; import '../../../Portfolio/presentation/bloc/carousel/carousel_bloc.dart'; import 'invest_details_layout.dart'; @@ -21,7 +24,9 @@ class InvestDetailsScreen extends StatelessWidget { child: ButtonWidget().elevatedBtn( text: AppText.investText, clr: AppColor.primaryColor2, - function: () {}), + function: () { + goRouter.pushNamed(RouteName.investPaymentScreen); + }), ), appBar: const AppBarWidget( height: 45, diff --git a/lib/features/MainScreens/Invest/presentation/pages/payment/invest_payment_layout.dart b/lib/features/MainScreens/Invest/presentation/pages/payment/invest_payment_layout.dart new file mode 100644 index 0000000..73af1df --- /dev/null +++ b/lib/features/MainScreens/Invest/presentation/pages/payment/invest_payment_layout.dart @@ -0,0 +1,24 @@ +import 'package:flutter/material.dart'; +import 'package:tanami_app/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_bottom_section.dart'; +import 'package:tanami_app/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_method_section.dart'; +import 'package:tanami_app/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_top_section.dart'; + +class InvestPaymentLayout extends StatelessWidget { + const InvestPaymentLayout({super.key}); + + @override + Widget build(BuildContext context) { + return Scaffold( + body: Padding( + padding: const EdgeInsets.all(16.0), + child: ListView( + children: const [ + InvestPayTopSection(), + InvestPayMethodSection(), + InvestPayBottomSection(), + ], + ), + ), + ); + } +} diff --git a/lib/features/MainScreens/Invest/presentation/pages/payment/invest_payment_screen.dart b/lib/features/MainScreens/Invest/presentation/pages/payment/invest_payment_screen.dart new file mode 100644 index 0000000..085ebff --- /dev/null +++ b/lib/features/MainScreens/Invest/presentation/pages/payment/invest_payment_screen.dart @@ -0,0 +1,20 @@ +import 'package:flutter/material.dart'; + +import '../../../../../../core/styles/app_text.dart'; +import '../../../../../../shared/components/appbar_widget.dart'; +import 'invest_payment_layout.dart'; + +class InvestPaymentScreen extends StatelessWidget { + const InvestPaymentScreen({super.key}); + + @override + Widget build(BuildContext context) { + return const Scaffold( + appBar: AppBarWidget( + height: 75, + titleTxt: AppText.investmentDetailsText, + ), + body: InvestPaymentLayout(), + ); + } +} diff --git a/lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_bottom_section.dart b/lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_bottom_section.dart new file mode 100644 index 0000000..2b09ede --- /dev/null +++ b/lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_bottom_section.dart @@ -0,0 +1,67 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; +import 'package:gap/gap.dart'; + +import '../../../../../../core/routes/routes.dart'; +import '../../../../../../core/styles/app_color.dart'; +import '../../../../../../core/styles/app_text.dart'; +import '../../../../../../shared/components/button_widget.dart'; +import '../../../../../../shared/components/text_widget.dart'; + +class InvestPayBottomSection extends StatelessWidget { + const InvestPayBottomSection({super.key}); + + @override + Widget build(BuildContext context) { + return Column( + mainAxisSize: MainAxisSize.min, + children: [ + Container( + margin: const EdgeInsets.symmetric( + horizontal: 16, + ), + width: 1.sw, + height: 56.h, + child: ButtonWidget().elevatedBtn( + txtClr: // isButtonEnabled ? + AppColor.plainWhite, + // : AppColor.inactiveBtnTxtColor, + function: () { + // isButtonEnabled + // ? context.read().add( + // ChangePasswordSubmitted( + // context + // .read() + // .currentPasswordTextField + // .text, + // context + // .read() + // .passwordTextField + // .text, + // context + // .read() + // .repeatPasswordTextField + // .text, + // ), + // ) + // : null; + }, + text: AppText.nextText, + clr: + // isButtonEnabled ? + AppColor.primaryColor2 + // : AppColor.inactiveBtnColor, + ), + ), + const Gap(5), + ButtonWidget().textBtn( + function: () { + goRouter.pop(); + }, + text: TextWidget().text14W700(AppText.backText, + clr: AppColor.textLabelColor, + textDecoration: TextDecoration.underline)), + ], + ); + } +} diff --git a/lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_method_section.dart b/lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_method_section.dart new file mode 100644 index 0000000..99fd29b --- /dev/null +++ b/lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_method_section.dart @@ -0,0 +1,199 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_bloc/flutter_bloc.dart'; +import 'package:flutter_svg/flutter_svg.dart'; +import 'package:gap/gap.dart'; +import 'package:google_fonts/google_fonts.dart'; +import 'package:tanami_app/core/styles/app_images.dart'; +import 'package:tanami_app/core/styles/app_text.dart'; +import 'package:tanami_app/shared/components/text_widget.dart'; + +import '../../../../../../core/styles/app_color.dart'; +import '../../../../../countrySelection/presentation/bloc/choose_country_bloc.dart'; +import '../../../../../countrySelection/presentation/bloc/choose_country_event.dart'; +import '../../../../../countrySelection/presentation/bloc/choose_country_state.dart'; + +class InvestPayMethodSection extends StatelessWidget { + const InvestPayMethodSection({super.key}); + + @override + Widget build(BuildContext context) { + final radioBloc = context.read(); + return BlocBuilder( + builder: (context, state) { + int selectedIndex = 0; + if (state is RadioSelectionChanged) { + selectedIndex = state.selectedIndex; + } + + return Column(crossAxisAlignment: CrossAxisAlignment.start, children: [ + TextWidget().text15W700(AppText.choosePaymentMethodText, + clr: AppColor.plainBlack), + const Gap(16), + InkWell( + onTap: () { + radioBloc.add(const RadioSelected(0)); + }, + child: Container( + clipBehavior: Clip.antiAlias, + padding: const EdgeInsets.all(12), + decoration: ShapeDecoration( + color: Colors.white, + shape: RoundedRectangleBorder( + side: const BorderSide(color: Color(0xFFD8D8D8)), + borderRadius: BorderRadius.circular(22), + ), + shadows: const [ + BoxShadow( + color: Color(0x14000000), + blurRadius: 8, + offset: Offset(-2, -2), + spreadRadius: 0.50, + ), + BoxShadow( + color: Color(0x3391978E), + blurRadius: 8, + offset: Offset(2, 2), + spreadRadius: 1, + ) + ], + ), + child: Column( + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + children: [ + Radio( + activeColor: AppColor.radioActiveColor, + value: 0, + groupValue: selectedIndex, + onChanged: (int? value) { + if (value != null) { + radioBloc.add(RadioSelected(value)); + } + }, + ), + const Gap(5), + SvgPicture.asset(AppImages.walletIcon), + const Gap(5), + TextWidget().text14W700(AppText.walletText, + clr: AppColor.textLabelColor), + ], + ), + Container( + decoration: const BoxDecoration( + border: Border( + bottom: + BorderSide(width: 1, color: Colors.grey))), + child: Row( + children: [ + RichText( + text: TextSpan( + children: [ + TextSpan( + text: '${AppText.balanceText}: ', + style: GoogleFonts.dmSans( + color: Colors.grey, + fontSize: 12.0, + fontWeight: FontWeight.bold, + ), + ), + TextSpan( + text: 'SAR 178,000', + style: GoogleFonts.dmSans( + color: Colors.black, + fontSize: 14.0, + fontWeight: FontWeight.bold, + ), + ), + ], + ), + ), + const Icon( + Icons.arrow_forward, + color: Colors.grey, + size: 15, + ) + ], + ), + ), + ], + ), + TextWidget().text14W500( + "condimentum ac, vestibulum eu nisl.torquent per conubia nostra, per inceptos himenaeos.", + clr: AppColor.textLabelColor), + const Gap(12), + ], + ), + ), + ), + const Gap(12), + InkWell( + onTap: () { + radioBloc.add(const RadioSelected(1)); + }, + child: Container( + clipBehavior: Clip.antiAlias, + padding: const EdgeInsets.all(12), + decoration: ShapeDecoration( + color: Colors.white, + shape: RoundedRectangleBorder( + side: const BorderSide(color: Color(0xFFD8D8D8)), + borderRadius: BorderRadius.circular(22), + ), + shadows: const [ + BoxShadow( + color: Color(0x14000000), + blurRadius: 8, + offset: Offset(-2, -2), + spreadRadius: 0.2, + ), + BoxShadow( + color: Color(0x3391978E), + blurRadius: 8, + offset: Offset(2, 2), + spreadRadius: 1, + ) + ], + ), + child: Column( + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + children: [ + Radio( + activeColor: AppColor.radioActiveColor, + value: 1, + groupValue: selectedIndex, + onChanged: (int? value) { + if (value != null) { + radioBloc.add(RadioSelected(value)); + } + }, + ), + const Gap(5), + SvgPicture.asset(AppImages.applePayIcon), + const Gap(5), + TextWidget().text14W700(AppText.applePayText, + clr: AppColor.textLabelColor), + ], + ), + ], + ), + TextWidget().text14W500( + AppText.instantTransferFundsApplePayText, + clr: AppColor.textLabelColor), + const Gap(12), + ], + ), + ), + ), + const Gap(16), + ]); + }, + ); + } +} diff --git a/lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_top_section.dart b/lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_top_section.dart new file mode 100644 index 0000000..8338896 --- /dev/null +++ b/lib/features/MainScreens/Invest/presentation/widgets/payment/invest_pay_top_section.dart @@ -0,0 +1,227 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; +import 'package:gap/gap.dart'; +import 'package:tanami_app/core/styles/app_color.dart'; +import 'package:tanami_app/core/styles/app_images.dart'; +import 'package:tanami_app/core/styles/app_text.dart'; +import 'package:tanami_app/shared/components/text_widget.dart'; + +import '../../../../../../shared/components/text_from_field_widget.dart'; + +class InvestPayTopSection extends StatelessWidget { + const InvestPayTopSection({super.key}); + + @override + Widget build(BuildContext context) { + TextEditingController amountController = TextEditingController(); + return Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + TextWidget().text15W700(AppText.enterInvestmentAmountText, + clr: AppColor.plainBlack), + const Gap(16.0), + Container( + clipBehavior: Clip.antiAlias, + decoration: BoxDecoration( + color: AppColor.plainWhite, + borderRadius: BorderRadius.circular(22.0), + boxShadow: const [ + BoxShadow( + color: Color(0x14000000), + blurRadius: 8, + offset: Offset(-2, -2), + spreadRadius: 0.50, + ), + BoxShadow( + color: Color(0x3391978E), + blurRadius: 8, + offset: Offset(2, 2), + spreadRadius: 4, + ) + ], + ), + child: Column( + children: [ + Padding( + padding: const EdgeInsets.all(16.0), + child: Row( + children: [ + ClipRRect( + borderRadius: BorderRadius.circular(4), + child: Image.asset( + 'assets/images/portfolio_screen/detailsbg.png', + width: 0.2.sw, + height: 0.2.sw, + fit: BoxFit.cover, + ), + ), + const Gap(16.0), + Expanded( + child: TextWidget().text17W700( + 'Multi Family Residential', + clr: AppColor.plainBlack, + )), + ], + ), + ), + Container( + decoration: const ShapeDecoration( + color: AppColor.portfolioCardBgColor, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.only( + bottomLeft: Radius.circular(22), + bottomRight: Radius.circular(22), + ), + ), + ), + child: Column( + children: [ + Padding( + padding: const EdgeInsets.all(12.0), + child: Stack( + alignment: Alignment.centerLeft, + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + TextWidget().text15W700( + "SAR", + clr: AppColor.textLabelColor, + ), + const Gap(12), + Expanded( + child: Column( + children: [ + textFormField( + txtAlign: TextAlign.center, + readonly: false, + validator: (value) { + if (amountController.text.isEmpty) { + return AppText.pleaseEnterAmountText; + } + return null; + }, + texttype: TextInputType.number, + textEditingController: amountController, + hintText: AppText.enterAmountText, + suffixIcon: const SizedBox(), + ), + ], + ), + ), + ], + ), + ], + ), + ), + const Padding( + padding: EdgeInsets.all(12.0), + child: Column( + children: [ + InvestmentDetailRow( + label: AppText.currentExchangeText, + value: 'SAR 1 = USD 0.267', + ), + SizedBox(height: 8.0), + InvestmentDetailRow( + label: AppText.feeText, + value: '3%', + ), + SizedBox(height: 8.0), + InvestmentDetailRow( + label: '${AppText.totalInvestmentAmountText}:', + value: 'SAR 1000', + ), + ], + ), + ) + ], + ), + ) + ], + ), + ), + const Gap(24), + Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Image.asset( + width: 24, + height: 24, + AppImages.orangenInfoIcon, + ), + const Gap(8), + Column( + children: [ + SizedBox( + width: 0.8.sw, + child: TextWidget().text12W500( + AppText.retailInvestirCanInvestMaxText, + clr: AppColor.infoTextColor, + ), + ), + SizedBox( + width: 0.8.sw, + child: TextWidget().text12W700( + AppText.upgradeYourInvestorStatusToIncreaseText, + clr: AppColor.infoTextColor, + txtDec: TextDecoration.underline, + decClr: AppColor.infoTextColor, + ), + ), + ], + ), + ], + ), + const Gap(15), + Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Image.asset( + width: 24, + height: 24, + AppImages.infoIcon, + ), + const Gap(8), + SizedBox( + width: 0.8.sw, + child: TextWidget().text12W500( + AppText.upgradeYourInvestorStatusToIncreaseText, + clr: AppColor.languageTextColor, + ), + ), + ], + ), + const Gap(24), + ], + ); + } +} + +class InvestmentDetailRow extends StatelessWidget { + final String label; + final String value; + + const InvestmentDetailRow({ + super.key, + required this.label, + required this.value, + }); + + @override + Widget build(BuildContext context) { + return Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + TextWidget().text14W500( + label, + clr: AppColor.investPaymentTextColor, + ), + TextWidget().text14W700( + value, + clr: AppColor.plainBlack, + ), + ], + ); + } +} diff --git a/lib/shared/components/text_from_field_widget.dart b/lib/shared/components/text_from_field_widget.dart index 2045593..d390f78 100644 --- a/lib/shared/components/text_from_field_widget.dart +++ b/lib/shared/components/text_from_field_widget.dart @@ -20,8 +20,10 @@ Widget textFormField({ final VoidCallback? onTap, final TextCapitalization? textCapV, final Widget? suffixIcon, + final TextAlign? txtAlign, }) { return TextFormField( + textAlign: txtAlign ?? TextAlign.start, validator: validator, textAlignVertical: TextAlignVertical.center, cursorColor: AppColor.primaryColor2, diff --git a/lib/shared/components/text_widget.dart b/lib/shared/components/text_widget.dart index 12a2ea2..c164e1d 100644 --- a/lib/shared/components/text_widget.dart +++ b/lib/shared/components/text_widget.dart @@ -45,10 +45,13 @@ class TextWidget { color: clr ?? AppColor.plainWhite)); } - Widget text12W700(String text, {Color? clr}) { + Widget text12W700(String text, + {Color? clr, TextDecoration? txtDec, Color? decClr}) { return Text(text, style: GoogleFonts.dmSans( fontSize: 12, + decorationColor: decClr ?? AppColor.plainWhite, + decoration: txtDec ?? TextDecoration.none, fontWeight: FontWeight.w700, color: clr ?? AppColor.plainWhite)); }