diff --git a/lib/src/screens/send/send_page.dart b/lib/src/screens/send/send_page.dart index 1a18b5ba6..2ca9372a5 100644 --- a/lib/src/screens/send/send_page.dart +++ b/lib/src/screens/send/send_page.dart @@ -313,6 +313,7 @@ class SendPage extends BasePage { child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( S @@ -326,23 +327,50 @@ class SendPage extends BasePage { color: Colors.white)), Container( child: Row( + crossAxisAlignment: CrossAxisAlignment.start, children: [ - Text( - sendViewModel + Column( + mainAxisAlignment: MainAxisAlignment.start, + crossAxisAlignment: CrossAxisAlignment.end, + children: [ + Text( + sendViewModel .estimatedFee .toString() + - ' ' + - sendViewModel + ' ' + + sendViewModel .currency.title, - style: TextStyle( - fontSize: 12, - fontWeight: + style: TextStyle( + fontSize: 12, + fontWeight: FontWeight.w600, - //color: Theme.of(context).primaryTextTheme.display2.color, - color: + //color: Theme.of(context).primaryTextTheme.display2.color, + color: Colors.white)), + Padding( + padding: + EdgeInsets.only(top: 5), + child: Text( + sendViewModel + .estimatedFeeFiatAmount + + ' ' + + sendViewModel + .fiat.title, + style: TextStyle( + fontSize: 12, + fontWeight: + FontWeight.w600, + color: Theme + .of(context) + .primaryTextTheme + .headline + .decorationColor)) + ), + ], + ), Padding( padding: EdgeInsets.only( + top: 2, left: 5), child: Icon( Icons.arrow_forward_ios, @@ -596,8 +624,14 @@ class SendPage extends BasePage { amount: S.of(context).send_amount, amountValue: sendViewModel.pendingTransaction.amountFormatted, + fiatAmountValue: sendViewModel.pendingTransactionFiatAmount + + ' ' + sendViewModel.fiat.title, fee: S.of(context).send_fee, feeValue: sendViewModel.pendingTransaction.feeFormatted, + transactionPriority: sendViewModel + .transactionPriority.toString(), + recipientTitle: 'Recipient address', + recipientAddress: sendViewModel.address, rightButtonText: S.of(context).ok, leftButtonText: S.of(context).cancel, actionRightButton: () { @@ -614,96 +648,17 @@ class SendPage extends BasePage { } if (state is TransactionCommitted) { - return Stack( - children: [ - Container( - color: Theme.of(context).backgroundColor, - child: Center( - child: Image.asset( - 'assets/images/birthday_cake.png'), - ), - ), - Center( - child: Padding( - padding: EdgeInsets.only( - top: 220, left: 24, right: 24), - child: Text( - S.of(context).send_success( - sendViewModel.currency - .toString()), - textAlign: TextAlign.center, - style: TextStyle( - fontSize: 22, - fontWeight: FontWeight.bold, - color: Theme.of(context) - .primaryTextTheme - .title - .color, - decoration: TextDecoration.none, - ), - ), - ), - ), - Positioned( - left: 24, - right: 24, - bottom: 24, - child: PrimaryButton( - onPressed: () => - Navigator.of(context).pop(), - text: S.of(context).send_got_it, - color: Theme.of(context) - .accentTextTheme - .body2 - .color, - textColor: Colors.white)) - ], - ); + return AlertWithOneAction( + alertTitle: '', + alertContent: S.of(context).send_success( + sendViewModel.currency + .toString()), + buttonText: S.of(context).ok, + buttonAction: () => + Navigator.of(context).pop()); } - if (state is TransactionCommitting) { - return Stack( - children: [ - Container( - color: Theme.of(context).backgroundColor, - child: Center( - child: Image.asset( - 'assets/images/birthday_cake.png'), - ), - ), - BackdropFilter( - filter: ImageFilter.blur( - sigmaX: 3.0, sigmaY: 3.0), - child: Container( - decoration: BoxDecoration( - color: Theme.of(context) - .backgroundColor - .withOpacity(0.25)), - child: Center( - child: Padding( - padding: EdgeInsets.only(top: 220), - child: Text( - S.of(context).send_sending, - textAlign: TextAlign.center, - style: TextStyle( - fontSize: 22, - fontWeight: FontWeight.bold, - color: Theme.of(context) - .primaryTextTheme - .title - .color, - decoration: TextDecoration.none, - ), - ), - ), - ), - ), - ) - ], - ); - } - - return Container(); + return Offstage(); }); }); }, diff --git a/lib/src/screens/send/widgets/confirm_sending_alert.dart b/lib/src/screens/send/widgets/confirm_sending_alert.dart index 07976ce12..3d0c8bf0a 100644 --- a/lib/src/screens/send/widgets/confirm_sending_alert.dart +++ b/lib/src/screens/send/widgets/confirm_sending_alert.dart @@ -1,3 +1,4 @@ +import 'package:cake_wallet/palette.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/src/widgets/base_alert_dialog.dart'; @@ -6,8 +7,12 @@ class ConfirmSendingAlert extends BaseAlertDialog { @required this.alertTitle, @required this.amount, @required this.amountValue, + @required this.fiatAmountValue, @required this.fee, @required this.feeValue, + @required this.transactionPriority, + @required this.recipientTitle, + @required this.recipientAddress, @required this.leftButtonText, @required this.rightButtonText, @required this.actionLeftButton, @@ -18,8 +23,12 @@ class ConfirmSendingAlert extends BaseAlertDialog { final String alertTitle; final String amount; final String amountValue; + final String fiatAmountValue; final String fee; final String feeValue; + final String transactionPriority; + final String recipientTitle; + final String recipientAddress; final String leftButtonText; final String rightButtonText; final VoidCallback actionLeftButton; @@ -29,74 +38,145 @@ class ConfirmSendingAlert extends BaseAlertDialog { @override String get titleText => alertTitle; + @override + bool get isDividerExists => true; + @override String get leftActionButtonText => leftButtonText; + @override String get rightActionButtonText => rightButtonText; + @override VoidCallback get actionLeft => actionLeftButton; + @override VoidCallback get actionRight => actionRightButton; + @override bool get barrierDismissible => alertBarrierDismissible; @override Widget content(BuildContext context) { return Column( - mainAxisSize: MainAxisSize.max, - mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Row( mainAxisSize: MainAxisSize.max, mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( amount, style: TextStyle( fontSize: 16, - fontWeight: FontWeight.w600, + fontWeight: FontWeight.normal, fontFamily: 'Lato', color: Theme.of(context).primaryTextTheme.title.color, decoration: TextDecoration.none, ), ), - Text( - amountValue, - style: TextStyle( - fontSize: 16, - fontWeight: FontWeight.w600, - fontFamily: 'Lato', - color: Theme.of(context).primaryTextTheme.title.color, - decoration: TextDecoration.none, - ), + Column( + crossAxisAlignment: CrossAxisAlignment.end, + children: [ + Text( + amountValue, + style: TextStyle( + fontSize: 18, + fontWeight: FontWeight.w600, + fontFamily: 'Lato', + color: Theme.of(context).primaryTextTheme.title.color, + decoration: TextDecoration.none, + ), + ), + Text( + fiatAmountValue, + style: TextStyle( + fontSize: 12, + fontWeight: FontWeight.w600, + fontFamily: 'Lato', + color: PaletteDark.pigeonBlue, + decoration: TextDecoration.none, + ), + ) + ], ) ], ), - Row( - mainAxisSize: MainAxisSize.max, - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Text( - fee, - style: TextStyle( - fontSize: 16, - fontWeight: FontWeight.w600, - fontFamily: 'Lato', - color: Theme.of(context).primaryTextTheme.title.color, - decoration: TextDecoration.none, + Padding( + padding: EdgeInsets.only(top: 16), + child: Row( + mainAxisSize: MainAxisSize.max, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + fee, + style: TextStyle( + fontSize: 16, + fontWeight: FontWeight.normal, + fontFamily: 'Lato', + color: Theme.of(context).primaryTextTheme.title.color, + decoration: TextDecoration.none, + ), ), - ), - Text( - feeValue, - style: TextStyle( - fontSize: 16, - fontWeight: FontWeight.w600, - fontFamily: 'Lato', - color: Theme.of(context).primaryTextTheme.title.color, - decoration: TextDecoration.none, + Column( + crossAxisAlignment: CrossAxisAlignment.end, + children: [ + Text( + feeValue, + style: TextStyle( + fontSize: 18, + fontWeight: FontWeight.w600, + fontFamily: 'Lato', + color: Theme.of(context).primaryTextTheme.title.color, + decoration: TextDecoration.none, + ), + ), + Text( + transactionPriority, + style: TextStyle( + fontSize: 12, + fontWeight: FontWeight.w600, + fontFamily: 'Lato', + color: PaletteDark.pigeonBlue, + decoration: TextDecoration.none, + ), + ) + ], + ) + ], + ) + ), + Padding( + padding: EdgeInsets.fromLTRB(8, 16, 8, 0), + child: Column( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + Text( + recipientTitle, + style: TextStyle( + fontSize: 16, + fontWeight: FontWeight.normal, + fontFamily: 'Lato', + color: Theme.of(context).primaryTextTheme.title.color, + decoration: TextDecoration.none, + ), ), - ) - ], + Padding( + padding: EdgeInsets.only(top: 8), + child: Text( + recipientAddress, + style: TextStyle( + fontSize: 12, + fontWeight: FontWeight.w600, + fontFamily: 'Lato', + color: PaletteDark.pigeonBlue, + decoration: TextDecoration.none, + ), + ) + ) + ], + ), ) ], ); diff --git a/lib/src/widgets/base_alert_dialog.dart b/lib/src/widgets/base_alert_dialog.dart index 19c00ca43..b51eb0d69 100644 --- a/lib/src/widgets/base_alert_dialog.dart +++ b/lib/src/widgets/base_alert_dialog.dart @@ -7,6 +7,7 @@ class BaseAlertDialog extends StatelessWidget { String get contentText => ''; String get leftActionButtonText => ''; String get rightActionButtonText => ''; + bool get isDividerExists => false; VoidCallback get actionLeft => () {}; VoidCallback get actionRight => () {}; bool get barrierDismissible => true; @@ -127,18 +128,24 @@ class BaseAlertDialog extends StatelessWidget { child: Column( mainAxisSize: MainAxisSize.min, children: [ - Container( - padding: EdgeInsets.fromLTRB(24, 32, 24, 32), - child: Column( - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - title(context), - Padding( - padding: EdgeInsets.only(top: 8), - child: content(context), - ) - ], - ), + Column( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + Padding( + padding: EdgeInsets.fromLTRB(24, 32, 24, 16), + child: title(context), + ), + isDividerExists + ? Container( + height: 1, + color: Theme.of(context).dividerColor, + ) + : Offstage(), + Padding( + padding: EdgeInsets.fromLTRB(24, 16, 24, 32), + child: content(context), + ) + ], ), Container( height: 1, diff --git a/lib/view_model/send/send_view_model.dart b/lib/view_model/send/send_view_model.dart index f3d46ccb3..363c42d17 100644 --- a/lib/view_model/send/send_view_model.dart +++ b/lib/view_model/send/send_view_model.dart @@ -1,4 +1,5 @@ import 'package:cake_wallet/entities/balance_display_mode.dart'; +import 'package:cake_wallet/entities/calculate_fiat_amount_raw.dart'; import 'package:cake_wallet/entities/transaction_description.dart'; import 'package:hive/hive.dart'; import 'package:intl/intl.dart'; @@ -60,6 +61,34 @@ abstract class SendViewModelBase with Store { double get estimatedFee => _wallet.calculateEstimatedFee(_settingsStore.transactionPriority); + @computed + String get estimatedFeeFiatAmount { + try { + final fiat = calculateFiatAmountRaw( + price: _fiatConversationStore.prices[_wallet.currency], + cryptoAmount: estimatedFee); + return fiat; + } catch (_) { + return '0.00'; + } + } + + @computed + String get pendingTransactionFiatAmount { + try { + if (pendingTransaction != null) { + final fiat = calculateFiatAmount( + price: _fiatConversationStore.prices[_wallet.currency], + cryptoAmount: pendingTransaction.amountFormatted); + return fiat; + } else { + return '0.00'; + } + } catch (_) { + return '0.00'; + } + } + FiatCurrency get fiat => _settingsStore.fiatCurrency; TransactionPriority get transactionPriority =>