diff --git a/lib/router.dart b/lib/router.dart index 7a0f71e2d..a253eea22 100644 --- a/lib/router.dart +++ b/lib/router.dart @@ -445,7 +445,10 @@ Route createRoute(RouteSettings settings) { )); case Routes.ioniaWelcomePage: - return CupertinoPageRoute(builder: (_) => getIt.get()); + return CupertinoPageRoute( + fullscreenDialog: true, + builder: (_) => getIt.get(), + ); case Routes.ioniaLoginPage: return CupertinoPageRoute( builder: (_) => getIt.get()); diff --git a/lib/src/screens/dashboard/desktop_widgets/desktop_dashboard_actions.dart b/lib/src/screens/dashboard/desktop_widgets/desktop_dashboard_actions.dart index 3e6b8afd9..e5fa42390 100644 --- a/lib/src/screens/dashboard/desktop_widgets/desktop_dashboard_actions.dart +++ b/lib/src/screens/dashboard/desktop_widgets/desktop_dashboard_actions.dart @@ -1,7 +1,9 @@ import 'package:cake_wallet/entities/main_actions.dart'; import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_action_button.dart'; +import 'package:cake_wallet/src/screens/dashboard/widgets/market_place_page.dart'; import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart'; import 'package:flutter/material.dart'; +import 'package:flutter_mobx/flutter_mobx.dart'; class DesktopDashboardActions extends StatelessWidget { final DashboardViewModel dashboardViewModel; @@ -10,62 +12,69 @@ class DesktopDashboardActions extends StatelessWidget { @override Widget build(BuildContext context) { - return Column( - children: [ - const SizedBox(height: 16), - DesktopActionButton( - title: MainActions.exchangeAction.name(context), - image: MainActions.exchangeAction.image, - canShow: MainActions.exchangeAction.canShow?.call(dashboardViewModel), - isEnabled: MainActions.exchangeAction.isEnabled?.call(dashboardViewModel), - onTap: () async => await MainActions.exchangeAction.onTap(context, dashboardViewModel), - ), - Row( + return Observer( + builder: (_) { + return Column( children: [ - Expanded( - child: DesktopActionButton( - title: MainActions.receiveAction.name(context), - image: MainActions.receiveAction.image, - canShow: MainActions.receiveAction.canShow?.call(dashboardViewModel), - isEnabled: MainActions.receiveAction.isEnabled?.call(dashboardViewModel), - onTap: () async => - await MainActions.receiveAction.onTap(context, dashboardViewModel), - ), + const SizedBox(height: 16), + DesktopActionButton( + title: MainActions.exchangeAction.name(context), + image: MainActions.exchangeAction.image, + canShow: MainActions.exchangeAction.canShow?.call(dashboardViewModel), + isEnabled: MainActions.exchangeAction.isEnabled?.call(dashboardViewModel), + onTap: () async => await MainActions.exchangeAction.onTap(context, dashboardViewModel), + ), + Row( + children: [ + Expanded( + child: DesktopActionButton( + title: MainActions.receiveAction.name(context), + image: MainActions.receiveAction.image, + canShow: MainActions.receiveAction.canShow?.call(dashboardViewModel), + isEnabled: MainActions.receiveAction.isEnabled?.call(dashboardViewModel), + onTap: () async => + await MainActions.receiveAction.onTap(context, dashboardViewModel), + ), + ), + Expanded( + child: DesktopActionButton( + title: MainActions.sendAction.name(context), + image: MainActions.sendAction.image, + canShow: MainActions.sendAction.canShow?.call(dashboardViewModel), + isEnabled: MainActions.sendAction.isEnabled?.call(dashboardViewModel), + onTap: () async => await MainActions.sendAction.onTap(context, dashboardViewModel), + ), + ), + ], + ), + Row( + children: [ + Expanded( + child: DesktopActionButton( + title: MainActions.buyAction.name(context), + image: MainActions.buyAction.image, + canShow: MainActions.buyAction.canShow?.call(dashboardViewModel), + isEnabled: MainActions.buyAction.isEnabled?.call(dashboardViewModel), + onTap: () async => await MainActions.buyAction.onTap(context, dashboardViewModel), + ), + ), + Expanded( + child: DesktopActionButton( + title: MainActions.sellAction.name(context), + image: MainActions.sellAction.image, + canShow: MainActions.sellAction.canShow?.call(dashboardViewModel), + isEnabled: MainActions.sellAction.isEnabled?.call(dashboardViewModel), + onTap: () async => await MainActions.sellAction.onTap(context, dashboardViewModel), + ), + ), + ], ), Expanded( - child: DesktopActionButton( - title: MainActions.sendAction.name(context), - image: MainActions.sendAction.image, - canShow: MainActions.sendAction.canShow?.call(dashboardViewModel), - isEnabled: MainActions.sendAction.isEnabled?.call(dashboardViewModel), - onTap: () async => await MainActions.sendAction.onTap(context, dashboardViewModel), - ), + child: MarketPlacePage(dashboardViewModel: dashboardViewModel), ), ], - ), - Row( - children: [ - Expanded( - child: DesktopActionButton( - title: MainActions.buyAction.name(context), - image: MainActions.buyAction.image, - canShow: MainActions.buyAction.canShow?.call(dashboardViewModel), - isEnabled: MainActions.buyAction.isEnabled?.call(dashboardViewModel), - onTap: () async => await MainActions.buyAction.onTap(context, dashboardViewModel), - ), - ), - Expanded( - child: DesktopActionButton( - title: MainActions.sellAction.name(context), - image: MainActions.sellAction.image, - canShow: MainActions.sellAction.canShow?.call(dashboardViewModel), - isEnabled: MainActions.sellAction.isEnabled?.call(dashboardViewModel), - onTap: () async => await MainActions.sellAction.onTap(context, dashboardViewModel), - ), - ), - ], - ), - ], + ); + } ); } } diff --git a/lib/src/screens/new_wallet/new_wallet_page.dart b/lib/src/screens/new_wallet/new_wallet_page.dart index 9e0cd898c..054961c44 100644 --- a/lib/src/screens/new_wallet/new_wallet_page.dart +++ b/lib/src/screens/new_wallet/new_wallet_page.dart @@ -1,6 +1,7 @@ import 'package:cake_wallet/entities/generate_name.dart'; import 'package:cake_wallet/routes.dart'; import 'package:cake_wallet/themes/theme_base.dart'; +import 'package:cake_wallet/utils/responsive_layout_util.dart'; import 'package:cake_wallet/utils/show_pop_up.dart'; import 'package:mobx/mobx.dart'; import 'package:flutter_mobx/flutter_mobx.dart'; @@ -24,18 +25,14 @@ class NewWalletPage extends BasePage { final walletNameImage = Image.asset('assets/images/wallet_name.png'); - final walletNameLightImage = - Image.asset('assets/images/wallet_name_light.png'); + final walletNameLightImage = Image.asset('assets/images/wallet_name_light.png'); @override String get title => S.current.new_wallet; @override Widget body(BuildContext context) => WalletNameForm( - _walletNewVM, - currentTheme.type == ThemeType.dark - ? walletNameImage - : walletNameLightImage); + _walletNewVM, currentTheme.type == ThemeType.dark ? walletNameImage : walletNameLightImage); } class WalletNameForm extends StatefulWidget { @@ -50,9 +47,9 @@ class WalletNameForm extends StatefulWidget { class _WalletNameFormState extends State { _WalletNameFormState(this._walletNewVM) - : _formKey = GlobalKey(), - _languageSelectorKey = GlobalKey(), - _controller = TextEditingController(); + : _formKey = GlobalKey(), + _languageSelectorKey = GlobalKey(), + _controller = TextEditingController(); static const aspectRatioImage = 1.22; @@ -64,11 +61,9 @@ class _WalletNameFormState extends State { @override void initState() { - _stateReaction ??= - reaction((_) => _walletNewVM.state, (ExecutionState state) { + _stateReaction ??= reaction((_) => _walletNewVM.state, (ExecutionState state) { if (state is ExecutedSuccessfullyState) { - Navigator.of(context) - .pushNamed(Routes.preSeed, arguments: _walletNewVM.type); + Navigator.of(context).pushNamed(Routes.preSeed, arguments: _walletNewVM.type); } if (state is FailureState) { @@ -90,140 +85,144 @@ class _WalletNameFormState extends State { @override Widget build(BuildContext context) { - return Container( + return Padding( padding: EdgeInsets.only(top: 24), child: ScrollableWithBottomSection( contentPadding: EdgeInsets.only(left: 24, right: 24, bottom: 24), - content: - Column(crossAxisAlignment: CrossAxisAlignment.center, children: [ - Padding( - padding: EdgeInsets.only(left: 12, right: 12), - child: AspectRatio( - aspectRatio: aspectRatioImage, - child: - FittedBox(child: widget.walletImage, fit: BoxFit.fill)), - ), - Padding( - padding: EdgeInsets.only(top: 24), - child: Form( - key: _formKey, - child: Stack( - alignment: Alignment.centerRight, - children: [ - TextFormField( - onChanged: (value) => _walletNewVM.name = value, - controller: _controller, - textAlign: TextAlign.center, - style: TextStyle( - fontSize: 20.0, - fontWeight: FontWeight.w600, - color: - Theme.of(context).primaryTextTheme!.headline6!.color!), - decoration: InputDecoration( - hintStyle: TextStyle( - fontSize: 18.0, - fontWeight: FontWeight.w500, - color: Theme.of(context) - .accentTextTheme! - .headline2! - .color!), - hintText: S.of(context).wallet_name, - focusedBorder: UnderlineInputBorder( - borderSide: BorderSide( - color: Theme.of(context) - .accentTextTheme! - .headline2! - .decorationColor!, - width: 1.0)), - enabledBorder: UnderlineInputBorder( - borderSide: BorderSide( - color: Theme.of(context) - .accentTextTheme! - .headline2! - .decorationColor!, - width: 1.0), - ), - suffixIcon: IconButton( - onPressed: () async { - final rName = await generateName(); - FocusManager.instance.primaryFocus?.unfocus(); + content: Center( + child: ConstrainedBox( + constraints: + BoxConstraints(maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint), + child: Column( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + Padding( + padding: EdgeInsets.only(left: 12, right: 12), + child: AspectRatio( + aspectRatio: aspectRatioImage, + child: FittedBox(child: widget.walletImage, fit: BoxFit.fill)), + ), + Padding( + padding: EdgeInsets.only(top: 24), + child: Form( + key: _formKey, + child: Stack( + alignment: Alignment.centerRight, + children: [ + TextFormField( + onChanged: (value) => _walletNewVM.name = value, + controller: _controller, + textAlign: TextAlign.center, + style: TextStyle( + fontSize: 20.0, + fontWeight: FontWeight.w600, + color: Theme.of(context).primaryTextTheme!.headline6!.color!), + decoration: InputDecoration( + hintStyle: TextStyle( + fontSize: 18.0, + fontWeight: FontWeight.w500, + color: Theme.of(context).accentTextTheme!.headline2!.color!), + hintText: S.of(context).wallet_name, + focusedBorder: UnderlineInputBorder( + borderSide: BorderSide( + color: Theme.of(context) + .accentTextTheme! + .headline2! + .decorationColor!, + width: 1.0)), + enabledBorder: UnderlineInputBorder( + borderSide: BorderSide( + color: Theme.of(context) + .accentTextTheme! + .headline2! + .decorationColor!, + width: 1.0), + ), + suffixIcon: IconButton( + onPressed: () async { + final rName = await generateName(); + FocusManager.instance.primaryFocus?.unfocus(); - setState(() { - _controller.text = rName; - _walletNewVM.name = rName; - _controller.selection = TextSelection.fromPosition( - TextPosition(offset: _controller.text.length)); - }); - }, - icon: Container( - padding: const EdgeInsets.all(8), - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(6.0), - color: Theme.of(context).hintColor, - ), - width: 34, - height: 34, - child: Image.asset( - 'assets/images/refresh_icon.png', - color: Theme.of(context) - .primaryTextTheme! - .headline4! - .decorationColor!, + setState(() { + _controller.text = rName; + _walletNewVM.name = rName; + _controller.selection = TextSelection.fromPosition( + TextPosition(offset: _controller.text.length)); + }); + }, + icon: Container( + padding: const EdgeInsets.all(8), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(6.0), + color: Theme.of(context).hintColor, + ), + width: 34, + height: 34, + child: Image.asset( + 'assets/images/refresh_icon.png', + color: Theme.of(context) + .primaryTextTheme! + .headline4! + .decorationColor!, + ), + ), + ), ), + validator: WalletNameValidator(), ), - ), + ], ), - validator: WalletNameValidator(), ), - ], - ), + ), + if (_walletNewVM.hasLanguageSelector) ...[ + Padding( + padding: EdgeInsets.only(top: 40), + child: Text( + S.of(context).seed_language_choose, + textAlign: TextAlign.center, + style: TextStyle( + fontSize: 16.0, + fontWeight: FontWeight.w500, + color: Theme.of(context).primaryTextTheme!.headline6!.color!), + ), + ), + Padding( + padding: EdgeInsets.only(top: 24), + child: SeedLanguageSelector( + key: _languageSelectorKey, initialSelected: defaultSeedLanguage), + ) + ] + ], ), ), - if (_walletNewVM.hasLanguageSelector) ...[ - Padding( - padding: EdgeInsets.only(top: 40), - child: Text( - S.of(context).seed_language_choose, - textAlign: TextAlign.center, - style: TextStyle( - fontSize: 16.0, - fontWeight: FontWeight.w500, - color: Theme.of(context).primaryTextTheme!.headline6!.color!), + ), + bottomSectionPadding: EdgeInsets.all(24), + bottomSection: ConstrainedBox( + constraints: BoxConstraints(maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint), + child: Column( + children: [ + Observer( + builder: (context) { + return LoadingPrimaryButton( + onPressed: _confirmForm, + text: S.of(context).seed_language_next, + color: Colors.green, + textColor: Colors.white, + isLoading: _walletNewVM.state is IsExecutingState, + isDisabled: _walletNewVM.name.isEmpty, + ); + }, ), - ), - Padding( - padding: EdgeInsets.only(top: 24), - child: SeedLanguageSelector( - key: _languageSelectorKey, - initialSelected: defaultSeedLanguage), - ) - ] - ]), - bottomSectionPadding: - EdgeInsets.all(24), - bottomSection: Column( - children: [ - Observer( - builder: (context) { - return LoadingPrimaryButton( - onPressed: _confirmForm, - text: S.of(context).seed_language_next, - color: Colors.green, - textColor: Colors.white, - isLoading: _walletNewVM.state is IsExecutingState, - isDisabled: _walletNewVM.name.isEmpty, - ); - }, - ), - const SizedBox(height: 25), - GestureDetector( - onTap: () { - Navigator.of(context) - .pushNamed(Routes.advancedPrivacySettings, arguments: _walletNewVM.type); - }, - child: Text(S.of(context).advanced_privacy_settings), - ), - ], + const SizedBox(height: 25), + GestureDetector( + onTap: () { + Navigator.of(context) + .pushNamed(Routes.advancedPrivacySettings, arguments: _walletNewVM.type); + }, + child: Text(S.of(context).advanced_privacy_settings), + ), + ], + ), )), ); } diff --git a/lib/src/screens/new_wallet/new_wallet_type_page.dart b/lib/src/screens/new_wallet/new_wallet_type_page.dart index 41179f34c..3493f60e0 100644 --- a/lib/src/screens/new_wallet/new_wallet_type_page.dart +++ b/lib/src/screens/new_wallet/new_wallet_type_page.dart @@ -1,3 +1,4 @@ +import 'package:cake_wallet/utils/responsive_layout_util.dart'; import 'package:cw_core/wallet_type.dart'; import 'package:cake_wallet/themes/theme_base.dart'; import 'package:flutter/material.dart'; @@ -13,23 +14,19 @@ class NewWalletTypePage extends BasePage { final void Function(BuildContext, WalletType) onTypeSelected; final walletTypeImage = Image.asset('assets/images/wallet_type.png'); - final walletTypeLightImage = - Image.asset('assets/images/wallet_type_light.png'); + final walletTypeLightImage = Image.asset('assets/images/wallet_type_light.png'); @override String get title => S.current.wallet_list_restore_wallet; @override Widget body(BuildContext context) => WalletTypeForm( - onTypeSelected: onTypeSelected, - walletImage: currentTheme.type == ThemeType.dark - ? walletTypeImage - : walletTypeLightImage); + onTypeSelected: onTypeSelected, + walletImage: currentTheme.type == ThemeType.dark ? walletTypeImage : walletTypeLightImage); } class WalletTypeForm extends StatefulWidget { - WalletTypeForm({required this.onTypeSelected, - required this.walletImage}); + WalletTypeForm({required this.onTypeSelected, required this.walletImage}); final void Function(BuildContext, WalletType) onTypeSelected; final Image walletImage; @@ -39,22 +36,16 @@ class WalletTypeForm extends StatefulWidget { } class WalletTypeFormState extends State { - WalletTypeFormState() - : types = availableWalletTypes; + WalletTypeFormState() : types = availableWalletTypes; static const aspectRatioImage = 1.22; - final moneroIcon = - Image.asset('assets/images/monero_logo.png', height: 24, width: 24); - final bitcoinIcon = - Image.asset('assets/images/bitcoin.png', height: 24, width: 24); - final litecoinIcon = - Image.asset('assets/images/litecoin_icon.png', height: 24, width: 24); + final moneroIcon = Image.asset('assets/images/monero_logo.png', height: 24, width: 24); + final bitcoinIcon = Image.asset('assets/images/bitcoin.png', height: 24, width: 24); + final litecoinIcon = Image.asset('assets/images/litecoin_icon.png', height: 24, width: 24); final walletTypeImage = Image.asset('assets/images/wallet_type.png'); - final walletTypeLightImage = - Image.asset('assets/images/wallet_type_light.png'); - final havenIcon = - Image.asset('assets/images/haven_logo.png', height: 24, width: 24); + final walletTypeLightImage = Image.asset('assets/images/wallet_type_light.png'); + final havenIcon = Image.asset('assets/images/haven_logo.png', height: 24, width: 24); WalletType? selected; List types; @@ -69,43 +60,51 @@ class WalletTypeFormState extends State { Widget build(BuildContext context) { return ScrollableWithBottomSection( contentPadding: EdgeInsets.only(left: 24, right: 24, bottom: 24), - content: Column( - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - Padding( - padding: EdgeInsets.only(left: 12, right: 12), - child: AspectRatio( - aspectRatio: aspectRatioImage, - child: FittedBox(child: widget.walletImage, fit: BoxFit.fill)), + content: Center( + child: ConstrainedBox( + constraints: BoxConstraints(maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint), + child: Column( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + Padding( + padding: EdgeInsets.only(left: 12, right: 12), + child: AspectRatio( + aspectRatio: aspectRatioImage, + child: FittedBox(child: widget.walletImage, fit: BoxFit.fill)), + ), + Padding( + padding: EdgeInsets.only(top: 48), + child: Text( + S.of(context).choose_wallet_currency, + textAlign: TextAlign.center, + style: TextStyle( + fontSize: 16, + fontWeight: FontWeight.w500, + color: Theme.of(context).primaryTextTheme.headline6!.color!), + ), + ), + ...types.map((type) => Padding( + padding: EdgeInsets.only(top: 24), + child: SelectButton( + image: _iconFor(type), + text: walletTypeToDisplayName(type), + isSelected: selected == type, + onTap: () => setState(() => selected = type)), + )) + ], ), - Padding( - padding: EdgeInsets.only(top: 48), - child: Text( - S.of(context).choose_wallet_currency, - textAlign: TextAlign.center, - style: TextStyle( - fontSize: 16, - fontWeight: FontWeight.w500, - color: Theme.of(context).primaryTextTheme.headline6!.color!), - ), - ), - ...types.map((type) => Padding( - padding: EdgeInsets.only(top: 24), - child: SelectButton( - image: _iconFor(type), - text: walletTypeToDisplayName(type), - isSelected: selected == type, - onTap: () => setState(() => selected = type)), - )) - ], + ), ), bottomSectionPadding: EdgeInsets.only(left: 24, right: 24, bottom: 24), - bottomSection: PrimaryButton( - onPressed: () => onTypeSelected(), - text: S.of(context).seed_language_next, - color: Theme.of(context).accentTextTheme.bodyText1!.color!, - textColor: Colors.white, - isDisabled: selected == null, + bottomSection: ConstrainedBox( + constraints: BoxConstraints(maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint), + child: PrimaryButton( + onPressed: () => onTypeSelected(), + text: S.of(context).seed_language_next, + color: Theme.of(context).accentTextTheme.bodyText1!.color!, + textColor: Colors.white, + isDisabled: selected == null, + ), ), ); } @@ -121,7 +120,8 @@ class WalletTypeFormState extends State { case WalletType.haven: return havenIcon; default: - throw Exception('_iconFor: Incorrect Wallet Type. Cannot find icon for Wallet Type: ${type.toString()}'); + throw Exception( + '_iconFor: Incorrect Wallet Type. Cannot find icon for Wallet Type: ${type.toString()}'); } } diff --git a/lib/src/screens/pin_code/pin_code_widget.dart b/lib/src/screens/pin_code/pin_code_widget.dart index a647f3d95..8f30136d0 100644 --- a/lib/src/screens/pin_code/pin_code_widget.dart +++ b/lib/src/screens/pin_code/pin_code_widget.dart @@ -1,17 +1,19 @@ +import 'package:cake_wallet/utils/responsive_layout_util.dart'; import 'package:cake_wallet/utils/show_bar.dart'; import 'package:another_flushbar/flushbar.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/generated/i18n.dart'; +import 'package:flutter/services.dart'; class PinCodeWidget extends StatefulWidget { - PinCodeWidget( - {required Key key, - required this.onFullPin, - required this.initialPinLength, - required this.onChangedPin, - required this.hasLengthSwitcher, - this.onChangedPinLength,}) - : super(key: key); + PinCodeWidget({ + required Key key, + required this.onFullPin, + required this.initialPinLength, + required this.onChangedPin, + required this.hasLengthSwitcher, + this.onChangedPinLength, + }) : super(key: key); final void Function(String pin, PinCodeState state) onFullPin; final void Function(String pin) onChangedPin; @@ -25,10 +27,10 @@ class PinCodeWidget extends StatefulWidget { class PinCodeState extends State { PinCodeState() - : _aspectRatio = 0, - pinLength = 0, - pin = '', - title = ''; + : _aspectRatio = 0, + pinLength = 0, + pin = '', + title = ''; static const defaultPinLength = fourPinLength; static const sixPinLength = 6; static const fourPinLength = 4; @@ -75,8 +77,7 @@ class PinCodeState extends State { void setDefaultPinLength() => changePinLength(widget.initialPinLength); void calculateAspectRatio() { - final renderBox = - _gridViewKey.currentContext!.findRenderObject() as RenderBox; + final renderBox = _gridViewKey.currentContext!.findRenderObject() as RenderBox; final cellWidth = renderBox.size.width / 3; final cellHeight = renderBox.size.height / 4; @@ -89,8 +90,7 @@ class PinCodeState extends State { void changeProcessText(String text) { hideProgressText(); - _progressBar = createBar(text, duration: null) - ..show(_key.currentContext!); + _progressBar = createBar(text, duration: null)..show(_key.currentContext!); } void close() { @@ -104,8 +104,8 @@ class PinCodeState extends State { } @override - Widget build(BuildContext context) => Scaffold( - key: _key, body: body(context), resizeToAvoidBottomInset: false); + Widget build(BuildContext context) => + Scaffold(key: _key, body: body(context), resizeToAvoidBottomInset: false); Widget body(BuildContext context) { final deleteIconImage = Image.asset( @@ -117,157 +117,184 @@ class PinCodeState extends State { color: Theme.of(context).primaryTextTheme!.headline6!.color!, ); - return Container( - color: Theme.of(context).backgroundColor, - padding: EdgeInsets.only(left: 40.0, right: 40.0, bottom: 40.0), - child: Column(children: [ - Spacer(flex: 2), - Text(title, - style: TextStyle( - fontSize: 20, - fontWeight: FontWeight.w500, - color: Theme.of(context).primaryTextTheme!.headline6!.color!)), - Spacer(flex: 3), - Container( - width: 180, - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: List.generate(pinLength, (index) { - const size = 10.0; - final isFilled = pin.length > index ? pin[index] != null : false; - - return Container( - width: size, - height: size, - decoration: BoxDecoration( - shape: BoxShape.circle, - color: isFilled - ? Theme.of(context).primaryTextTheme!.headline6!.color! - : Theme.of(context) - .accentTextTheme! - .bodyText2! - .color! - .withOpacity(0.25), - )); - }), - ), - ), - Spacer(flex: 2), - if (widget.hasLengthSwitcher) ...[ - TextButton( - onPressed: () { - changePinLength(pinLength == PinCodeState.fourPinLength - ? PinCodeState.sixPinLength - : PinCodeState.fourPinLength); - }, - child: Text( - _changePinLengthText(), + return RawKeyboardListener( + focusNode: FocusNode(), + autofocus: true, + onKey: (keyEvent) { + if (keyEvent is RawKeyDownEvent) { + if (keyEvent.logicalKey.keyLabel == "Backspace") { + _pop(); + return; + } + int? number = int.tryParse(keyEvent.character ?? ''); + if (number != null) { + _push(number); + } + } + }, + child: Container( + color: Theme.of(context).backgroundColor, + padding: EdgeInsets.only(left: 40.0, right: 40.0, bottom: 40.0), + child: Column( + children: [ + Spacer(flex: 2), + Text(title, style: TextStyle( - fontSize: 14.0, - fontWeight: FontWeight.normal, - color: Theme.of(context) - .accentTextTheme! - .bodyText2! - .decorationColor!), - )) - ], - Spacer(flex: 1), - Flexible( - flex: 24, - child: Container( - key: _gridViewKey, - child: _aspectRatio > 0 - ? GridView.count( - shrinkWrap: true, - crossAxisCount: 3, - childAspectRatio: _aspectRatio, - physics: const NeverScrollableScrollPhysics(), - children: List.generate(12, (index) { - const double marginRight = 15; - const double marginLeft = 15; + fontSize: 20, + fontWeight: FontWeight.w500, + color: Theme.of(context).primaryTextTheme!.headline6!.color!)), + Spacer(flex: 3), + Container( + width: 180, + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: List.generate(pinLength, (index) { + const size = 10.0; + final isFilled = pin.length > index ? pin[index] != null : false; - if (index == 9) { - return Container( - margin: EdgeInsets.only( - left: marginLeft, right: marginRight), - child: TextButton( - onPressed: () => null, - // (widget.hasLengthSwitcher || - // !settingsStore - // .allowBiometricalAuthentication) - // ? null - // : () { - // FIXME -// if (authStore != null) { -// WidgetsBinding.instance.addPostFrameCallback((_) { -// final biometricAuth = BiometricAuth(); -// biometricAuth.isAuthenticated().then( -// (isAuth) { -// if (isAuth) { -// authStore.biometricAuth(); -// _key.currentState.showSnackBar( -// SnackBar( -// content: Text(S.of(context).authenticated), -// backgroundColor: Colors.green, -// ), -// ); -// } -// } -// ); -// }); -// } -// }, - // FIX-ME: Style - //color: Theme.of(context).backgroundColor, - //shape: CircleBorder(), - child: Container() - // (widget.hasLengthSwitcher || - // !settingsStore - // .allowBiometricalAuthentication) - // ? Offstage() - // : faceImage, + return Container( + width: size, + height: size, + decoration: BoxDecoration( + shape: BoxShape.circle, + color: isFilled + ? Theme.of(context).primaryTextTheme!.headline6!.color! + : Theme.of(context) + .accentTextTheme! + .bodyText2! + .color! + .withOpacity(0.25), + )); + }), + ), + ), + Spacer(flex: 2), + if (widget.hasLengthSwitcher) ...[ + TextButton( + onPressed: () { + changePinLength(pinLength == PinCodeState.fourPinLength + ? PinCodeState.sixPinLength + : PinCodeState.fourPinLength); + }, + child: Text( + _changePinLengthText(), + style: TextStyle( + fontSize: 14.0, + fontWeight: FontWeight.normal, + color: Theme.of(context).accentTextTheme!.bodyText2!.decorationColor!), + ), + ) + ], + Spacer(flex: 1), + Flexible( + flex: 24, + child: Center( + child: ConstrainedBox( + constraints: BoxConstraints( + maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint, + ), + child: Container( + key: _gridViewKey, + child: _aspectRatio > 0 + ? ScrollConfiguration( + behavior: ScrollConfiguration.of(context).copyWith(scrollbars: false), + child: GridView.count( + shrinkWrap: true, + crossAxisCount: 3, + childAspectRatio: _aspectRatio, + physics: const NeverScrollableScrollPhysics(), + children: List.generate(12, (index) { + const double marginRight = 15; + const double marginLeft = 15; + + if (index == 9) { + return Container( + margin: EdgeInsets.only(left: marginLeft, right: marginRight), + child: TextButton( + onPressed: () => null, + // (widget.hasLengthSwitcher || + // !settingsStore + // .allowBiometricalAuthentication) + // ? null + // : () { + // FIXME + // if (authStore != null) { + // WidgetsBinding.instance.addPostFrameCallback((_) { + // final biometricAuth = BiometricAuth(); + // biometricAuth.isAuthenticated().then( + // (isAuth) { + // if (isAuth) { + // authStore.biometricAuth(); + // _key.currentState.showSnackBar( + // SnackBar( + // content: Text(S.of(context).authenticated), + // backgroundColor: Colors.green, + // ), + // ); + // } + // } + // ); + // }); + // } + // }, + // FIX-ME: Style + //color: Theme.of(context).backgroundColor, + //shape: CircleBorder(), + child: Container() + // (widget.hasLengthSwitcher || + // !settingsStore + // .allowBiometricalAuthentication) + // ? Offstage() + // : faceImage, + ), + ); + } else if (index == 10) { + index = 0; + } else if (index == 11) { + return Container( + margin: EdgeInsets.only(left: marginLeft, right: marginRight), + child: TextButton( + onPressed: () => _pop(), + style: TextButton.styleFrom( + backgroundColor: Theme.of(context).backgroundColor, + shape: CircleBorder(), + ), + child: deleteIconImage, + ), + ); + } else { + index++; + } + + return Container( + margin: EdgeInsets.only(left: marginLeft, right: marginRight), + child: TextButton( + onPressed: () => _push(index), + style: TextButton.styleFrom( + backgroundColor: Theme.of(context).backgroundColor, + shape: CircleBorder(), + ), + child: Text('$index', + style: TextStyle( + fontSize: 30.0, + fontWeight: FontWeight.w600, + color: Theme.of(context) + .primaryTextTheme! + .headline6! + .color!)), ), - ); - } else if (index == 10) { - index = 0; - } else if (index == 11) { - return Container( - margin: EdgeInsets.only( - left: marginLeft, right: marginRight), - child: TextButton( - onPressed: () => _pop(), - // FIX-ME: Style - //color: Theme.of(context).backgroundColor, - //shape: CircleBorder(), - child: deleteIconImage, - ), - ); - } else { - index++; - } - - return Container( - margin: EdgeInsets.only( - left: marginLeft, right: marginRight), - child: TextButton( - onPressed: () => _push(index), - // FIX-ME: Style - //color: Theme.of(context).backgroundColor, - //shape: CircleBorder(), - child: Text('$index', - style: TextStyle( - fontSize: 30.0, - fontWeight: FontWeight.w600, - color: Theme.of(context) - .primaryTextTheme! - .headline6! - .color!)), + ); + }), ), - ); - }), - ) - : null)) - ]), + ) + : null, + ), + ), + ), + ) + ], + ), + ), ); } diff --git a/lib/src/screens/welcome/welcome_page.dart b/lib/src/screens/welcome/welcome_page.dart index a50d8ba8c..86e1cbcf1 100644 --- a/lib/src/screens/welcome/welcome_page.dart +++ b/lib/src/screens/welcome/welcome_page.dart @@ -1,4 +1,5 @@ import 'package:cake_wallet/themes/theme_base.dart'; +import 'package:cake_wallet/utils/responsive_layout_util.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/routes.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; @@ -19,7 +20,7 @@ class WelcomePage extends BasePage { if (isHaven) { return S.of(context).haven_app; } - + return S.of(context).cake_wallet; } @@ -31,172 +32,137 @@ class WelcomePage extends BasePage { if (isHaven) { return S.of(context).haven_app_wallet_text; } - + return S.of(context).first_wallet_text; } @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: Theme - .of(context) - .backgroundColor, + backgroundColor: Theme.of(context).backgroundColor, resizeToAvoidBottomInset: false, body: body(context)); } @override Widget body(BuildContext context) { - final welcomeImage = currentTheme.type == ThemeType.dark - ? welcomeImageDark : welcomeImageLight; + final welcomeImage = currentTheme.type == ThemeType.dark ? welcomeImageDark : welcomeImageLight; final newWalletImage = Image.asset('assets/images/new_wallet.png', height: 12, width: 12, - color: Theme - .of(context) - .accentTextTheme! - .headline5! - .decorationColor!); + color: Theme.of(context).accentTextTheme!.headline5!.decorationColor!); final restoreWalletImage = Image.asset('assets/images/restore_wallet.png', - height: 12, - width: 12, - color: Theme.of(context) - .primaryTextTheme! - .headline6! - .color!); + height: 12, width: 12, color: Theme.of(context).primaryTextTheme!.headline6!.color!); - return WillPopScope(onWillPop: () async => false, child: Container( - padding: EdgeInsets.only(top: 64, bottom: 24, left: 24, right: 24), - child: Column( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Flexible( - flex: 2, - child: AspectRatio( - aspectRatio: aspectRatioImage, - child: FittedBox(child: welcomeImage, fit: BoxFit.fill) - ) - ), - Flexible( - flex: 3, + return WillPopScope( + onWillPop: () async => false, + child: Container( + padding: EdgeInsets.only(top: 64, bottom: 24, left: 24, right: 24), + child: Center( + child: ConstrainedBox( + constraints: + BoxConstraints(maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint), child: Column( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Column( - children: [ - Padding( - padding: EdgeInsets.only(top: 24), - child: Text( - S - .of(context) - .welcome, - style: TextStyle( - fontSize: 18, - fontWeight: FontWeight.w500, - color: Theme - .of(context) - .accentTextTheme! - .headline2! - .color!, + Flexible( + flex: 2, + child: AspectRatio( + aspectRatio: aspectRatioImage, + child: FittedBox(child: welcomeImage, fit: BoxFit.fill))), + Flexible( + flex: 3, + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Column( + children: [ + Padding( + padding: EdgeInsets.only(top: 24), + child: Text( + S.of(context).welcome, + style: TextStyle( + fontSize: 18, + fontWeight: FontWeight.w500, + color: Theme.of(context).accentTextTheme!.headline2!.color!, + ), + textAlign: TextAlign.center, + ), + ), + Padding( + padding: EdgeInsets.only(top: 5), + child: Text( + appTitle(context), + style: TextStyle( + fontSize: 36, + fontWeight: FontWeight.bold, + color: Theme.of(context).primaryTextTheme!.headline6!.color!, + ), + textAlign: TextAlign.center, + ), + ), + Padding( + padding: EdgeInsets.only(top: 5), + child: Text( + appDescription(context), + style: TextStyle( + fontSize: 16, + fontWeight: FontWeight.w500, + color: Theme.of(context).accentTextTheme!.headline2!.color!, + ), + textAlign: TextAlign.center, + ), + ), + ], ), - textAlign: TextAlign.center, - ), - ), - Padding( - padding: EdgeInsets.only(top: 5), - child: Text( - appTitle(context), - style: TextStyle( - fontSize: 36, - fontWeight: FontWeight.bold, - color: Theme.of(context) - .primaryTextTheme! - .headline6! - .color!, - ), - textAlign: TextAlign.center, - ), - ), - Padding( - padding: EdgeInsets.only(top: 5), - child: Text( - appDescription(context), - style: TextStyle( - fontSize: 16, - fontWeight: FontWeight.w500, - color: Theme - .of(context) - .accentTextTheme! - .headline2! - .color!, - ), - textAlign: TextAlign.center, - ), - ), - ], - ), - Column( - children: [ - Text( - S - .of(context) - .please_make_selection, - style: TextStyle( - fontSize: 12, - fontWeight: FontWeight.normal, - color: Theme.of(context) - .accentTextTheme! - .headline2! - .color!, - ), - textAlign: TextAlign.center, - ), - Padding( - padding: EdgeInsets.only(top: 24), - child: PrimaryImageButton( - onPressed: () => - Navigator.pushNamed(context, - Routes.newWalletFromWelcome), - image: newWalletImage, - text: S.of(context).create_new, - color: Theme.of(context) - .accentTextTheme! - .subtitle2! - .decorationColor!, - textColor: Theme - .of(context) - .accentTextTheme! - .headline5! - .decorationColor!, - ), - ), - Padding( - padding: EdgeInsets.only(top: 10), - child: PrimaryImageButton( - onPressed: () { - Navigator.pushNamed(context, Routes.restoreOptions); - }, - image: restoreWalletImage, - text: S - .of(context) - .restore_wallet, - color: Theme.of(context) - .accentTextTheme! - .caption! - .color!, - textColor: Theme.of(context) - .primaryTextTheme! - .headline6! - .color!), - ) - ], - ) + Column( + children: [ + Text( + S.of(context).please_make_selection, + style: TextStyle( + fontSize: 12, + fontWeight: FontWeight.normal, + color: Theme.of(context).accentTextTheme!.headline2!.color!, + ), + textAlign: TextAlign.center, + ), + Padding( + padding: EdgeInsets.only(top: 24), + child: PrimaryImageButton( + onPressed: () => + Navigator.pushNamed(context, Routes.newWalletFromWelcome), + image: newWalletImage, + text: S.of(context).create_new, + color: Theme.of(context) + .accentTextTheme! + .subtitle2! + .decorationColor!, + textColor: Theme.of(context) + .accentTextTheme! + .headline5! + .decorationColor!, + ), + ), + Padding( + padding: EdgeInsets.only(top: 10), + child: PrimaryImageButton( + onPressed: () { + Navigator.pushNamed(context, Routes.restoreOptions); + }, + image: restoreWalletImage, + text: S.of(context).restore_wallet, + color: Theme.of(context).accentTextTheme!.caption!.color!, + textColor: + Theme.of(context).primaryTextTheme!.headline6!.color!), + ) + ], + ) + ], + )) ], - ) - ) - ], - ) - )); + ), + ), + ))); } } diff --git a/lib/src/widgets/market_place_item.dart b/lib/src/widgets/market_place_item.dart index 8049a6346..438391c97 100644 --- a/lib/src/widgets/market_place_item.dart +++ b/lib/src/widgets/market_place_item.dart @@ -17,6 +17,9 @@ class MarketPlaceItem extends StatelessWidget { Widget build(BuildContext context) { return InkWell( onTap: onTap, + hoverColor: Colors.transparent, + splashColor: Colors.transparent, + highlightColor: Colors.transparent, child: Stack( children: [ Container( diff --git a/lib/src/widgets/nav_bar.dart b/lib/src/widgets/nav_bar.dart index 657031bfa..fcea49656 100644 --- a/lib/src/widgets/nav_bar.dart +++ b/lib/src/widgets/nav_bar.dart @@ -74,7 +74,7 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget { children: [ if (leading != null) Flexible(child: leading!), if (middle != null) middle!, - if (trailing != null) trailing!, + trailing ?? const SizedBox(), ], ), ), diff --git a/lib/utils/responsive_layout_util.dart b/lib/utils/responsive_layout_util.dart index c1e59722c..d685b40d2 100644 --- a/lib/utils/responsive_layout_util.dart +++ b/lib/utils/responsive_layout_util.dart @@ -2,6 +2,7 @@ import 'package:flutter/material.dart'; class ResponsiveLayoutUtil { static const double _kMobileThreshold = 900; + static const double kDesktopMaxWidthConstraint = 400; const ResponsiveLayoutUtil._();