mirror of
https://github.com/cake-tech/cake_wallet.git
synced 2024-12-22 19:49:22 +00:00
Add Info Alert Dialog to show payment confirmation popup
Change CakePhone pages title colors Change CakePhone popups title colors
This commit is contained in:
parent
592a8a2e0d
commit
7cb6e1b193
15 changed files with 156 additions and 23 deletions
|
@ -49,6 +49,7 @@ class Palette {
|
|||
static const Color manatee = Color.fromRGBO(153, 161, 176, 1.0);
|
||||
static const Color stateGray = Color.fromRGBO(68, 74, 89, 1.0);
|
||||
static const Color frostySky = Color.fromRGBO(0, 184, 250, 1.0);
|
||||
static const Color darkShade = Color.fromRGBO(50, 50, 50, 1.0);
|
||||
}
|
||||
|
||||
class PaletteDark {
|
||||
|
|
|
@ -23,7 +23,7 @@ class CakePhoneAuthPage extends BasePage {
|
|||
fontSize: 22,
|
||||
fontWeight: FontWeight.w700,
|
||||
fontFamily: 'Lato',
|
||||
color: Theme.of(context).primaryTextTheme.title.color),
|
||||
color: Theme.of(context).primaryTextTheme.title.decorationColor),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -18,7 +18,7 @@ class CakePhoneProductsPage extends BasePage {
|
|||
fontSize: 22,
|
||||
fontWeight: FontWeight.w700,
|
||||
fontFamily: 'Lato',
|
||||
color: Theme.of(context).primaryTextTheme.title.color),
|
||||
color: Theme.of(context).primaryTextTheme.title.decorationColor),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -23,7 +23,7 @@ class CakePhoneVerificationPage extends BasePage {
|
|||
fontSize: 22,
|
||||
fontWeight: FontWeight.w700,
|
||||
fontFamily: 'Lato',
|
||||
color: Theme.of(context).primaryTextTheme.title.color),
|
||||
color: Theme.of(context).primaryTextTheme.title.decorationColor),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -20,8 +20,7 @@ class CakePhoneWelcomePage extends BasePage {
|
|||
fontSize: 22,
|
||||
fontWeight: FontWeight.w700,
|
||||
fontFamily: 'Lato',
|
||||
color: titleColor ??
|
||||
Theme.of(context).primaryTextTheme.title.color),
|
||||
color: Theme.of(context).primaryTextTheme.title.decorationColor),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -32,7 +32,7 @@ class AutoRenewSettingsPage extends BasePage {
|
|||
fontSize: 22,
|
||||
fontWeight: FontWeight.w700,
|
||||
fontFamily: 'Lato',
|
||||
color: Theme.of(context).primaryTextTheme.title.color),
|
||||
color: Theme.of(context).primaryTextTheme.title.decorationColor),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -64,7 +64,7 @@ class AutoRenewSettingsBodyState extends State<AutoRenewSettingsBody> {
|
|||
style: TextStyle(
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: Theme.of(context).primaryTextTheme.title.color,
|
||||
color: Theme.of(context).primaryTextTheme.title.decorationColor,
|
||||
fontFamily: 'Lato',
|
||||
),
|
||||
),
|
||||
|
|
|
@ -26,7 +26,7 @@ class NumberSettingsPage extends BasePage {
|
|||
fontSize: 22,
|
||||
fontWeight: FontWeight.w700,
|
||||
fontFamily: 'Lato',
|
||||
color: titleColor ?? Theme.of(context).primaryTextTheme.title.color),
|
||||
color: Theme.of(context).primaryTextTheme.title.decorationColor),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -7,6 +7,7 @@ import 'package:cake_wallet/routes.dart';
|
|||
import 'package:cake_wallet/src/screens/cake_phone/widgets/cake_phone_settings_tile.dart';
|
||||
import 'package:cake_wallet/src/screens/cake_phone/widgets/plan_card.dart';
|
||||
import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart';
|
||||
import 'package:cake_wallet/src/widgets/info_alert_dialog.dart';
|
||||
import 'package:cake_wallet/src/widgets/picker.dart';
|
||||
import 'package:cake_wallet/store/app_store.dart';
|
||||
import 'package:cake_wallet/utils/show_pop_up.dart';
|
||||
|
@ -40,7 +41,7 @@ class PhoneNumberProductPage extends BasePage {
|
|||
fontSize: 22,
|
||||
fontWeight: FontWeight.w700,
|
||||
fontFamily: 'Lato',
|
||||
color: Theme.of(context).primaryTextTheme.title.color),
|
||||
color: Theme.of(context).primaryTextTheme.title.decorationColor),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -73,7 +74,7 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
|
|||
style: TextStyle(
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: Theme.of(context).primaryTextTheme.title.color,
|
||||
color: Theme.of(context).primaryTextTheme.title.decorationColor,
|
||||
fontFamily: 'Lato',
|
||||
),
|
||||
),
|
||||
|
@ -312,6 +313,7 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
|
|||
builder: (dialogContext) {
|
||||
return AlertWithTwoActions(
|
||||
alertTitle: S.of(context).confirm_payment,
|
||||
alertTitleColor: Theme.of(context).primaryTextTheme.title.decorationColor,
|
||||
alertContent: S.of(context).confirm_delete_template,
|
||||
contentWidget: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
|
@ -348,6 +350,7 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
|
|||
builder: (dialogContext) {
|
||||
return AlertWithTwoActions(
|
||||
alertTitle: S.of(context).confirm_sending,
|
||||
alertTitleColor: Theme.of(context).primaryTextTheme.title.decorationColor,
|
||||
alertContent: S.of(context).confirm_delete_template,
|
||||
contentWidget: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
|
@ -373,12 +376,13 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
|
|||
),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Text( //TODO: remove static address if it will be generated everytime
|
||||
Text(
|
||||
//TODO: remove static address if it will be generated everytime
|
||||
"4B6c5ApfayzRN8jYxXyprv9me1vttSjF21WAz4HQ8JvS13RgRbgfQg7PPgvm2QMA8N1ed7izqPFsnCKGWWwFoGyjTFstzXm",
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Theme.of(context).primaryTextTheme.title.color,
|
||||
color: Theme.of(context).accentTextTheme.subhead.color,
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
|
@ -510,10 +514,87 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
|
|||
}
|
||||
|
||||
void showPaymentConfirmationPopup() {
|
||||
// showPopUp<void>(
|
||||
// context: context,
|
||||
// builder: (dialogContext) {
|
||||
//
|
||||
// });
|
||||
showPopUp<void>(
|
||||
context: context,
|
||||
builder: (dialogContext) {
|
||||
return InfoAlertDialog(
|
||||
alertTitle: S.of(context).awaiting_payment_confirmation,
|
||||
alertTitleColor: Theme.of(context).primaryTextTheme.title.decorationColor,
|
||||
alertContentPadding: EdgeInsets.zero,
|
||||
alertContent: Padding(
|
||||
padding: const EdgeInsets.only(top: 8, bottom: 32),
|
||||
child: Column(
|
||||
children: [
|
||||
Padding(
|
||||
padding: EdgeInsets.symmetric(horizontal: 24),
|
||||
child: Text(
|
||||
S.of(context).transaction_sent_popup_info,
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: Theme.of(context).primaryTextTheme.title.color,
|
||||
),
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: EdgeInsets.symmetric(vertical: 24),
|
||||
child: Container(
|
||||
height: 1,
|
||||
color: Theme.of(context).dividerColor,
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: EdgeInsets.symmetric(horizontal: 24),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
"${S.of(context).transaction_details_transaction_id}:",
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: Theme.of(context).accentTextTheme.subhead.color,
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(top: 4, bottom: 16),
|
||||
child: Text(
|
||||
// TODO: Replace with the transaction id
|
||||
"dsyf5ind7akwryewkmf5nf4eakdrm4infd4i8rm4fd8nrmsein",
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: Theme.of(context).primaryTextTheme.title.color,
|
||||
),
|
||||
),
|
||||
),
|
||||
Text(
|
||||
"${S.of(context).view_in_block_explorer}:",
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: Theme.of(context).accentTextTheme.subhead.color,
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(top: 4),
|
||||
child: Text(
|
||||
// TODO: get it from transaction details view model
|
||||
S.of(context).view_transaction_on,
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: Theme.of(context).primaryTextTheme.title.color,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -15,6 +15,7 @@ class AlertWithTwoActions extends BaseAlertDialog {
|
|||
this.contentWidget,
|
||||
this.leftActionButtonColor,
|
||||
this.rightActionButtonColor,
|
||||
this.alertTitleColor,
|
||||
}) : assert(alertContent != null || contentWidget != null);
|
||||
|
||||
final String alertTitle;
|
||||
|
@ -24,6 +25,7 @@ class AlertWithTwoActions extends BaseAlertDialog {
|
|||
final VoidCallback actionLeftButton;
|
||||
final VoidCallback actionRightButton;
|
||||
final bool alertBarrierDismissible;
|
||||
final Color alertTitleColor;
|
||||
|
||||
@override
|
||||
String get titleText => alertTitle;
|
||||
|
@ -47,4 +49,6 @@ class AlertWithTwoActions extends BaseAlertDialog {
|
|||
final Color leftActionButtonColor;
|
||||
@override
|
||||
final Color rightActionButtonColor;
|
||||
@override
|
||||
Color get titleColor => alertTitleColor;
|
||||
}
|
|
@ -12,8 +12,10 @@ class BaseAlertDialog extends StatelessWidget {
|
|||
VoidCallback get actionRight => () {};
|
||||
bool get barrierDismissible => true;
|
||||
Widget get contentWidget => null;
|
||||
EdgeInsets get contentPadding => null;
|
||||
Color get leftActionButtonColor => null;
|
||||
Color get rightActionButtonColor => null;
|
||||
Color get titleColor => null;
|
||||
|
||||
Widget title(BuildContext context) {
|
||||
return Text(
|
||||
|
@ -23,7 +25,7 @@ class BaseAlertDialog extends StatelessWidget {
|
|||
fontSize: 20,
|
||||
fontFamily: 'Lato',
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Theme.of(context).primaryTextTheme.title.color,
|
||||
color: titleColor ?? Theme.of(context).primaryTextTheme.title.color,
|
||||
decoration: TextDecoration.none,
|
||||
),
|
||||
);
|
||||
|
@ -151,7 +153,7 @@ class BaseAlertDialog extends StatelessWidget {
|
|||
)
|
||||
: Offstage(),
|
||||
Padding(
|
||||
padding: EdgeInsets.fromLTRB(24, 8, 24, 32),
|
||||
padding: contentPadding ?? EdgeInsets.fromLTRB(24, 8, 24, 32),
|
||||
child: content(context),
|
||||
)
|
||||
],
|
||||
|
|
41
lib/src/widgets/info_alert_dialog.dart
Normal file
41
lib/src/widgets/info_alert_dialog.dart
Normal file
|
@ -0,0 +1,41 @@
|
|||
import 'package:flutter/material.dart';
|
||||
import 'package:cake_wallet/src/widgets/base_alert_dialog.dart';
|
||||
|
||||
class InfoAlertDialog extends BaseAlertDialog {
|
||||
InfoAlertDialog({
|
||||
@required this.alertTitle,
|
||||
@required this.alertContent,
|
||||
this.alertTitleColor,
|
||||
this.alertContentPadding,
|
||||
this.alertBarrierDismissible = true
|
||||
});
|
||||
|
||||
final String alertTitle;
|
||||
final Color alertTitleColor;
|
||||
final Widget alertContent;
|
||||
final EdgeInsets alertContentPadding;
|
||||
final bool alertBarrierDismissible;
|
||||
|
||||
@override
|
||||
String get titleText => alertTitle;
|
||||
|
||||
@override
|
||||
Widget get contentWidget => alertContent;
|
||||
|
||||
@override
|
||||
bool get barrierDismissible => alertBarrierDismissible;
|
||||
|
||||
@override
|
||||
bool get isDividerExists => true;
|
||||
|
||||
@override
|
||||
Color get titleColor => alertTitleColor;
|
||||
|
||||
@override
|
||||
EdgeInsets get contentPadding => alertContentPadding;
|
||||
|
||||
@override
|
||||
Widget actionButtons(BuildContext context) {
|
||||
return const SizedBox();
|
||||
}
|
||||
}
|
|
@ -89,7 +89,8 @@ class BrightTheme extends ThemeBase {
|
|||
primaryTextTheme: TextTheme(
|
||||
title: TextStyle(
|
||||
color: Palette.darkBlueCraiola, // title color
|
||||
backgroundColor: Palette.wildPeriwinkle // textfield underline
|
||||
backgroundColor: Palette.wildPeriwinkle, // textfield underline
|
||||
decorationColor: Palette.darkShade // cake phone title color
|
||||
),
|
||||
caption: TextStyle(
|
||||
color: PaletteDark.pigeonBlue, // secondary text
|
||||
|
|
|
@ -88,7 +88,8 @@ class DarkTheme extends ThemeBase {
|
|||
primaryTextTheme: TextTheme(
|
||||
title: TextStyle(
|
||||
color: Colors.white, // title color
|
||||
backgroundColor: PaletteDark.darkOceanBlue // textfield underline
|
||||
backgroundColor: PaletteDark.darkOceanBlue, // textfield underline
|
||||
decorationColor: Colors.white // cake phone title color
|
||||
),
|
||||
caption: TextStyle(
|
||||
color: PaletteDark.darkCyanBlue, // secondary text
|
||||
|
|
|
@ -89,7 +89,8 @@ class LightTheme extends ThemeBase {
|
|||
primaryTextTheme: TextTheme(
|
||||
title: TextStyle(
|
||||
color: Palette.darkBlueCraiola, // title color
|
||||
backgroundColor: Palette.wildPeriwinkle // textfield underline
|
||||
backgroundColor: Palette.wildPeriwinkle, // textfield underline
|
||||
decorationColor: Palette.darkBlueCraiola // cake phone title color
|
||||
),
|
||||
caption: TextStyle(
|
||||
color: PaletteDark.pigeonBlue, // secondary text
|
||||
|
|
|
@ -589,5 +589,7 @@
|
|||
"term": "Term",
|
||||
"disable": "Disable",
|
||||
"update": "Update",
|
||||
"auto_renew_term_description": "Optionally auto-renew your phone number if a sufficient balance is available. We will attempt to pay the balance a day before the service is set to expire."
|
||||
"auto_renew_term_description": "Optionally auto-renew your phone number if a sufficient balance is available. We will attempt to pay the balance a day before the service is set to expire.",
|
||||
"awaiting_payment_confirmation": "Awaiting Payment Confirmation",
|
||||
"transaction_sent_popup_info": "Your transaction was sent. \n\nIf the screen doesn’t proceed after 1 minute, check a block explorer and your email."
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue