diff --git a/lib/application/component/text_form/text_form_view.dart b/lib/application/component/text_form/text_form_view.dart index 959fbcc..82d5de5 100644 --- a/lib/application/component/text_form/text_form_view.dart +++ b/lib/application/component/text_form/text_form_view.dart @@ -190,6 +190,18 @@ class TextFormView extends StatelessWidget { color: focusedBorderColor ?? ColorPalette.greyBorder, ), ), + errorBorder: OutlineInputBorder( + borderRadius: _borderRadius, + borderSide: BorderSide( + color: ColorPalette.red600 + ) + ), + focusedErrorBorder: OutlineInputBorder( + borderRadius: _borderRadius, + borderSide: BorderSide( + color: ColorPalette.red600 + ) + ), border: OutlineInputBorder(borderRadius: _borderRadius), suffixIcon: suffixIcon, prefixIcon: prefixIcon, diff --git a/lib/features/auth/login/view/phone_number_view.dart b/lib/features/auth/login/view/phone_number_view.dart index d4d919c..2f3d54a 100644 --- a/lib/features/auth/login/view/phone_number_view.dart +++ b/lib/features/auth/login/view/phone_number_view.dart @@ -52,7 +52,7 @@ class PhoneNumberView extends StatelessWidget { width: SizeConfig.width * .23, padding: const EdgeInsets.symmetric(horizontal: 16.0), - margin: const EdgeInsets.only(right: 16, left: 2, top: 2, bottom: 2), + margin: const EdgeInsets.only(right: 16, left: 1, top: 1, bottom: 1), decoration: const BoxDecoration( color: ColorPalette.grey, borderRadius: BorderRadius.only( diff --git a/lib/features/dashboard/dashboard_account/view/homepage/homepage_view.dart b/lib/features/dashboard/dashboard_account/view/homepage/homepage_view.dart index add1af9..468d35f 100644 --- a/lib/features/dashboard/dashboard_account/view/homepage/homepage_view.dart +++ b/lib/features/dashboard/dashboard_account/view/homepage/homepage_view.dart @@ -50,7 +50,7 @@ class _HomeViewState extends State { ]; StepVerification listStepVerification = - StepVerification(0, ['Registration', '', 'Verification', '', 'Complete']); + StepVerification(1, ['Registration', '', 'Verification', '', 'Complete']); List
listArticle = [ Article( @@ -78,7 +78,8 @@ class _HomeViewState extends State { onStretchTrigger: () async { }, expandedHeight: 325, - leading: SizedBox(), + collapsedHeight: 325, + leading: const SizedBox(), surfaceTintColor: ColorPalette.slate50, backgroundColor: ColorPalette.slate50, flexibleSpace: FlexibleSpaceBar( @@ -291,9 +292,10 @@ class _HomeViewState extends State { child: Column( children: [ stepVerification(), - const SizedBox( - height: 24, - ), + if(listStepVerification.currentStep < 3) + const SizedBox( + height: 24, + ), if (listStepVerification.currentStep == 1) ...[ Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, @@ -303,6 +305,7 @@ class _HomeViewState extends State { Icon( Icons.verified, size: 18, + color: ColorPalette.slate300, ), SizedBox( width: 12, @@ -336,6 +339,7 @@ class _HomeViewState extends State { Icon( Icons.verified, size: 18, + color: ColorPalette.slate300, ), SizedBox( width: 12, @@ -400,11 +404,11 @@ class _HomeViewState extends State { borderRadius: BorderRadius.circular(12)), child: Column( children: [ - Text( + const Text( "Let's start registering your data to start mutual fund investment at PT Gemilang Indonesia", style: TextStyle(color: ColorPalette.slate500), ), - SizedBox( + const SizedBox( height: 16, ), ButtonView( @@ -412,9 +416,9 @@ class _HomeViewState extends State { width: SizeConfig.width, marginVertical: 0, heightWrapContent: true, - contentPadding: EdgeInsets.all(12), + contentPadding: const EdgeInsets.all(12), onPressed: () { - routePush(context, page: InitialRegistrationStep()); + routePush(context, page: const InitialRegistrationStep()); }, ) ], @@ -430,54 +434,60 @@ class _HomeViewState extends State { return Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.start, - children: listStepVerification.nameStep.asMap().entries.map((e) { - if(e.key == 1 || e.key == 3){ - return SizedBox( - width: 30, - height: 30, - child: Divider( - color: listStepVerification.currentStep >= e.key - ? const Color(0xff2563EB) - : const Color(0xffCBD5E1), - ), - ); - }else{ - return Column( - children: [ - Container( - width: 30, - height: 30, - decoration: BoxDecoration( + children: List.generate( + listStepVerification.nameStep.length, + (index) { + print(index % 2); + if (index % 2 == 0) { + final currentStep = index ~/ 2; + return Column( + children: [ + Container( + width: 30, + height: 30, + decoration: BoxDecoration( shape: BoxShape.circle, - color: listStepVerification.currentStep <= e.key + color: listStepVerification.currentStep <= currentStep ? Colors.white : const Color(0xff2563EB), border: Border.all( - color: listStepVerification.currentStep < e.key - ? const Color(0xffCBD5E1) - : const Color(0xff2563EB), - width: 2)), - child: listStepVerification.currentStep <= e.key - ? const SizedBox() - : const Icon( - Icons.done_rounded, - color: Colors.white, + color: listStepVerification.currentStep < currentStep + ? const Color(0xffCBD5E1) + : const Color(0xff2563EB), + width: 2, + ), + ), + child: listStepVerification.currentStep <= currentStep + ? const SizedBox() + : const Icon( + Icons.done_rounded, + color: Colors.white, + ), ), - ), - const SizedBox( - height: 8, - ), - Text( - e.value, - style: TextStyle( - color: listStepVerification.currentStep == e.key + const SizedBox(height: 8), + Text( + listStepVerification.nameStep[index], + style: TextStyle( + color: listStepVerification.currentStep == currentStep ? const Color(0xff2563EB) - : Colors.black), - ) - ], - ); - } - }).toList(), + : Colors.black, + ), + ), + ], + ); + } else { + return SizedBox( + width: 30, + height: 30, + child: Divider( + color: listStepVerification.currentStep > index ~/ 2 + ? const Color(0xff2563EB) + : const Color(0xffCBD5E1), + ), + ); + } + }, + ), ); } @@ -601,7 +611,7 @@ class _HomeViewState extends State { color: ColorPalette.green100), child: Text( article.type, - style: TextStyle( + style: const TextStyle( fontWeight: FontWeight.w600, color: ColorPalette.green500), ), diff --git a/lib/features/dashboard/dashboard_account/view/product/view/product_view.dart b/lib/features/dashboard/dashboard_account/view/product/view/product_view.dart index 9ccf953..14a4afa 100644 --- a/lib/features/dashboard/dashboard_account/view/product/view/product_view.dart +++ b/lib/features/dashboard/dashboard_account/view/product/view/product_view.dart @@ -13,6 +13,7 @@ import 'package:cims_apps/features/dashboard/dashboard_account/view/product/view import 'package:cims_apps/features/dashboard/dashboard_account/view/product/view/step_subscribe/select_goal_investing.dart'; import 'package:cims_apps/features/dashboard/dashboard_account/view/product/view_model/product_view_model.dart'; import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; import 'package:group_button/group_button.dart'; import 'package:provider/provider.dart'; @@ -79,6 +80,8 @@ class _ProductViewState extends State { }); } + double currentScroll = 0; + @override void initState() { machineController.text = NumberFormatter.numberCurrency(100000, 'Rp ', 'id_ID', decimalDigits: 0); @@ -104,64 +107,106 @@ class _ProductViewState extends State { return ChangeNotifierProvider( create: (context) => ProductViewModel(), child: Scaffold( - body: SizedBox( - child: Stack( - children: [ - const ImageView(image: PathAssets.imgDashboardAccount), - Column( - children: [ - const SizedBox( - height: 50, - ), - const Padding( - padding: EdgeInsets.symmetric(horizontal: 24), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - BackButtonView(), - Wrap( - spacing: 12, - children: [ - Icon(Icons.search_rounded, color: ColorPalette.blue200, size: 32), - Icon(Icons.file_download_outlined, color: ColorPalette.blue200, size: 32), - Icon(Icons.star_outline_rounded, color: ColorPalette.blue200, size: 32) - ], - ) - ], + body: NotificationListener( + onNotification: (notification) { + setState(() { + currentScroll = notification.metrics.pixels; + }); + return false; + }, + child: CustomScrollView( + slivers: [ + SliverAppBar( + toolbarHeight: 70, + expandedHeight: 170, + leadingWidth: 0, + floating: false, + automaticallyImplyLeading: false, + title: AnimatedCrossFade( + firstChild: Text( + widget.selectedProduct.name ?? '', + maxLines: 2, + overflow: TextOverflow.ellipsis, + style: TextStyle( + color: Colors.white, + fontWeight: FontWeight.w700, + fontSize: 18 ), ), - const SizedBox( - height: 24, + secondChild: Padding( + padding: const EdgeInsets.only(left: 8), + child: BackButtonView(), ), - headContainer(), - const SizedBox( - height: 24, + crossFadeState: currentScroll >= 85 ? CrossFadeState.showFirst : CrossFadeState.showSecond, + duration: Duration(milliseconds: 200) + ), + centerTitle: false, + snap: false, + pinned: true, + backgroundColor: Color(0xFF1745C8).withOpacity(currentScroll >= 95 ? 1 : currentScroll / 95), + surfaceTintColor: ColorPalette.primary, + actions: [ + Wrap( + spacing: 12, + children: [ + Icon(Icons.search_rounded, color: ColorPalette.blue200, size: 32), + Icon(Icons.file_download_outlined, color: ColorPalette.blue200, size: 32), + Icon(Icons.star_outline_rounded, color: ColorPalette.blue200, size: 32) + ], ), - Expanded( - child: contentContainer() - ) + SizedBox(width: 24,) ], + flexibleSpace: Opacity( + opacity: currentScroll > 0 ? ((95 - currentScroll) / 95) > 0.01 ? ((95 - currentScroll) / 95) : 0 : 1, + child: Stack( + children: [ + ImageView(image: PathAssets.imgDashboardAccount, width: SizeConfig.width, height: 200), + Column( + mainAxisAlignment: MainAxisAlignment.end, + children: [ + headContainer(), + const SizedBox( + height: 24, + ), + Container( + height: 12, + decoration: BoxDecoration( + color: Colors.white, + borderRadius: BorderRadius.only( + topLeft: Radius.circular(12), + topRight: Radius.circular(12) + ) + ), + ) + ], + ) + ], + ), + ), + ), + SliverToBoxAdapter( + child: contentContainer(), ) ], ), ), bottomNavigationBar: !widget.seeMore ? - Container( - height: SizeConfig.height * .1, - padding: const EdgeInsets.symmetric(horizontal: 24), - child: ButtonView( - name: 'Subscribe', - onPressed: () { - showModalBottomSheet( - context: context, - isScrollControlled: true, - builder: (context) => SelectGoalInvesting(), - ); - }, - height: SizeConfig.height * 0.06, - marginVertical: 16, - ), - ) : SizedBox(), + Container( + height: SizeConfig.height * .1, + padding: const EdgeInsets.symmetric(horizontal: 24), + child: ButtonView( + name: 'Subscribe', + onPressed: () { + showModalBottomSheet( + context: context, + isScrollControlled: true, + builder: (context) => SelectGoalInvesting(), + ); + }, + height: SizeConfig.height * 0.06, + marginVertical: 16, + ), + ) : SizedBox(), ), ); } @@ -220,8 +265,11 @@ class _ProductViewState extends State { decoration: BoxDecoration( color: Colors.white, ), - child: ListView( + child: Column( children: [ + const SizedBox( + height: 12, + ), ProductChartView( tabType: listTab[selectedTab], lastTime: selectedTime.completeName,