diff --git a/lib/src/screens/dashboard/dashboard_page.dart b/lib/src/screens/dashboard/dashboard_page.dart index 8c236404d..480401baa 100644 --- a/lib/src/screens/dashboard/dashboard_page.dart +++ b/lib/src/screens/dashboard/dashboard_page.dart @@ -1,4 +1,5 @@ import 'dart:async'; +import 'dart:ui'; import 'package:cake_wallet/core/wallet_connect/wc_bottom_sheet_service.dart'; import 'package:cake_wallet/entities/preferences_key.dart'; import 'package:cake_wallet/di.dart'; @@ -37,6 +38,8 @@ import 'package:cake_wallet/src/screens/release_notes/release_notes_screen.dart' import 'package:cake_wallet/themes/extensions/dashboard_page_theme.dart'; import 'package:cake_wallet/themes/extensions/balance_page_theme.dart'; +import '../../../themes/theme_base.dart'; + class DashboardPage extends StatefulWidget { DashboardPage({ required this.bottomSheetService, @@ -59,13 +62,14 @@ class _DashboardPageState extends State { void initState() { super.initState(); - bool isMobileLayout = - responsiveLayoutUtil.screenWidth < ResponsiveLayoutUtilBase.kMobileThreshold; + bool isMobileLayout = responsiveLayoutUtil.screenWidth < + ResponsiveLayoutUtilBase.kMobileThreshold; reaction((_) => responsiveLayoutUtil.screenWidth, (screenWidth) { // Check if it was previously in mobile layout, and now changing to desktop if (isMobileLayout && - screenWidth > ResponsiveLayoutUtilBase.kDesktopMaxDashBoardWidthConstraint) { + screenWidth > + ResponsiveLayoutUtilBase.kDesktopMaxDashBoardWidthConstraint) { setState(() { isMobileLayout = false; }); @@ -73,7 +77,8 @@ class _DashboardPageState extends State { // Check if it was previously in desktop layout, and now changing to mobile if (!isMobileLayout && - screenWidth <= ResponsiveLayoutUtilBase.kDesktopMaxDashBoardWidthConstraint) { + screenWidth <= + ResponsiveLayoutUtilBase.kDesktopMaxDashBoardWidthConstraint) { setState(() { isMobileLayout = true; }); @@ -134,13 +139,15 @@ class _DashboardPageView extends BasePage { @override Widget Function(BuildContext, Widget) get rootWrapper => - (BuildContext context, Widget scaffold) => GradientBackground(scaffold: scaffold); + (BuildContext context, Widget scaffold) => + GradientBackground(scaffold: scaffold); @override bool get resizeToAvoidBottomInset => false; @override - Widget get endDrawer => MenuWidget(dashboardViewModel, ValueKey('dashboard_page_drawer_menu_widget_key')); + Widget get endDrawer => MenuWidget( + dashboardViewModel, ValueKey('dashboard_page_drawer_menu_widget_key')); @override Widget leading(BuildContext context) { @@ -160,7 +167,8 @@ class _DashboardPageView extends BasePage { return SyncIndicator( key: ValueKey('dashboard_page_sync_indicator_button_key'), dashboardViewModel: dashboardViewModel, - onTap: () => Navigator.of(context, rootNavigator: true).pushNamed(Routes.connectionSync), + onTap: () => Navigator.of(context, rootNavigator: true) + .pushNamed(Routes.connectionSync), ); } @@ -168,7 +176,8 @@ class _DashboardPageView extends BasePage { Widget trailing(BuildContext context) { final menuButton = Image.asset( 'assets/images/menu.png', - color: Theme.of(context).extension()!.pageTitleTextColor, + color: + Theme.of(context).extension()!.pageTitleTextColor, ); return Container( @@ -190,7 +199,8 @@ class _DashboardPageView extends BasePage { final BottomSheetService bottomSheetService; final WalletAddressListViewModel addressListViewModel; - int get initialPage => dashboardViewModel.shouldShowMarketPlaceInDashboard ? 1 : 0; + int get initialPage => + dashboardViewModel.shouldShowMarketPlaceInDashboard ? 1 : 0; ObservableList pages = ObservableList(); bool _isEffectsInstalled = false; StreamSubscription? _onInactiveSub; @@ -219,14 +229,18 @@ class _DashboardPageView extends BasePage { _setEffects(context); return SafeArea( - minimum: EdgeInsets.only(bottom: 24), + minimum: EdgeInsets.only(bottom: 0), child: BottomSheetListener( bottomSheetService: bottomSheetService, - child: Column( - mainAxisSize: MainAxisSize.max, - children: [ - Expanded( - child: Observer( + child: Container( + child: Stack( + //fit: StackFit.expand, + alignment: Alignment.bottomCenter, + //mainAxisSize: MainAxisSize.max, + //alignment: Alignment.bottomCenter, + children: [ + //new Expanded( + Observer( builder: (context) { return PageView.builder( key: ValueKey('dashboard_page_view_key'), @@ -236,101 +250,322 @@ class _DashboardPageView extends BasePage { ); }, ), - ), - Padding( - padding: EdgeInsets.only(bottom: 24, top: 10), - child: Observer( - builder: (context) { - return Semantics( - button: false, - label: 'Page Indicator', - hint: 'Swipe to change page', - excludeSemantics: true, - child: SmoothPageIndicator( - controller: controller, - count: pages.length, - effect: ColorTransitionEffect( - spacing: 6.0, - radius: 6.0, - dotWidth: 6.0, - dotHeight: 6.0, - dotColor: Theme.of(context) - .extension()! - .indicatorDotTheme - .indicatorColor, - activeDotColor: Theme.of(context) - .extension()! - .indicatorDotTheme - .activeIndicatorColor, - ), - ), - ); - }, - ), - ), - Observer( - builder: (_) { - return ClipRect( - child: Container( - margin: const EdgeInsets.only(left: 16, right: 16), - child: Container( - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(50.0), - border: Border.all( - color: Theme.of(context).extension()!.cardBorderColor, - width: 1, + //), + Positioned( + top: 590, + child: Container( + // decoration: BoxDecoration( + // boxShadow: [ + // BoxShadow( + // color: Theme.of(context) + // .extension()! + // .thirdGradientBackgroundColor + // .withAlpha(50), + // spreadRadius: 5, + // blurRadius: 7, + // offset: Offset(0, 3), + // ) + // ] + // ), + alignment: Alignment.bottomCenter, + //padding: EdgeInsets.only(top: 50), + child: Observer( + builder: (context) { + return Semantics( + button: false, + label: 'Page Indicator', + hint: 'Swipe to change page', + excludeSemantics: true, + child: SmoothPageIndicator( + controller: controller, + count: pages.length, + effect: ColorTransitionEffect( + spacing: 6.0, + radius: 6.0, + dotWidth: 6.0, + dotHeight: 6.0, + dotColor: Theme.of(context) + .extension()! + .indicatorDotTheme + .indicatorColor, + activeDotColor: Theme.of(context) + .extension()! + .indicatorDotTheme + .activeIndicatorColor, + ), ), - color: Theme.of(context) - .extension()! - .syncedBackgroundColor, - ), + ); + }, + ), + ), + ), + currentTheme.type == ThemeType.bright + ? Positioned( + top: 560, + bottom: 0, + left: 0, + right: 0, + child: Observer( + builder: (_) { + return ClipRect( child: Container( - padding: EdgeInsets.symmetric(horizontal: 10), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: MainActions.all - .where((element) => element.canShow?.call(dashboardViewModel) ?? true) - .map( - (action) => Expanded( - child: Semantics( - button: true, - enabled: (action.isEnabled?.call(dashboardViewModel) ?? true), - child: ActionButton( - key: ValueKey( - 'dashboard_page_${action.name(context)}_action_button_key'), - image: Image.asset( - action.image, - height: 24, - width: 24, - color: action.isEnabled?.call(dashboardViewModel) ?? true - ? Theme.of(context) - .extension()! - .mainActionsIconColor - : Theme.of(context) - .extension()! - .labelTextColor, - ), - title: action.name(context), - onClick: () async => - await action.onTap(context, dashboardViewModel), - textColor: action.isEnabled?.call(dashboardViewModel) ?? true - ? null - : Theme.of(context) - .extension()! - .labelTextColor, - ), + decoration: BoxDecoration( + gradient: LinearGradient( + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + colors: [ + Theme.of(context) + .extension()! + .thirdGradientBackgroundColor + .withAlpha(10), + Theme.of(context) + .extension()! + .thirdGradientBackgroundColor + .withAlpha(75), + Theme.of(context) + .extension()! + .thirdGradientBackgroundColor + .withAlpha(150), + Theme.of(context) + .extension()! + .thirdGradientBackgroundColor, + Theme.of(context) + .extension()! + .thirdGradientBackgroundColor + // Color.fromARGB(10, 245, 8, 82), + // Color.fromARGB(75, 245, 8, 82), + // Color.fromARGB(150, 245, 8, 82), + // Color.fromARGB(200, 245, 8, 82), + // Color.fromARGB(255, 245, 8, 82), + ], + ), + ), + child: Container( + alignment: Alignment.bottomCenter, + padding: const EdgeInsets.only( + left: 16, right: 16, bottom: 24, top: 48), + child: ClipRRect( + borderRadius: BorderRadius.circular(50), + child: BackdropFilter( + filter: ImageFilter.blur(sigmaX: 50, sigmaY: 50), + child: Container( + //clipBehavior: Clip.hardEdge, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(50.0), + border: Border.all( + color: Theme.of(context) + .extension()! + .cardBorderColor, + width: 1, + ), + color: Theme.of(context) + .extension()! + .syncedBackgroundColor, + boxShadow: [ + BoxShadow( + color: Theme.of(context).extension()!.cardBorderColor + .withAlpha(50), + spreadRadius: 5, + blurRadius: 7 + ) + ], + ), + child: Container( + padding: EdgeInsets.symmetric(horizontal: 10), + child: Row( + mainAxisAlignment: + MainAxisAlignment.spaceBetween, + children: MainActions.all + .where((element) => + element.canShow + ?.call(dashboardViewModel) ?? + true) + .map( + (action) => Expanded( + child: Semantics( + button: true, + enabled: (action.isEnabled?.call( + dashboardViewModel) ?? + true), + child: ActionButton( + key: ValueKey( + 'dashboard_page_${action.name(context)}_action_button_key'), + image: Image.asset( + action.image, + height: 24, + width: 24, + color: action.isEnabled?.call( + dashboardViewModel) ?? + true + ? Theme.of(context) + .extension< + DashboardPageTheme>()! + .mainActionsIconColor + : Theme.of(context) + .extension< + BalancePageTheme>()! + .labelTextColor, + ), + title: action.name(context), + onClick: () async => + await action.onTap(context, + dashboardViewModel), + textColor: action.isEnabled?.call( + dashboardViewModel) ?? + true + ? null + : Theme.of(context) + .extension< + BalancePageTheme>()! + .labelTextColor, + ), + ), + ), + ) + .toList(), ), ), - ) - .toList(), + ), + ), + // ], + ), ), ), - ), - ), - ); - }, - ), - ], + ); + }, + ), + ) + : + Positioned( + top: 560, + bottom: 0, + left: 0, + right: 0, + child: Observer( + builder: (_) { + return ClipRect( + child: Container( + decoration: BoxDecoration( + gradient: LinearGradient( + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + colors: [ + Theme.of(context) + .extension()! + .thirdGradientBackgroundColor + .withAlpha(10), + Theme.of(context) + .extension()! + .thirdGradientBackgroundColor + .withAlpha(75), + Theme.of(context) + .extension()! + .thirdGradientBackgroundColor + .withAlpha(150), + Theme.of(context) + .extension()! + .thirdGradientBackgroundColor, + Theme.of(context) + .extension()! + .thirdGradientBackgroundColor + // Color.fromARGB(10, 245, 8, 82), + // Color.fromARGB(75, 245, 8, 82), + // Color.fromARGB(150, 245, 8, 82), + // Color.fromARGB(200, 245, 8, 82), + // Color.fromARGB(255, 245, 8, 82), + ], + ), + ), + child: Container( + alignment: Alignment.bottomCenter, + padding: const EdgeInsets.only( + left: 16, right: 16, bottom: 24, top: 48), + child: Container( + //clipBehavior: Clip.hardEdge, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(50.0), + border: Border.all( + color: Theme.of(context) + .extension()! + .cardBorderColor, + width: 1, + ), + color: Theme.of(context) + .extension()! + .syncedBackgroundColor, + boxShadow: [ + BoxShadow( + color: Theme.of(context).extension()!.cardBorderColor + .withAlpha(50), + spreadRadius: 5, + blurRadius: 7 + ) + ], + ), + child: Container( + padding: EdgeInsets.symmetric(horizontal: 10), + child: Row( + mainAxisAlignment: + MainAxisAlignment.spaceBetween, + children: MainActions.all + .where((element) => + element.canShow + ?.call(dashboardViewModel) ?? + true) + .map( + (action) => Expanded( + child: Semantics( + button: true, + enabled: (action.isEnabled?.call( + dashboardViewModel) ?? + true), + child: ActionButton( + key: ValueKey( + 'dashboard_page_${action.name(context)}_action_button_key'), + image: Image.asset( + action.image, + height: 24, + width: 24, + color: action.isEnabled?.call( + dashboardViewModel) ?? + true + ? Theme.of(context) + .extension< + DashboardPageTheme>()! + .mainActionsIconColor + : Theme.of(context) + .extension< + BalancePageTheme>()! + .labelTextColor, + ), + title: action.name(context), + onClick: () async => + await action.onTap(context, + dashboardViewModel), + textColor: action.isEnabled?.call( + dashboardViewModel) ?? + true + ? null + : Theme.of(context) + .extension< + BalancePageTheme>()! + .labelTextColor, + ), + ), + ), + ) + .toList(), + ), + ), + ), + ), + ), + ); + }, + ), + ), + ], + ), ), ), ); @@ -400,9 +635,10 @@ class _DashboardPageView extends BasePage { void _showReleaseNotesPopup(BuildContext context) async { final sharedPrefs = await SharedPreferences.getInstance(); - final currentAppVersion = - VersionComparator.getExtendedVersionNumber(dashboardViewModel.settingsStore.appVersion); - final lastSeenAppVersion = sharedPrefs.getInt(PreferencesKey.lastSeenAppVersion); + final currentAppVersion = VersionComparator.getExtendedVersionNumber( + dashboardViewModel.settingsStore.appVersion); + final lastSeenAppVersion = + sharedPrefs.getInt(PreferencesKey.lastSeenAppVersion); final isNewInstall = sharedPrefs.getBool(PreferencesKey.isNewInstall); if (currentAppVersion != lastSeenAppVersion && !isNewInstall!) { @@ -427,7 +663,8 @@ class _DashboardPageView extends BasePage { } void _showVulnerableSeedsPopup(BuildContext context) async { - final List affectedWalletNames = await dashboardViewModel.checkAffectedWallets(); + final List affectedWalletNames = + await dashboardViewModel.checkAffectedWallets(); if (affectedWalletNames.isNotEmpty) { Future.delayed( @@ -445,7 +682,8 @@ class _DashboardPageView extends BasePage { } void _showHavenPopup(BuildContext context) async { - final List havenWalletList = await dashboardViewModel.checkForHavenWallets(); + final List havenWalletList = + await dashboardViewModel.checkForHavenWallets(); if (havenWalletList.isNotEmpty) { Future.delayed( diff --git a/lib/src/screens/dashboard/pages/balance_page.dart b/lib/src/screens/dashboard/pages/balance_page.dart index a71a6288b..2832c8617 100644 --- a/lib/src/screens/dashboard/pages/balance_page.dart +++ b/lib/src/screens/dashboard/pages/balance_page.dart @@ -304,7 +304,7 @@ class CryptoBalanceWidget extends StatelessWidget { )) ], if (dashboardViewModel.showSilentPaymentsCard) ...[ - SizedBox(height: 10), + SizedBox(height: 15), Padding( padding: const EdgeInsets.fromLTRB(16, 0, 16, 8), child: DashBoardRoundedCardWidget( @@ -579,6 +579,14 @@ class BalanceRowWidget extends StatelessWidget { Container( margin: const EdgeInsets.only(left: 16, right: 16), decoration: BoxDecoration( + boxShadow: [ + BoxShadow( + color: Theme.of(context).extension()!.cardBorderColor + .withAlpha(50), + spreadRadius: 3, + blurRadius: 7 + ) + ], borderRadius: BorderRadius.circular(30.0), border: Border.all( color: Theme.of(context).extension()!.cardBorderColor, diff --git a/lib/src/screens/dashboard/pages/cake_features_page.dart b/lib/src/screens/dashboard/pages/cake_features_page.dart index bd96fd534..9348f6457 100644 --- a/lib/src/screens/dashboard/pages/cake_features_page.dart +++ b/lib/src/screens/dashboard/pages/cake_features_page.dart @@ -22,14 +22,12 @@ class CakeFeaturesPage extends StatelessWidget { @override Widget build(BuildContext context) { - return Padding( - padding: const EdgeInsets.symmetric(horizontal: 10.0), - child: Padding( - padding: const EdgeInsets.symmetric(horizontal: 10.0), + return Padding( + padding: EdgeInsets.symmetric(horizontal: 20), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - SizedBox(height: 50), + SizedBox(height: 10), Text( 'Cake ${S.of(context).features}', style: TextStyle( @@ -60,6 +58,96 @@ class CakeFeaturesPage extends StatelessWidget { ), ), SizedBox(height: 10), + DashBoardRoundedCardWidget( + onTap: () { + if (Platform.isMacOS) { + _launchUrl("buy.cakepay.com"); + } else { + _navigatorToGiftCardsPage(context); + } + }, + title: 'Cake Pay', + subTitle: S.of(context).cake_pay_subtitle, + image: Image.asset( + 'assets/images/cards.png', + height: 100, + width: 115, + fit: BoxFit.cover, + ), + ), + SizedBox(height: 10), + DashBoardRoundedCardWidget( + onTap: () { + if (Platform.isMacOS) { + _launchUrl("buy.cakepay.com"); + } else { + _navigatorToGiftCardsPage(context); + } + }, + title: 'Cake Pay', + subTitle: S.of(context).cake_pay_subtitle, + image: Image.asset( + 'assets/images/cards.png', + height: 100, + width: 115, + fit: BoxFit.cover, + ), + ), + SizedBox(height: 10), + DashBoardRoundedCardWidget( + onTap: () { + if (Platform.isMacOS) { + _launchUrl("buy.cakepay.com"); + } else { + _navigatorToGiftCardsPage(context); + } + }, + title: 'Cake Pay', + subTitle: S.of(context).cake_pay_subtitle, + image: Image.asset( + 'assets/images/cards.png', + height: 100, + width: 115, + fit: BoxFit.cover, + ), + ), + SizedBox(height: 10), + DashBoardRoundedCardWidget( + onTap: () { + if (Platform.isMacOS) { + _launchUrl("buy.cakepay.com"); + } else { + _navigatorToGiftCardsPage(context); + } + }, + title: 'Cake Pay', + subTitle: S.of(context).cake_pay_subtitle, + image: Image.asset( + 'assets/images/cards.png', + height: 100, + width: 115, + fit: BoxFit.cover, + ), + ), + SizedBox(height: 10), + DashBoardRoundedCardWidget( + onTap: () { + if (Platform.isMacOS) { + _launchUrl("buy.cakepay.com"); + } else { + _navigatorToGiftCardsPage(context); + } + }, + title: 'Cake Pay', + subTitle: S.of(context).cake_pay_subtitle, + image: Image.asset( + 'assets/images/cards.png', + height: 100, + width: 115, + fit: BoxFit.cover, + ), + ), + SizedBox(height: 10), DashBoardRoundedCardWidget( onTap: () => _launchUrl("cake.nano-gpt.com"), title: "NanoGPT", @@ -90,13 +178,13 @@ class CakeFeaturesPage extends StatelessWidget { ); }, ), + SizedBox(height: 125), ], ), ), ], ), - ), - ); + ); } void _launchUrl(String url) { diff --git a/lib/src/screens/wallet_list/wallet_list_page.dart b/lib/src/screens/wallet_list/wallet_list_page.dart index 9bf924f61..d4f9dd00c 100644 --- a/lib/src/screens/wallet_list/wallet_list_page.dart +++ b/lib/src/screens/wallet_list/wallet_list_page.dart @@ -32,6 +32,8 @@ import 'package:cw_core/wallet_type.dart'; import 'package:flutter/material.dart'; import 'package:flutter_mobx/flutter_mobx.dart'; +import '../../../themes/extensions/dashboard_page_theme.dart'; + class WalletListPage extends BasePage { WalletListPage({ required this.walletListViewModel, @@ -146,10 +148,11 @@ class WalletListBodyState extends State { return Container( padding: EdgeInsets.only(top: 16), - child: Column( - children: [ - Expanded( - child: SingleChildScrollView( + child: Stack( + fit: StackFit.expand, + alignment: Alignment.bottomCenter, + children: [ + SingleChildScrollView( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ @@ -326,12 +329,39 @@ class WalletListBodyState extends State { ), ), }, + SizedBox(height: 150) ], ), ), - ), - Padding( - padding: const EdgeInsets.all(24), + Positioned( + top: 505, + bottom: 0, + left: 0, + right: 0, + child: Container( + padding: EdgeInsets.only(top: 50), + decoration: BoxDecoration( + gradient: LinearGradient( + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + colors: [ + Theme.of(context).colorScheme.background + .withAlpha(10), + Theme.of(context).colorScheme.background, + Theme.of(context).colorScheme.background, + Theme.of(context).colorScheme.background + // Color.fromARGB(10, 245, 8, 82), + // Color.fromARGB(75, 245, 8, 82), + // Color.fromARGB(150, 245, 8, 82), + // Color.fromARGB(200, 245, 8, 82), + // Color.fromARGB(255, 245, 8, 82), + ], + ), + ), + child: Container( + alignment: Alignment.bottomCenter, + //margin: EdgeInsets.only(top: 24), + padding: EdgeInsets.only(left: 24, right: 24), child: Column( children: [ PrimaryImageButton( @@ -396,6 +426,8 @@ class WalletListBodyState extends State { ], ), ), + ), + ), ], ), );