From 93b8bd8a3552c4cc54aa8e9483ce51d11414f4cf Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Tue, 14 Apr 2020 21:15:47 +0300 Subject: [PATCH 01/11] CWA-198 | created wallet card --- assets/images/2.0x/triangle.png | Bin 0 -> 202 bytes assets/images/3.0x/triangle.png | Bin 0 -> 242 bytes assets/images/triangle.png | Bin 0 -> 193 bytes lib/palette.dart | 9 + lib/src/screens/dashboard/dashboard_page.dart | 35 +++- .../dashboard/widgets/wallet_card.dart | 198 ++++++++++++++++++ 6 files changed, 236 insertions(+), 6 deletions(-) create mode 100644 assets/images/2.0x/triangle.png create mode 100644 assets/images/3.0x/triangle.png create mode 100644 assets/images/triangle.png create mode 100644 lib/src/screens/dashboard/widgets/wallet_card.dart diff --git a/assets/images/2.0x/triangle.png b/assets/images/2.0x/triangle.png new file mode 100644 index 0000000000000000000000000000000000000000..1a7baf26d5adefdb60b7134fd807e65eedc6ba7c GIT binary patch literal 202 zcmeAS@N?(olHy`uVBq!ia0vp^f*{Pn1|+R>-G2co&H|6fVg?2=RS;(M3{v?36l5$8 za(7}_cTVOdki(Mh=XR_&!bG7o(^V sLuf;{iGnzXAUjuM9^1<)(md9T$GFUP{$_}O3$%*C)78&qol`;+0J$bP0l+XkK8V^!6 literal 0 HcmV?d00001 diff --git a/assets/images/triangle.png b/assets/images/triangle.png new file mode 100644 index 0000000000000000000000000000000000000000..0c48a2465f6c29d22b3caa087ec1255cbd839954 GIT binary patch literal 193 zcmeAS@N?(olHy`uVBq!ia0vp^oFL4>1|%O$WD@{!3Opi<85p>QL70(Y)*K0-AY*Zm zyA#8@b22Z19F}xPUq=Rpjs4tz5?O)#Fi#i9kP61LJsWu&40u@n3NZ&f(&RIp null; @override Widget body(BuildContext context) => DashboardPageBody(key: _bodyKey); - @override + /*@override Widget floatingActionButton(BuildContext context) => FloatingActionButton( child: Image.asset('assets/images/exchange_icon.png', color: Colors.white, height: 26, width: 22), @@ -100,7 +103,7 @@ class DashboardPage extends BasePage { onItemSelected: (String item) => walletMenu.action(walletMenu.items.indexOf(item))), context: bodyContext); - } + }*/ } class DashboardPageBody extends StatefulWidget { @@ -120,7 +123,27 @@ class DashboardPageBodyState extends State { @override Widget build(BuildContext context) { - final balanceStore = Provider.of(context); + final List colors = [PaletteDark.backgroundStart, PaletteDark.backgroundEnd]; + + return SafeArea( + child: Container( + decoration: BoxDecoration( + gradient: LinearGradient( + colors: colors + ) + ), + child: Column( + children: [ + Padding( + padding: EdgeInsets.only(left: 20, top: 78), + child: WalletCard(), + ) + ], + ), + ), + ); + + /*final balanceStore = Provider.of(context); final actionListStore = Provider.of(context); final syncStore = Provider.of(context); final settingsStore = Provider.of(context); @@ -593,6 +616,6 @@ class DashboardPageBodyState extends State { return Container(); }); - }); + });*/ } } diff --git a/lib/src/screens/dashboard/widgets/wallet_card.dart b/lib/src/screens/dashboard/widgets/wallet_card.dart new file mode 100644 index 000000000..0bf8ae34d --- /dev/null +++ b/lib/src/screens/dashboard/widgets/wallet_card.dart @@ -0,0 +1,198 @@ +import 'package:cake_wallet/src/stores/sync/sync_store.dart'; +import 'package:cake_wallet/src/stores/wallet/wallet_store.dart'; +import 'package:flutter/cupertino.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_mobx/flutter_mobx.dart'; +import 'package:cake_wallet/palette.dart'; +import 'package:provider/provider.dart'; +import 'package:cake_wallet/generated/i18n.dart'; +import 'package:cake_wallet/src/domain/common/sync_status.dart'; + +class WalletCard extends StatefulWidget { + @override + WalletCardState createState() => WalletCardState(); +} + +class WalletCardState extends State { + final _syncingObserverKey = GlobalKey(); + final triangleButton = Image.asset('assets/images/triangle.png'); + + final List colorsSync = [PaletteDark.walletCardTopEndSync, PaletteDark.walletCardBottomEndSync]; + double cardWidth; + double screenWidth; + double opacity; + + @override + void initState() { + cardWidth = 0; + screenWidth = 0; + opacity = 0; + super.initState(); + WidgetsBinding.instance.addPostFrameCallback(afterLayout); + } + + void afterLayout(dynamic _) { + screenWidth = MediaQuery.of(context).size.width; + setState(() { + cardWidth = screenWidth; + opacity = 1; + }); + } + + @override + Widget build(BuildContext context) { + final syncStore = Provider.of(context); + final walletStore = Provider.of(context); + + return Container( + width: double.infinity, + height: 220, + alignment: Alignment.centerRight, + child: AnimatedContainer( + alignment: Alignment.centerLeft, + width: cardWidth, + height: 220, + duration: Duration(milliseconds: 500), + curve: Curves.fastOutSlowIn, + decoration: BoxDecoration( + borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)), + gradient: LinearGradient( + colors: [PaletteDark.walletCardTopStartSync.withOpacity(opacity), + PaletteDark.walletCardBottomStartSync.withOpacity(opacity)], + begin: Alignment.topCenter, + end: Alignment.bottomCenter + ) + ), + child: screenWidth > 0 && cardWidth == screenWidth + ? InkWell( + onTap: (){print('TAP');}, + child: Observer( + key: _syncingObserverKey, + builder: (_) { + final status = syncStore.status; + final statusText = status.title(); + final progress = syncStore.status.progress(); + //final isFialure = status is FailedSyncStatus; + + var descriptionText = ''; + + if (status is SyncingSyncStatus) { + descriptionText = S + .of(context) + .Blocks_remaining( + syncStore.status.toString()); + } + + if (status is FailedSyncStatus) { + descriptionText = S + .of(context) + .please_try_to_connect_to_another_node; + } + + return Container( + width: cardWidth, + height: 220, + child: Stack( + children: [ + Container( + height: 220, + width: progress * cardWidth, + decoration: BoxDecoration( + borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)), + gradient: LinearGradient( + colors: colorsSync, + begin: Alignment.topCenter, + end: Alignment.bottomCenter + ) + ), + ), + Positioned( + left: 20, + right: 20, + top: 30, + bottom: 30, + child: Container( + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + InkWell( + onTap: (){print('TAP 2');}, + child: Row( + children: [ + Text( + walletStore.name, + style: TextStyle( + fontSize: 20, + fontWeight: FontWeight.bold + ), + ), + SizedBox(width: 10), + triangleButton + ], + ), + ), + SizedBox( + height: 5, + ), + Text( + walletStore.account.label, + style: TextStyle( + fontSize: 12 + ), + ) + ], + ), + Text( + walletStore.account.label + ) + ], + ), + Row( + crossAxisAlignment: CrossAxisAlignment.end, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + statusText, + style: TextStyle( + fontSize: 12 + ), + ), + SizedBox(height: 5), + Text( + descriptionText, + style: TextStyle( + fontSize: 14 + ), + ) + ], + ), + Text( + walletStore.account.label + ) + ], + ) + ], + ), + ) + ) + ], + ), + ); + }, + ) + ) + : Offstage(), + ), + ); + } +} \ No newline at end of file From fc8c632e21016b47e8a98eb331493f83b705f162 Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Wed, 15 Apr 2020 19:33:41 +0300 Subject: [PATCH 02/11] CWA-198 | created front and back sides of wallet card --- assets/images/2.0x/right_arrow.png | Bin 0 -> 244 bytes assets/images/3.0x/right_arrow.png | Bin 0 -> 268 bytes assets/images/right_arrow.png | Bin 0 -> 186 bytes lib/generated/i18n.dart | 23 + lib/palette.dart | 4 + lib/src/screens/dashboard/dashboard_page.dart | 4 +- .../dashboard/widgets/wallet_card.dart | 434 ++++++++++++++---- res/values/strings_de.arb | 4 +- res/values/strings_en.arb | 4 +- res/values/strings_es.arb | 4 +- res/values/strings_hi.arb | 4 +- res/values/strings_ja.arb | 4 +- res/values/strings_ko.arb | 4 +- res/values/strings_nl.arb | 4 +- res/values/strings_pl.arb | 4 +- res/values/strings_pt.arb | 4 +- res/values/strings_ru.arb | 4 +- res/values/strings_uk.arb | 4 +- res/values/strings_zh.arb | 4 +- 19 files changed, 398 insertions(+), 115 deletions(-) create mode 100644 assets/images/2.0x/right_arrow.png create mode 100644 assets/images/3.0x/right_arrow.png create mode 100644 assets/images/right_arrow.png diff --git a/assets/images/2.0x/right_arrow.png b/assets/images/2.0x/right_arrow.png new file mode 100644 index 0000000000000000000000000000000000000000..279cf0ccfb40540f0edfc308ced0511d5545e403 GIT binary patch literal 244 zcmeAS@N?(olHy`uVBq!ia0vp^5+KaM1|%Pp+x`GjoCO|{#S9E$svykh8Km+7D9BhG zcl<_0KkqT+pkp3<#>K6H4vP)b7S1?u=Tm31R~IKw z`o2e^lP209&W&{nzB2p3n#byTtxE*9PAI!S`A>6sK<%QGfA+zopr06*MRvj6}9 literal 0 HcmV?d00001 diff --git a/assets/images/3.0x/right_arrow.png b/assets/images/3.0x/right_arrow.png new file mode 100644 index 0000000000000000000000000000000000000000..35eb86002bcea167d8c4e933dbf98c08f67e53e5 GIT binary patch literal 268 zcmeAS@N?(olHy`uVBq!ia0vp^%0R5d!3HF+wkG@mQk(@Ik;M!QiWVTu=sL|X0Vv2= z9OUlAuxebtp7(RIy2^gy%I(+p$haI`Z-3a-Tb*dzfD7P4k_^ zob-rYtwq3z<0r@E*$pZ_28^B(!N;T1nKm&Woy{@7Y~^I}n+(6TSZ;;C)DQ$Zmci52 K&t;ucLK6V=G*?&v literal 0 HcmV?d00001 diff --git a/assets/images/right_arrow.png b/assets/images/right_arrow.png new file mode 100644 index 0000000000000000000000000000000000000000..8864a49f81d86ebb097a4625a186605d7de25a89 GIT binary patch literal 186 zcmeAS@N?(olHy`uVBq!ia0vp^JRr=$1|-8uW1a&k&H|6fVg?3oVGw3ym^DWND9BhG zZF653?fFeZohJCe<>OFGPZ*8di&## ca$)P4|LJz}1awCJ0vgTW>FVdQ&MBb@0I?%EW&i*H literal 0 HcmV?d00001 diff --git a/lib/generated/i18n.dart b/lib/generated/i18n.dart index 186ac1ddb..845145783 100644 --- a/lib/generated/i18n.dart +++ b/lib/generated/i18n.dart @@ -40,6 +40,7 @@ class S implements WidgetsLocalizations { String get available_balance => "Available Balance"; String get biometric_auth_reason => "Scan your fingerprint to authenticate"; String get cancel => "Cancel"; + String get card_address => "Address:"; String get change => "Change"; String get change_currency => "Change Currency"; String get change_exchange_provider => "Change Exchange Provider"; @@ -362,6 +363,8 @@ class $de extends S { @override String get wallet_list_create_new_wallet => "Neue Wallet erstellen"; @override + String get card_address => "Adresse:"; + @override String get seed_language_portuguese => "Portugiesisch"; @override String get setup_pin => "PIN einrichten"; @@ -930,6 +933,8 @@ class $hi extends S { @override String get wallet_list_create_new_wallet => "नया बटुआ बनाएँ"; @override + String get card_address => "पता:"; + @override String get seed_language_portuguese => "पुर्तगाली"; @override String get setup_pin => "पिन सेट करें"; @@ -1498,6 +1503,8 @@ class $ru extends S { @override String get wallet_list_create_new_wallet => "Создать новый кошелёк"; @override + String get card_address => "Адрес:"; + @override String get seed_language_portuguese => "Португальский"; @override String get setup_pin => "Настроить PIN"; @@ -2066,6 +2073,8 @@ class $ko extends S { @override String get wallet_list_create_new_wallet => "새 월렛 만들기"; @override + String get card_address => "주소:"; + @override String get seed_language_portuguese => "포르투갈 인"; @override String get setup_pin => "설정 PIN"; @@ -2634,6 +2643,8 @@ class $pt extends S { @override String get wallet_list_create_new_wallet => "Criar nova carteira"; @override + String get card_address => "Endereço:"; + @override String get seed_language_portuguese => "Português"; @override String get setup_pin => "Configurar PIN"; @@ -3202,6 +3213,8 @@ class $uk extends S { @override String get wallet_list_create_new_wallet => "Створити новий гаманець"; @override + String get card_address => "Адреса:"; + @override String get seed_language_portuguese => "Португальська"; @override String get setup_pin => "Встановити PIN"; @@ -3770,6 +3783,8 @@ class $ja extends S { @override String get wallet_list_create_new_wallet => "新しいウォレットを作成"; @override + String get card_address => "住所:"; + @override String get seed_language_portuguese => "ポルトガル語"; @override String get setup_pin => "PINのセットアップ"; @@ -4342,6 +4357,8 @@ class $pl extends S { @override String get wallet_list_create_new_wallet => "Utwórz nowy portfel"; @override + String get card_address => "Adres:"; + @override String get seed_language_portuguese => "Portugalski"; @override String get setup_pin => "Ustaw PIN"; @@ -4910,6 +4927,8 @@ class $es extends S { @override String get wallet_list_create_new_wallet => "Crear nueva billetera"; @override + String get card_address => "Dirección:"; + @override String get seed_language_portuguese => "Portugués"; @override String get setup_pin => "PIN de configuración"; @@ -5478,6 +5497,8 @@ class $nl extends S { @override String get wallet_list_create_new_wallet => "Maak een nieuwe portemonnee"; @override + String get card_address => "Adres:"; + @override String get seed_language_portuguese => "Portugees"; @override String get setup_pin => "PIN instellen"; @@ -6046,6 +6067,8 @@ class $zh extends S { @override String get wallet_list_create_new_wallet => "创建新钱包"; @override + String get card_address => "地址:"; + @override String get seed_language_portuguese => "葡萄牙語"; @override String get setup_pin => "设定PIN码"; diff --git a/lib/palette.dart b/lib/palette.dart index 382ddebff..06d889b16 100644 --- a/lib/palette.dart +++ b/lib/palette.dart @@ -78,4 +78,8 @@ class PaletteDark { static const Color walletCardBottomStartSync = Color.fromRGBO(70, 85, 133, 1.0); static const Color walletCardTopEndSync = Color.fromRGBO(70, 85, 133, 1.0); static const Color walletCardBottomEndSync = Color.fromRGBO(45, 56, 95, 1.0); + static const Color walletCardText = Color.fromRGBO(140, 153, 201, 1.0); + static const Color walletCardAddressField = Color.fromRGBO(51, 63, 104, 1.0); + static const Color walletCardAddressText = Color.fromRGBO(183, 197, 242, 1.0); + static const Color walletCardSubAddressField = Color.fromRGBO(63, 77, 122, 1.0); } \ No newline at end of file diff --git a/lib/src/screens/dashboard/dashboard_page.dart b/lib/src/screens/dashboard/dashboard_page.dart index 5fa659976..ab0185b8b 100644 --- a/lib/src/screens/dashboard/dashboard_page.dart +++ b/lib/src/screens/dashboard/dashboard_page.dart @@ -114,12 +114,12 @@ class DashboardPageBody extends StatefulWidget { } class DashboardPageBodyState extends State { - final _connectionStatusObserverKey = GlobalKey(); + /*final _connectionStatusObserverKey = GlobalKey(); final _balanceObserverKey = GlobalKey(); final _balanceTitleObserverKey = GlobalKey(); final _syncingObserverKey = GlobalKey(); final _listObserverKey = GlobalKey(); - final _listKey = GlobalKey(); + final _listKey = GlobalKey();*/ @override Widget build(BuildContext context) { diff --git a/lib/src/screens/dashboard/widgets/wallet_card.dart b/lib/src/screens/dashboard/widgets/wallet_card.dart index 0bf8ae34d..d086b9c53 100644 --- a/lib/src/screens/dashboard/widgets/wallet_card.dart +++ b/lib/src/screens/dashboard/widgets/wallet_card.dart @@ -1,12 +1,18 @@ +import 'dart:async'; +import 'package:cake_wallet/src/domain/common/balance_display_mode.dart'; +import 'package:flutter/services.dart'; +import 'package:provider/provider.dart'; +import 'package:cake_wallet/src/stores/balance/balance_store.dart'; +import 'package:cake_wallet/src/stores/settings/settings_store.dart'; import 'package:cake_wallet/src/stores/sync/sync_store.dart'; import 'package:cake_wallet/src/stores/wallet/wallet_store.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:flutter_mobx/flutter_mobx.dart'; import 'package:cake_wallet/palette.dart'; -import 'package:provider/provider.dart'; import 'package:cake_wallet/generated/i18n.dart'; import 'package:cake_wallet/src/domain/common/sync_status.dart'; +import 'package:cake_wallet/src/screens/receive/qr_image.dart'; class WalletCard extends StatefulWidget { @override @@ -15,18 +21,25 @@ class WalletCard extends StatefulWidget { class WalletCardState extends State { final _syncingObserverKey = GlobalKey(); - final triangleButton = Image.asset('assets/images/triangle.png'); + final _balanceObserverKey = GlobalKey(); + final _addressObserverKey = GlobalKey(); final List colorsSync = [PaletteDark.walletCardTopEndSync, PaletteDark.walletCardBottomEndSync]; double cardWidth; + double cardHeight; double screenWidth; double opacity; + bool isDraw; + bool isFrontSide; @override void initState() { cardWidth = 0; + cardHeight = 220; screenWidth = 0; opacity = 0; + isDraw = false; + isFrontSide = true; super.initState(); WidgetsBinding.instance.addPostFrameCallback(afterLayout); } @@ -37,21 +50,21 @@ class WalletCardState extends State { cardWidth = screenWidth; opacity = 1; }); + Timer(Duration(milliseconds: 350), () => + setState(() => isDraw = true) + ); } @override Widget build(BuildContext context) { - final syncStore = Provider.of(context); - final walletStore = Provider.of(context); - return Container( width: double.infinity, - height: 220, + height: cardHeight, alignment: Alignment.centerRight, child: AnimatedContainer( alignment: Alignment.centerLeft, width: cardWidth, - height: 220, + height: cardHeight, duration: Duration(milliseconds: 500), curve: Curves.fastOutSlowIn, decoration: BoxDecoration( @@ -63,98 +76,156 @@ class WalletCardState extends State { end: Alignment.bottomCenter ) ), - child: screenWidth > 0 && cardWidth == screenWidth - ? InkWell( - onTap: (){print('TAP');}, - child: Observer( - key: _syncingObserverKey, - builder: (_) { - final status = syncStore.status; - final statusText = status.title(); - final progress = syncStore.status.progress(); - //final isFialure = status is FailedSyncStatus; + child: InkWell( + onTap: () => setState(() => isFrontSide = !isFrontSide), + child: isFrontSide + ? frontSide() + : backSide() + ), + ), + ); + } - var descriptionText = ''; + Widget frontSide() { + final syncStore = Provider.of(context); + final walletStore = Provider.of(context); + final settingsStore = Provider.of(context); + final balanceStore = Provider.of(context); + final triangleButton = Image.asset('assets/images/triangle.png'); - if (status is SyncingSyncStatus) { - descriptionText = S - .of(context) - .Blocks_remaining( - syncStore.status.toString()); - } + return Observer( + key: _syncingObserverKey, + builder: (_) { + final status = syncStore.status; + final statusText = status.title(); + final progress = syncStore.status.progress(); - if (status is FailedSyncStatus) { - descriptionText = S - .of(context) - .please_try_to_connect_to_another_node; - } + String shortAddress = walletStore.subaddress.address; + shortAddress = shortAddress.replaceRange(4, shortAddress.length - 4, '...'); - return Container( - width: cardWidth, - height: 220, - child: Stack( - children: [ - Container( - height: 220, - width: progress * cardWidth, - decoration: BoxDecoration( - borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)), - gradient: LinearGradient( - colors: colorsSync, - begin: Alignment.topCenter, - end: Alignment.bottomCenter - ) - ), - ), - Positioned( - left: 20, - right: 20, - top: 30, - bottom: 30, - child: Container( - child: Column( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Row( - crossAxisAlignment: CrossAxisAlignment.start, - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Column( - crossAxisAlignment: CrossAxisAlignment.start, + var descriptionText = ''; + + if (status is SyncingSyncStatus) { + descriptionText = S + .of(context) + .Blocks_remaining( + syncStore.status.toString()); + } + + if (status is FailedSyncStatus) { + descriptionText = S + .of(context) + .please_try_to_connect_to_another_node; + } + + return Container( + width: cardWidth, + height: cardHeight, + child: Stack( + children: [ + Container( + height: cardHeight, + width: progress * cardWidth, + decoration: BoxDecoration( + borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)), + gradient: LinearGradient( + colors: colorsSync, + begin: Alignment.topCenter, + end: Alignment.bottomCenter + ) + ), + ), + isDraw ? Positioned( + left: 20, + right: 20, + top: 30, + bottom: 30, + child: Container( + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + InkWell( + onTap: () {print('TAP 2');}, + child: Row( children: [ - InkWell( - onTap: (){print('TAP 2');}, - child: Row( - children: [ - Text( - walletStore.name, - style: TextStyle( - fontSize: 20, - fontWeight: FontWeight.bold - ), - ), - SizedBox(width: 10), - triangleButton - ], - ), - ), - SizedBox( - height: 5, - ), Text( - walletStore.account.label, + walletStore.name, style: TextStyle( - fontSize: 12 + fontSize: 20, + fontWeight: FontWeight.bold ), - ) + ), + SizedBox(width: 10), + triangleButton ], ), - Text( - walletStore.account.label - ) - ], + ), + SizedBox( + height: 5, + ), + Text( + walletStore.account.label, + style: TextStyle( + fontSize: 12, + color: PaletteDark.walletCardText + ), + ) + ], + ), + Container( + width: 98, + height: 32, + alignment: Alignment.center, + decoration: BoxDecoration( + color: PaletteDark.walletCardAddressField, + borderRadius: BorderRadius.all(Radius.circular(16)) ), - Row( + child: Text( + shortAddress, + style: TextStyle( + fontSize: 12, + color: PaletteDark.walletCardAddressText + ), + ), + ) + ], + ), + status is SyncedSyncStatus + ? Observer( + key: _balanceObserverKey, + builder: (_) { + final balanceDisplayMode = settingsStore.balanceDisplayMode; + final symbol = settingsStore + .fiatCurrency + .toString(); + var balance = '---'; + var fiatBalance = '---'; + + if (balanceDisplayMode == + BalanceDisplayMode.availableBalance) { + balance = + balanceStore.unlockedBalance ?? + '0.0'; + fiatBalance = + '$symbol ${balanceStore.fiatUnlockedBalance}'; + } + + if (balanceDisplayMode == + BalanceDisplayMode.fullBalance) { + balance = + balanceStore.fullBalance ?? '0.0'; + fiatBalance = + '$symbol ${balanceStore.fiatFullBalance}'; + } + + return Row( crossAxisAlignment: CrossAxisAlignment.end, mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ @@ -162,37 +233,198 @@ class WalletCardState extends State { crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( - statusText, + balanceDisplayMode.toString(), style: TextStyle( - fontSize: 12 + fontSize: 12, + color: PaletteDark.walletCardText ), ), SizedBox(height: 5), Text( - descriptionText, + balance, style: TextStyle( - fontSize: 14 + fontSize: 28 ), ) ], ), Text( - walletStore.account.label + fiatBalance, + style: TextStyle( + fontSize: 14 + ), ) ], - ) - ], + ); + } + ) + : Row( + crossAxisAlignment: CrossAxisAlignment.end, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + statusText, + style: TextStyle( + fontSize: 12, + color: PaletteDark.walletCardText + ), + ), + SizedBox(height: 5), + Text( + descriptionText, + style: TextStyle( + fontSize: 14 + ), + ) + ], + ) + ], + ) + ], + ), + ) + ) + : Offstage() + ], + ), + ); + }, + ); + } + + Widget backSide() { + final walletStore = Provider.of(context); + final rightArrow = Image.asset('assets/images/right_arrow.png'); + double messageBoxHeight = 0; + + return Observer( + key: _addressObserverKey, + builder: (_) { + return Container( + width: cardWidth, + height: cardHeight, + alignment: Alignment.topCenter, + child: Stack( + children: [ + Container( + width: cardWidth, + height: cardHeight, + padding: EdgeInsets.only(left: 20, right: 20, top: 30, bottom: 30), + decoration: BoxDecoration( + borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)), + gradient: LinearGradient( + colors: colorsSync, + begin: Alignment.topCenter, + end: Alignment.bottomCenter + ) + ), + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + children: [ + Expanded( + child: Container( + height: 72, + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + S.current.card_address, + style: TextStyle( + fontSize: 12, + color: PaletteDark.walletCardText + ), + ), + GestureDetector( + onTap: () { + Clipboard.setData(ClipboardData( + text: walletStore.subaddress.address)); + _addressObserverKey.currentState.setState(() => messageBoxHeight = 20); + Timer(Duration(milliseconds: 1000), () { + try { + _addressObserverKey.currentState.setState(() => messageBoxHeight = 0); + } catch(e) { + print('${e.toString()}'); + } + }); + }, + child: Text( + walletStore.subaddress.address, + style: TextStyle( + fontSize: 14, + ), + ), + ) + ], + ), + ) + ), + SizedBox(width: 20), + Container( + width: 72, + height: 72, + child: QrImage( + data: walletStore.subaddress.address, + backgroundColor: Colors.transparent, + foregroundColor: PaletteDark.walletCardText, ), ) + ], + ), + Container( + height: 44, + padding: EdgeInsets.only(left: 20, right: 20), + alignment: Alignment.center, + decoration: BoxDecoration( + borderRadius: BorderRadius.all(Radius.circular(22)), + color: PaletteDark.walletCardSubAddressField + ), + child: InkWell( + onTap: () {}, + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + S.current.subaddresses, + style: TextStyle( + fontSize: 14, + ), + ), + rightArrow + ], + ), + ), ) ], ), - ); - }, - ) - ) - : Offstage(), - ), + ), + AnimatedContainer( + width: cardWidth, + height: messageBoxHeight, + alignment: Alignment.center, + duration: Duration(milliseconds: 500), + curve: Curves.fastOutSlowIn, + decoration: BoxDecoration( + borderRadius: BorderRadius.only(topLeft: Radius.circular(10)), + color: Colors.green + ), + child: Text( + S.of(context).copied_to_clipboard, + style: TextStyle( + fontSize: 10, + color: Colors.white + ), + ), + ) + ], + ), + ); + } ); } } \ No newline at end of file diff --git a/res/values/strings_de.arb b/res/values/strings_de.arb index 58d26c54c..572ccbbbd 100644 --- a/res/values/strings_de.arb +++ b/res/values/strings_de.arb @@ -349,5 +349,7 @@ "version" : "Ausführung ${currentVersion}", "openalias_alert_title" : "XMR-Empfänger erkannt", - "openalias_alert_content" : "Sie senden Geld an\n${recipient_name}" + "openalias_alert_content" : "Sie senden Geld an\n${recipient_name}", + + "card_address" : "Adresse:" } \ No newline at end of file diff --git a/res/values/strings_en.arb b/res/values/strings_en.arb index 2a019d3e7..469b08f28 100644 --- a/res/values/strings_en.arb +++ b/res/values/strings_en.arb @@ -349,5 +349,7 @@ "version" : "Version ${currentVersion}", "openalias_alert_title" : "XMR Recipient Detected", - "openalias_alert_content" : "You will be sending funds to\n${recipient_name}" + "openalias_alert_content" : "You will be sending funds to\n${recipient_name}", + + "card_address" : "Address:" } \ No newline at end of file diff --git a/res/values/strings_es.arb b/res/values/strings_es.arb index 6b15f9c95..be8257b32 100644 --- a/res/values/strings_es.arb +++ b/res/values/strings_es.arb @@ -349,5 +349,7 @@ "version" : "Versión ${currentVersion}", "openalias_alert_title" : "Destinatario XMR detectado", - "openalias_alert_content" : "Enviará fondos a\n${recipient_name}" + "openalias_alert_content" : "Enviará fondos a\n${recipient_name}", + + "card_address" : "Dirección:" } \ No newline at end of file diff --git a/res/values/strings_hi.arb b/res/values/strings_hi.arb index 6760af1ff..b4a8763ec 100644 --- a/res/values/strings_hi.arb +++ b/res/values/strings_hi.arb @@ -349,5 +349,7 @@ "version" : "संस्करण ${currentVersion}", "openalias_alert_title" : "XMR प्राप्तकर्ता का पता लगाया", - "openalias_alert_content" : "आपको धनराशि भेजी जाएगी\n${recipient_name}" + "openalias_alert_content" : "आपको धनराशि भेजी जाएगी\n${recipient_name}", + + "card_address" : "पता:" } \ No newline at end of file diff --git a/res/values/strings_ja.arb b/res/values/strings_ja.arb index ddac44e75..c6e76cc1f 100644 --- a/res/values/strings_ja.arb +++ b/res/values/strings_ja.arb @@ -349,5 +349,7 @@ "version" : "バージョン ${currentVersion}", "openalias_alert_title" : "XMR受信者が検出されました", - "openalias_alert_content" : "に送金します\n${recipient_name}" + "openalias_alert_content" : "に送金します\n${recipient_name}", + + "card_address" : "住所:" } \ No newline at end of file diff --git a/res/values/strings_ko.arb b/res/values/strings_ko.arb index 644629554..8b470908c 100644 --- a/res/values/strings_ko.arb +++ b/res/values/strings_ko.arb @@ -349,5 +349,7 @@ "version" : "버전 ${currentVersion}", "openalias_alert_title" : "XMR 수신자 감지", - "openalias_alert_content" : "당신은에 자금을 보낼 것입니다\n${recipient_name}" + "openalias_alert_content" : "당신은에 자금을 보낼 것입니다\n${recipient_name}", + + "card_address" : "주소:" } \ No newline at end of file diff --git a/res/values/strings_nl.arb b/res/values/strings_nl.arb index cefa5284b..f0916e1d9 100644 --- a/res/values/strings_nl.arb +++ b/res/values/strings_nl.arb @@ -349,5 +349,7 @@ "version" : "Versie ${currentVersion}", "openalias_alert_title" : "XMR-ontvanger gedetecteerd", - "openalias_alert_content" : "U stuurt geld naar\n${recipient_name}" + "openalias_alert_content" : "U stuurt geld naar\n${recipient_name}", + + "card_address" : "Adres:" } \ No newline at end of file diff --git a/res/values/strings_pl.arb b/res/values/strings_pl.arb index 5da641175..d08fba806 100644 --- a/res/values/strings_pl.arb +++ b/res/values/strings_pl.arb @@ -349,5 +349,7 @@ "version" : "Wersja ${currentVersion}", "openalias_alert_title" : "Wykryto odbiorcę XMR", - "openalias_alert_content" : "Będziesz wysyłać środki na\n${recipient_name}" + "openalias_alert_content" : "Będziesz wysyłać środki na\n${recipient_name}", + + "card_address" : "Adres:" } \ No newline at end of file diff --git a/res/values/strings_pt.arb b/res/values/strings_pt.arb index c1ff1ca32..09e0a383c 100644 --- a/res/values/strings_pt.arb +++ b/res/values/strings_pt.arb @@ -349,5 +349,7 @@ "version" : "Versão ${currentVersion}", "openalias_alert_title" : "Destinatário XMR detectado", - "openalias_alert_content" : "Você enviará fundos para\n${recipient_name}" + "openalias_alert_content" : "Você enviará fundos para\n${recipient_name}", + + "card_address" : "Endereço:" } diff --git a/res/values/strings_ru.arb b/res/values/strings_ru.arb index 947cc1cb5..cb7f935aa 100644 --- a/res/values/strings_ru.arb +++ b/res/values/strings_ru.arb @@ -349,5 +349,7 @@ "version" : "Версия ${currentVersion}", "openalias_alert_title" : "Получатель XMR обнаружен", - "openalias_alert_content" : "Вы будете отправлять средства\n${recipient_name}" + "openalias_alert_content" : "Вы будете отправлять средства\n${recipient_name}", + + "card_address" : "Адрес:" } \ No newline at end of file diff --git a/res/values/strings_uk.arb b/res/values/strings_uk.arb index 39ce4762c..e8a24c230 100644 --- a/res/values/strings_uk.arb +++ b/res/values/strings_uk.arb @@ -349,5 +349,7 @@ "version" : "Версія ${currentVersion}", "openalias_alert_title" : "Отримувача XMR виявлено", - "openalias_alert_content" : "Ви будете відправляти кошти\n${recipient_name}" + "openalias_alert_content" : "Ви будете відправляти кошти\n${recipient_name}", + + "card_address" : "Адреса:" } \ No newline at end of file diff --git a/res/values/strings_zh.arb b/res/values/strings_zh.arb index 61625661a..5c074a0f4 100644 --- a/res/values/strings_zh.arb +++ b/res/values/strings_zh.arb @@ -349,5 +349,7 @@ "version" : "版 ${currentVersion}", "openalias_alert_title" : "檢測到XMR收件人", - "openalias_alert_content" : "您將匯款至\n${recipient_name}" + "openalias_alert_content" : "您將匯款至\n${recipient_name}", + + "card_address" : "地址:" } \ No newline at end of file From b7198f4f6c858259e97e7a9d05e831aebb966d15 Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Wed, 15 Apr 2020 21:09:41 +0300 Subject: [PATCH 03/11] CWA-198 | added buttons to dashboard page --- lib/src/screens/dashboard/dashboard_page.dart | 9 ++ .../dashboard/widgets/buttons_widget.dart | 118 ++++++++++++++++++ 2 files changed, 127 insertions(+) create mode 100644 lib/src/screens/dashboard/widgets/buttons_widget.dart diff --git a/lib/src/screens/dashboard/dashboard_page.dart b/lib/src/screens/dashboard/dashboard_page.dart index ab0185b8b..fa7819f2f 100644 --- a/lib/src/screens/dashboard/dashboard_page.dart +++ b/lib/src/screens/dashboard/dashboard_page.dart @@ -25,6 +25,7 @@ import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/screens/dashboard/wallet_menu.dart'; import 'package:cake_wallet/src/widgets/picker.dart'; import 'package:cake_wallet/src/screens/dashboard/widgets/wallet_card.dart'; +import 'package:cake_wallet/src/screens/dashboard/widgets/buttons_widget.dart'; class DashboardPage extends BasePage { final _bodyKey = GlobalKey(); @@ -137,6 +138,14 @@ class DashboardPageBodyState extends State { Padding( padding: EdgeInsets.only(left: 20, top: 78), child: WalletCard(), + ), + Padding( + padding: EdgeInsets.only(top: 28), + child: ButtonsWidget(), + ), + Expanded( + child: Container( + ) ) ], ), diff --git a/lib/src/screens/dashboard/widgets/buttons_widget.dart b/lib/src/screens/dashboard/widgets/buttons_widget.dart new file mode 100644 index 000000000..cef410fdf --- /dev/null +++ b/lib/src/screens/dashboard/widgets/buttons_widget.dart @@ -0,0 +1,118 @@ +import 'dart:async'; +import 'package:flutter/material.dart'; +import 'package:cake_wallet/palette.dart'; +import 'package:cake_wallet/generated/i18n.dart'; +import 'package:cake_wallet/routes.dart'; + +class ButtonsWidget extends StatefulWidget { + @override + ButtonsWidgetState createState() => ButtonsWidgetState(); +} + +class ButtonsWidgetState extends State { + final sendImage = Image.asset('assets/images/send.png'); + final exchangeImage = Image.asset('assets/images/exchange.png'); + final buyImage = Image.asset('assets/images/coins.png'); + + double height; + bool isDraw; + + @override + void initState() { + height = 0; + isDraw = false; + super.initState(); + WidgetsBinding.instance.addPostFrameCallback(afterLayout); + } + + void afterLayout(dynamic _) { + setState(() => height = 108); + Timer(Duration(milliseconds: 250), () => + setState(() => isDraw = true) + ); + } + + @override + Widget build(BuildContext context) { + return Container( + height: 108, + padding: EdgeInsets.only(left: 44, right: 44), + alignment: Alignment.bottomCenter, + child: AnimatedContainer( + height: height, + duration: Duration(milliseconds: 500), + curve: Curves.fastOutSlowIn, + child: isDraw + ? Row( + children: [ + Flexible( + child: actionButton( + image: sendImage, + title: S.of(context).send, + route: Routes.send + ) + ), + Flexible( + child: actionButton( + image: exchangeImage, + title: S.of(context).exchange, + route: Routes.exchange + ) + ), + Flexible( + child: actionButton( + image: buyImage, + title: 'Buy', + route: '' + ) + ) + ], + ) + : Offstage(), + ), + ); + } + + Widget actionButton({ + @required Image image, + @required String title, + @required String route}) { + + return Container( + width: double.infinity, + child: Column( + mainAxisAlignment: MainAxisAlignment.start, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + GestureDetector( + onTap: () { + if (route.isNotEmpty) { + Navigator.of(context, rootNavigator: true).pushNamed(route); + } + }, + child: Container( + height: 48, + width: 48, + alignment: Alignment.center, + decoration: BoxDecoration( + color: Colors.white, + shape: BoxShape.circle + ), + child: image, + ), + ), + Padding( + padding: EdgeInsets.only(top: 10), + child: Text( + title, + style: TextStyle( + fontSize: 16, + color: PaletteDark.walletCardText + ), + ), + ) + ], + ), + ); + } +} \ No newline at end of file From 823030403a145fd24010c68efc41d4ea46070f04 Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Thu, 16 Apr 2020 21:41:04 +0300 Subject: [PATCH 04/11] CWA-198 | added transaction history panel to dashboard page; added fiat currency symbol to transaction_info; changed date_section_raw, trade_row and transaction_raw --- assets/images/2.0x/coins.png | Bin 0 -> 971 bytes assets/images/2.0x/down_arrow.png | Bin 0 -> 428 bytes assets/images/2.0x/exchange.png | Bin 0 -> 1079 bytes assets/images/2.0x/filter_button.png | Bin 0 -> 1344 bytes assets/images/2.0x/menu_button.png | Bin 0 -> 226 bytes assets/images/2.0x/send.png | Bin 0 -> 582 bytes assets/images/2.0x/up_arrow.png | Bin 0 -> 429 bytes assets/images/3.0x/coins.png | Bin 0 -> 1409 bytes assets/images/3.0x/down_arrow.png | Bin 0 -> 559 bytes assets/images/3.0x/exchange.png | Bin 0 -> 1528 bytes assets/images/3.0x/filter_button.png | Bin 0 -> 1923 bytes assets/images/3.0x/menu_button.png | Bin 0 -> 293 bytes assets/images/3.0x/send.png | Bin 0 -> 836 bytes assets/images/3.0x/up_arrow.png | Bin 0 -> 479 bytes assets/images/coins.png | Bin 0 -> 600 bytes assets/images/down_arrow.png | Bin 0 -> 287 bytes assets/images/exchange.png | Bin 0 -> 588 bytes assets/images/filter_button.png | Bin 0 -> 693 bytes assets/images/menu_button.png | Bin 0 -> 165 bytes assets/images/send.png | Bin 0 -> 378 bytes assets/images/up_arrow.png | Bin 0 -> 292 bytes lib/palette.dart | 3 + lib/src/domain/common/transaction_info.dart | 2 +- lib/src/screens/dashboard/dashboard_page.dart | 33 +++- .../{ => widgets}/date_section_raw.dart | 6 +- .../widgets/trade_history_panel.dart | 179 ++++++++++++++++++ .../dashboard/{ => widgets}/trade_row.dart | 35 ++-- .../{ => widgets}/transaction_raw.dart | 50 ++--- 28 files changed, 255 insertions(+), 53 deletions(-) create mode 100644 assets/images/2.0x/coins.png create mode 100644 assets/images/2.0x/down_arrow.png create mode 100644 assets/images/2.0x/exchange.png create mode 100644 assets/images/2.0x/filter_button.png create mode 100644 assets/images/2.0x/menu_button.png create mode 100644 assets/images/2.0x/send.png create mode 100644 assets/images/2.0x/up_arrow.png create mode 100644 assets/images/3.0x/coins.png create mode 100644 assets/images/3.0x/down_arrow.png create mode 100644 assets/images/3.0x/exchange.png create mode 100644 assets/images/3.0x/filter_button.png create mode 100644 assets/images/3.0x/menu_button.png create mode 100644 assets/images/3.0x/send.png create mode 100644 assets/images/3.0x/up_arrow.png create mode 100644 assets/images/coins.png create mode 100644 assets/images/down_arrow.png create mode 100644 assets/images/exchange.png create mode 100644 assets/images/filter_button.png create mode 100644 assets/images/menu_button.png create mode 100644 assets/images/send.png create mode 100644 assets/images/up_arrow.png rename lib/src/screens/dashboard/{ => widgets}/date_section_raw.dart (89%) create mode 100644 lib/src/screens/dashboard/widgets/trade_history_panel.dart rename lib/src/screens/dashboard/{ => widgets}/trade_row.dart (71%) rename lib/src/screens/dashboard/{ => widgets}/transaction_raw.dart (60%) diff --git a/assets/images/2.0x/coins.png b/assets/images/2.0x/coins.png new file mode 100644 index 0000000000000000000000000000000000000000..c96e6e48c4ec2fea8f02e1302148928ee807273f GIT binary patch literal 971 zcmV;+12p`JP)Dx9F{3F@*SEo|BokQ+cGL?|q1N&{lmWL2pxO1eN*x*<0pJpo~XO1dFA z0pSJ)HX%)BcrS5UE3%!~p0U(VipCz#jNi|^Z$5`X2ppbWW=w!B;CxL2WEg-&{dDaf zhy6Xtn2nb(}Z&RFBOXozDxfCI8ZTL_|p4ClPOSIFK(ng~Jk`#EH>6)9x~ z+YF<2cB;c*xQ0y(hQaKngy?t`eqa%QsJE$r%McQ{X!%VcTbUZIip2o8A2L`2oxYel zGnYn*`wh-t<7JL5VgN>d|HZ~OT_(X|z7AB;aBAIYJNo#|!n9iq4>F8`g%L^P0%=!d z?Q0>{-{YJKi@^bCgdB~EzBM2?|3ZeH)Z0x=f0JPm7W33@9^6VWBFF0O@nez- zLWq26XR{TX#TEc&x#4>fmkJv-7LtL+0uR#~b$$pC#qJW*@t{#O0E==J4XeqC5St6> z;`J!=gFqRkp!_w>Rb;wTr_UQvS!e{1e^L~5zE|Lp!R_gYJw z+rAFqA@ zG%mv_2=oEPm?Z`S%3d0cpT5K20m0a|A>|sTxwrTHL1^U|g~hzrxtR;I=L)gVTqzL; zQMJ?pAQmc9A$vNYQZ?bL|M&q?V2CbioF?9lO_-n8Qy2#JWxGt~% zqd3Ax_z>WFevo^BfL0Ayd~_Z|{2)&KK`Q}VY1H#XEcO74bIiPIzVy4x^VxeT{La4M;D@!pkoQ4=tfkZ8iYe7T{#nXb&*%>>n#6teq zpdD78jiQYhguC4B&hx#6OAgrOc4ihd=6=b--R{iZcW>r>Z)OjmL4yYW7unIz2|geu z1Q;?rI+Ls{RT5IUNk?MBl`<*l@NcSMj}VwZA(GYh2=H;?>(Z-SuDt{nG=U}qPv5sV zfTvZtoN)Z!4k-F7Ya2-xxH=Z}?(pt?JAcy4w_t(PY0Ob&v82Xmh!tWAEYT9|m5X~# z#jfxREYT9&lQ}U!f)} zuOVo{DX9)T{QBi0jQyf2fsTI1e-GIgC7`xL#x%}jc1 zqqf1eCZJSz8A-`ilFsY9oyUxadL>U@&`plDRH z3*ULhQA~2Yr>ZZ-=8xp&r0}02;2A+pH+{;fKLM8TAT%5ae?Zhltz(dW^i`u>? zlU}E4T8-@!$`&kY{O*zpc%3Ke?8tKq~6J$l^Zq zb{;ztbj@gsw3eZf$qoTxm@~dM%ZDGmYta@mOinv>Xupa;6{`P*G53mdhGWlD$`p6JjQ?2fWPiYLMv zb2JE=m;JY{v_6c|);hv$SzrO%*R4!C7qz{8ge#R47{d0o(A*qZEMpyEvLK@fSM4iz z>4;XDw-#J|h^JfkG0_1 zA6^WYZ{D$^pwq#AN+6Dd8SD<-H#A+s+K1(~Z4W*6V#JQB5E|-vTozQI^Yb*%3%n!t xuhMHJn+iRbkA8u_NtP;J*0Sm~Xwcvv!rU?K5002ovPDHLkV1nw{_eB5z literal 0 HcmV?d00001 diff --git a/assets/images/2.0x/filter_button.png b/assets/images/2.0x/filter_button.png new file mode 100644 index 0000000000000000000000000000000000000000..767e4e561526714275c9167a6635475d8e31622b GIT binary patch literal 1344 zcmV-G1;6@d*e8@1@IzZ zEQqZfF4a!kNOLEDRe-8s>;b-GjQw`teyQLZA*76o@(xaxL1u}-C6+_DGE`wc+maXC z2X5CPMN$!{Q51m7NR?155$Z8gAW?x-n0L+Ts<^~A$yiD^up^?!zVB}(X;p~`)L&tu zghKuK`|~vwx5@Y{71MLWcv&|pK0~bJ%5TT(6c~lHB;tv%@?b|Aj74hJmx1ReIPkFaqA655vJN;0{0^Pj5um+}YG2}=OclU!EpU^+A{-|`)z9WIu zaz;U%2FjgUQrjS{emh3=6GjkbUjujLvNo3rq`j2}?9B$+**sR`Dp_g6QmfWDIe& zM{%xpL7*Vt$%Jb~Av=lF3**Wr7aP7YR^n8Td1AJ4VB2It#+VgkR~*HQT2Yfg%veUo zA;M~7EUF7MZ5LLMZRlQte_8}doj}Bt9$p6CO<#@5ou6!v(1_XrM+8upX7 zC7Krv#u(0bMh0Ws$caV6j~T~=qo5`tC(41_*)~olrX?8VfjR;+SM<3MzQYr-r!xA; z;LRKHmOch~P!Yvc3PFaPAT|dAxnQwAG^w1>z0SAg{hvvzo8{C9-Akzpq;8h?W(vE; z+OxVq>SjJ;0~tr$Ypd~n(_nQH6Pww#B6jl7)L}IVlyxgo>xu4}zAy;0vfO$?r$biF zlLYMkdbu+jJ$hk2D9EhYe}Igk)roP(V~bhdRQKKc-lv|}*BxX4pLyfZ?QF)KYdND> z#P~YG;{Fkb-3f~8tVRzt>_GML#HC@HIx1x6BXP)v>lMs0-rJja#op@4FZw zd_G(KyMwzmbX0Np=GFf0d)~*oRj-T@Kzix5L-*@qX{dlW25EvHj)l&)v% zXYBlvR>lll;0^;aFX=RDm!IpN{Kf)p&>t%D#2lCge%z)>;4v5Hdc7mel^4Wr+J$>e z!2s7{piry9O1CZ*C9xGlal41&b}Q(!P_^W5<6lf}_Ig8;$oD0O#wK}M?uSrG3)Aqu z=@6Dz@p9U^lTNV9MLao{DdQxCIVbf+`OvCNIVrJf-Su9YqC|f0dYQKKi}Ir-AI1{= z5`jDk@*YK8l4~;wBw|QgXLKV0-fkaZ%B3wzBmV)tTlApnVGnu$00000V4T5^Y;NM&H|6fVg?2=RS;(M3{v?36l5$8 za(7}_cTVOdki(Mh=ig1u+{(8uD5zH~%B@@7Pz?l literal 0 HcmV?d00001 diff --git a/assets/images/2.0x/send.png b/assets/images/2.0x/send.png new file mode 100644 index 0000000000000000000000000000000000000000..055ee615aee148e733dbd4e2b827e622529996a4 GIT binary patch literal 582 zcmV-M0=fN(P)WVsK-KE4hK(z_>8P6?y`D1T-v23mxAZ zg|vk>3~9@kkPI`te!usoZw7#jbo=mjNFPuXhm6EHFL7Oe>GeltmAK3R{#6P%SAxhI z00cl;1tN0*Rft>wR3LH#h(J7zORx`sCB(w_6CoHVh#s==Jc|o)5CBAbo-s10Ck8Y2 zp&3T)vRRpgr*+uEG?>lmLetL3oaO?i#Qi5B4zUtF95o|cX)$;GQ3E*dP#GaBF*azo zs?AgYS!&;ZMrsT4PzYk}C8V|qJa3$vIZ22{_wn79ENkZ2Hkp<@jRU}0RY1OM1)7u4 zT&%hP_uPg8&9U_M_4$z_w}48&;QR{;($bv9ati`Y>p($b*a1s(`Mt>OrFrNKAnACd zTCjt#jII#E#i1)FI4`HQuE3+X9W$2z7lFX-g z4{Tb~agoR&K@(gVkm*&c`U*P;<6Sb31Frz+lGwC>8Q=eyrjr!7t@%6%YH82VHw9tF zja@U2o8Mdoq4G|wY{3f`w@b0b)TCJuC&klIMpkUQ{cTtGwk#cEC)Kr3E2eTH4r!;tzC*rHpw|AkG@ATaM~beM_uTXo7gvqZy+xU z*V$M(L6sX2`GaGVGkK2|6GjoOp)?%LA|D_~BT}Q`$2ar7_YDyYq5b5fa{l(M?+H-_ zA-+;dRp{MErF=fF0Q|wt z2Bv}7A;P*+%7bYUmYX1sl<@5At^l}0QBeU)h@%Ujg;E|aFD>-I5^@o=x%(dxgX=bl z8AL+VN^^c6EI^x}&E4Y`oxBc?KuLMi#l?WLHErKMdZ3JvXksxBum1_KXNecgK=g2RU5EV*YBXQ{`Vw4V5kUtN0$pZAE z?@vT1E%3qp-@osI2DG!-qupap?=3KoAOdLo(VTxec;LZ5|5i($w7WOk&4gG-L(`2H+>p|BI%-&ms(0^xWKs%I=NZV-SGkomhdC{r zH4{V$#9Df-VL3rlrtOjtov0T3`|-0yn$vOkQ{7a{^IM9Jy?ejjXe3SNgebtqT64ao zMNpffhUV)JM8v^mbr2Iqg=Li&&^Wqi;iN*=@Bg8nIyE?#axR%#963seC*T-V6fJ8J zL<{u)$psQgds3-=lQRF|<7X#R(pr~7T}-#pc({A~nT(FT97@d;EeD>I-AO9!Vg0*; zv4vvXMy%7vdL#r#S&wxG`!|W+;PXQI?digo=ayDAzt+65g$6|;lPSvOc2WJC0FUP$rFt!b z7^}_s4a!gr)%TGn28qDfvMs9r@e$D2?(%rJp-m9u{?fu8D_>I=LSpk;k^Scc*K4g; zGc(sopKT{!PE9B>0VKq(7uCPsAXEo=V}M>+?!nZAq71{E$s%1q|H;M0eNolV@0?`= z_LssieE#O@)!s%%W=)T0ETKqt!-mP7g`$P1E_h8u&s$H5WF}b8a!uVGVzwS3vg(}! zLm2FzqN2{a%9Iez0y_ut^z;^QbW*b(7s)AWna8DPxsq>^E(J`>-lBvkI}iL$1Xo0< z_Q4=b3(?QeCqbpi(7DMh z6er4JCQ+bcITkqOvlhywgNlT!LQy+{Oc>@8@dc&#-erclNyjoLc$`}=XJ)q3=|7Vo z7YuXfgraMP`5>k$6kRmTZDW{Fj0tkpFo%LMR45JrT{g_ue*11KY4fv5q<$9D3qJ3V zP9hXXxtOs~bm7U3q2O^*R!N$PkmQl7zDT4@SGZ6txwxCau$aN0I9wa1fZ9Ug7DfjVRA{6kV-@l6L>e+7si`E{{+&{p7}&;P7sx?_e4% z6#ErDzp6zE#eqIP!nHcc1!UG@F4RFT09`iBZ9Y+-1$5akUmdY6WCJCa4Rde+C6^6z zZ~!Hj4Rde+!sRC`zyZX!)m6jX1$+^TBk)BijsWVOmpo*r5U?ZhKDNqWO0;NDH@b3a{ z^h>n60p>id{OKJ2AdR5kCZqu(g>DQkx*OUx7|5;~LGNbeKaas;c+D}dJ(8^$MScQ) z=7U&wBPC!Y7g&YEC_1(mKtfNs%94Z%9uwfvH literal 0 HcmV?d00001 diff --git a/assets/images/3.0x/exchange.png b/assets/images/3.0x/exchange.png new file mode 100644 index 0000000000000000000000000000000000000000..52d78d21ee3aa73f1b5a63d7882cf5ae6de35fa6 GIT binary patch literal 1528 zcmV8BrH{42S|Mxz3?*L+AVq#)q zVq)5Z!3AR`|GS%ll3RjQIXm)p87yHb3o!xe*7NBtJgx+xF-0Q zYeCt26AyD>7;P3Yn}2r2@zoH{$OX+P5Nnf}4}JxMaL~X^{;|t_xMf0wD$Z3fj273p z`vrt12kt@ruaz9_?AdHAWD5hS41tM7lwbors+yH~v zD6fgOg&+}x?+=-4w5mu;uF-g8R7D`ZxbyzTS<9f(`rzp330NX@@s=8?Oa9*( z9T|cq_u}YiH9I~~)9=4Q*8^PbN(g^;7o)YmDcE^nqKxly=7Sh&?Y-*m8?y4|;~7!+!qqjK3sP!x&8b~_>vjInEt z&bO2`CP#Z8i6B^)O#LRL{DYb%5gg`Dm&+!Y%Wd7Q7ZjU?ow*6++6SzwtOyYZVSFQqz_o~-u%4nGR)pYfmc^}5$q+&eLYvre z4Gn9ajc6rJ*27l%H0l~E2nM5wK-dx@4W>|PZ2FTABd>&65kiG@e(geOa`JZHJ0NrAkcMYYCRh1;hx46v!8Zd7WjHSUOoNL)pvtbeDp7p{W zV?xt@ig6)?Ql>V3O4MV3CakPb;kx8DT1J#*`4Xdv;|q_Ac)YWpOy0|Cd_vetW$9x9 z^cpVS(qirDztfWb$>i`{3F8S(vRFOIijpUaFC6wy*1{vvR(HB)u*$q7)MZx#qQGCR7omKnF`aTgfdMmH#nIT zh%XQ?6DF9UK$$SXR-!$*XIC<^-j99Uwa;(HBU!V?8vi)wo;~;KUP8{e;LUr0Q!-C4 zJAlUo*E~0`!6oy>2){qTyjC@@RS|wsm6-hiFkk$HLHbwR1Of_&NAvU5hjI$<2b9#SV9gV#zt1+ zQWe&Ss5^NT)lL@TQW2J~)HgC!BHaD+_eX0;fy9Mf@IEUM1@{o$D;;6jXXaZb+R8|f z#Dqyyopx$#fr%;{Cz#it``ar>h(v@*Q9br;FT!YBOk!+v5HmC0{E|b?V;oyq z0?B{a$M1Vrmk~235F;O4Sy(guxjW`*5lWGWzIgBaCHni-A7#WuEGaSURM7sq`R8sz z>A+Nx8~+4TD{=HFCl(gTs>ygY2c;jCH$1gCskDiNsjQKiSlZaaRMyx`ByB8VDr;iK zmNr&d9~BrXYXat^r;0HcxvZDc-2~?G>Ru$n+&CrwNW!MCm>WT+Z=u9R>5Mz$zpg%e zGVBiwJ%)vISmy5i2zJ}Erpg?AJZu|l=rK%sgDNW#T+#8Tqa0oYAzdtBCwAiqh*5acj!kiKmD``!O2f{QR+DmI%3{#?KDv^Dvy@CaN ze*H_>#Lo|Zgbg&)Vi;ljsF$EvO%Z$HDz!#R46Z@38pet1@)!vtU1MlF4h5|dX4~Ev zN+%QvoADMjy7GZLJ-cxEWPlSMP=_tpQkB^VGnE`h{Uazjfjt?+JScg=b4-WBgOUpv z>^h_iZE}MH@*J@SB_9ynlZ|axb46VJ#vE3puA^%YbA=oGPB==ksIZ)&!g7X`_113r zt#nW&(@>O!Hy)Hc;F|~|jj+7HkR<}_L&*iE$x(Fz)-fzUkS|rD4<#>z!k$9O1*R)i zISB;iqjEdetH*d$X0ZeO`_z$-W$L|HK6vT>RtZDPR38;6R>RC?d5m%)J1Wd_7?Gn! zgw-EHv7D9&E25|oW;y$q+LFhE5A;pXUfnd`mY`UNj9R|e7l9w;TDIcMGJYG4uwO)BrR&!!zS2oKaTj2 zFiDGMx@8@T6);n|{k4v+ZxK^>p;$t2yZx08VG?Cb*npBL%-9%uzeEI`W|g$*?x3qM zF{@FQ9lfGU=s9y)45n7JVoaatZ{9n@^*k)6TJ`r%yO)YYx_@GtFbCh6=;}Fp()VPD z#+F9M{D|K)VgLEg_H4f^`Yz@OD@G1(K}iKOb}bFMX5jf@udC1ev+jqkiN$#+i4icb zzwozz77lEYjSi~_V>R<$48CkKek%=|JnlujHk;A$@981`jc2loe<4H(FSd(e* z(>owu#xX*=?)xa*j$^#)Mxw$56Ky3EZF1VWha-(d6_$4W?JXoo;=-CpLE@0JeAM=5 zl(8z{V0{n8yGcb=+wV&c8Qb7Et2D&SY95f)O?#MHNkdeVRE0IkyEqXgE1QxiDh82> zuqG|yO0ay4OFQ-Tc^`HVop8%HZJTS8&u5uG(t|fB+|N=}6KjMu38M~9DNA{_NovJ9 zVXera)2C3oRtJ>`!CVpoqg2Ng*$2b?jt6@vJh4quD^?5Z#*FvL9OIqKK{Pwy$pJE^ z73P`-t85YOw%;~{LS*aJaGODMuM}C0AjL|lHp^XMsZ#Q%Zl_1oesh=>3H002ov JPDHLkV1mN4hw%Ua literal 0 HcmV?d00001 diff --git a/assets/images/3.0x/menu_button.png b/assets/images/3.0x/menu_button.png new file mode 100644 index 0000000000000000000000000000000000000000..97f28ae94c13c3d4ef3f87db32a2a34a8ca37e47 GIT binary patch literal 293 zcmeAS@N?(olHy`uVBq!ia0vp^oItG0!3HF2);Jn~1PVMNiy0UcEkKyjb(&!UP>``W z$lZxy-8q?;Kn_c~qpu?a!^VE@KZ&eB{w_}!$B+ufx04p~9WoGTTfhCxq=^DeYm^Rt z^a2PfFD+Bm5e3Ej+5U74{iCcSYLr_25&zO(CI#_H{7aLX%Wm9%PX z7h>^<)2-Ykk*>A&T@=ru?mV3}4~4Jp%$x0-cG@`p+lRTXeLG$M?P}q8@v$Ms?bwnF z$rEm^IP!jBjBv3>K=X?Y&o=*hs3GS(_vQ1$e$Q90cF%AB$0D+j<$u7}b@pwRj!8By mH-e0UjsEvdIU_jvC!6igBTm^%V&4LN!QkoY=d#Wzp$P!Sc5(Os literal 0 HcmV?d00001 diff --git a/assets/images/3.0x/send.png b/assets/images/3.0x/send.png new file mode 100644 index 0000000000000000000000000000000000000000..f77c93aed1beb07e5f3df0daef8a20e07c09164e GIT binary patch literal 836 zcmV-K1H1f*P)Z?#F~I1_)m!WHLag zF+~})JHwRQ8)P#80w85@e(u(UbOs17CK!as8*DJnd72r9${2ej7*k3GdG{%Q9vRB?U1X8@#8Z~?`s5HhBTL}I79zoR>x_s(f&n8UZ|F%u%a3DHY1 zrp4m%{3;Wk4A{a!h#W+Xg9*jWy_71`+uH^Te}Ny^3fSAzo0}f~D$X9hw+Cn@pc#Q? z29N>9`t@>V-`-t2jbf2iK=BvSh$n<7wLbpr*}IMgPCCO9ZU&JIQm>#1dqK1^g(&j4 z8Gz(qaGOg#Ksk@Ddhh^1@nXqV!_Wl9mWiBvVxHr=P O0000KnArmxZgS>$R#GFG_AWH4C6Dpzl zm-1x${xA0Ve89Gg&{O*}HC4cfBUPmEI3Ls0WqmJzy_w26!l)H6pP$mPG)4qZ@tXO1LiH8)MbTR{-&?if!hs!sVe+@6g*^nC3)3Xf9zfS8q6k zgBBN5E!PxQ0Ms~u#asu3qihh8*U;Ns0`YwWge&}kxea0kz{!>I{hV^k~Yq Vz(DgB!~g&Q002ovPDHLkV1hj#ztjK# literal 0 HcmV?d00001 diff --git a/assets/images/coins.png b/assets/images/coins.png new file mode 100644 index 0000000000000000000000000000000000000000..8541ee94243aa3c093d31ecff2dbcc3a962337eb GIT binary patch literal 600 zcmV-e0;m0nP)Q|saq1)R2I53?5k@x?A3&V&V-bymlVvjTBjR8Tlkx^Qy0I9;1iV3c0_$Kx zfZpr>Rxp&Www{EBo^yIWe&^gvVoI(b-!o*IJ4CcaN~M($>9LK3a21gYeS@W}l@2#t z5g|1Ba#L+OP+W?b!a@{Ii`m*TA9E^ObZ}IUXPuebU#V0l%01M|U>DTg-b(sT}6;Hv=Zh`AX%J zAjG%jP=ecPQwbtHz&e6;hN${tVvvD7p~OcdWggtO7TFgBcZ^BJ_U>_~KNwU^A`inv zGeLeka7Jf_Wz`nhM*&^v+t9y|5+}T3z0Dv}zF#^&+N{j0C<@`#(?=R>nZ`1#N#-3S z%Z1id4u|XCtE;Y9(lUncNDN$8pZZNY<0th)cL@KWgL`C-yLvsm%-gatBIsR>6Dw2) zqAn#py?XV|i&;lsDL%6oi6}|%QI*=?Vbg4J3`9%`)^3!*(Famr8Nt?sZSF|#V2d(m z#cbJR%X+}+ttH`F+F$oz%Eu|l^!xqKlwmXoLzGID2M9KgD{yG875L}G)B#x88NQcmR_#@uUDi@7d(Ur9IGk``)6B5vN>7%gJm=@BSs{{DSGit!=ZDz|-X~%! hDtjkCxh?UCv3_TCTh`*eNkI2Ac)I$ztaD0e0sybYZbJY7 literal 0 HcmV?d00001 diff --git a/assets/images/exchange.png b/assets/images/exchange.png new file mode 100644 index 0000000000000000000000000000000000000000..ce2d3928f43a16df2952a26738dd5a63c5d68992 GIT binary patch literal 588 zcmV-S0<-;zP)66~>9Yyyyx3_ci-Q3K-2hdeb%oNzoJ`RRa#yCTZ1M~u7A97{^g2foiuP=_= zfRDnu&1CM{>T$(f{k8a00;?_PB5;r{zF@A~OeLlqS4v|da&RC(+?*VFGsPIP|AEuF zr@kI0W=u(lXhWx91r_D;yc&`z2|<>i6L2zDuoRS$1H3fpG?y~4;$N=lExk`8V>;-| z$E$N`^;=^R&Ii6+w+I1h_;~;1As#~X^i_~&w|qRST32zL_~!C>zIDIZigMYLBq4O= z2R%5xos_OyV4PncWbb!CSFzF_Js9PDLiN){INM$xFB+lQyHy4(-B#to`qJoWZQT@s z@^mmxsh>xF(8H65Ogpstg@%fCN*~|GL@1Oa@7{!?(G0ofoQyo#{v3fa8%v{W_4{xT zSa2R!AWBsIT%j$GYsg8@pOHwab&m&u2{_aM=%4__iV(A@#IW5FSXW_-?243Ax_SHs z95V$3K*BWSK(O{CHk0E%u|OHY)c>S9dAeAjE9i%Gfz`@v0@<`yLn?y$b<%NPYa3cu a9(@C2L&*S!X6_~c0000}5<%c0+i9gA(D2Xn;W zgA;pXU7k;62lmZqOhnrN2XJG;oP;9mOPRqB3hJ9T0a3Cqra>jxGV|_3!U_fXCh(tn zm%9n$BkF`XJV$RYwo#0-g3>r4@0*xItb}y7HW$Sg6^QwX$}UN3AZPZYnQ<2Xv(NmOzRcMM8bnf#@V`C!G`qgBb@cFfPkh+mGQjpi zs@VBE-7XXr9iU|ivbM^qm=u-L3wL`R*yHtAUn b>+<|7d4%(__($JO00000NkvXXu0mjf=;k!g literal 0 HcmV?d00001 diff --git a/assets/images/menu_button.png b/assets/images/menu_button.png new file mode 100644 index 0000000000000000000000000000000000000000..33a3e5c94f4da5b325f1434496fdf7eecc75496b GIT binary patch literal 165 zcmeAS@N?(olHy`uVBq!ia0vp^%s|Y~!3HE1UzHvKQk(@Ik;M!Q+`=Ht$S`Y;1W=H% zILO_JVcj{Imp~3nx}&cn1H;CC?mvmFK)#iyi(^Oy} z-9K}7k)X^0J$C;3v!1fTuD?&+nh|SeJBk0hgyakU&K0tpzeFQCt`?L6O=0kK^>bP0 Hl+XkK+@vj0 literal 0 HcmV?d00001 diff --git a/assets/images/send.png b/assets/images/send.png new file mode 100644 index 0000000000000000000000000000000000000000..aef504999fd9adf5462eaf0dd6bf132789716483 GIT binary patch literal 378 zcmeAS@N?(olHy`uVBq!ia0vp^0zk~i!3HGN^yhQ|Db50q$YKTtZeb8+WSBKa0w~B> z9OUlAuq2eY-?C^Qa&%qO?zfrYrUI+GbEE| z|Ejf~W~-JfbaKoydtGX-r4s2N;AGYwlFxsm{mJRGg{O5M{_IJ(l=XF+>lwyJ%tD-H z(|$-SyS4sxO+3pKDdql&T+a%0cpCn{w~CWEkP+*4#*xdj!)iu$=2;~(VX@cD(V4c5 zQ<6&hzdv|weOgN(@Xm!l4N^LnR-6|4+t4)oTW9x*;~76))r!wM_ZR(8wOS~-v9^YB z;xv9Csi~jpVwUq4-bngaQD>fQwdefvZvJqWj?4RviwjyG8?BqUon!OT)V*$B%MQdP VIm~&QWCRQ<22WQ%mvv4FO#o|ak0k&A literal 0 HcmV?d00001 diff --git a/assets/images/up_arrow.png b/assets/images/up_arrow.png new file mode 100644 index 0000000000000000000000000000000000000000..35324017625653b282db32c7c1c5dfc954403ecd GIT binary patch literal 292 zcmeAS@N?(olHy`uVBq!ia0vp^JV4CH!3HFy_x^nYq&N#aB8wRqxP?KOkzv*x37{Zj zage(c!@6@aFM%AEbVpxD28NCO+i~#(mGkixeS{a zW7+-QFeS+xVcEbashD1u^~OQ@$`T=&tdo '${formatAmount(moneroAmountToString(amount: amount))} XMR'; - String fiatAmount() => _fiatAmount ?? ''; + String fiatAmount(String symbol) => _fiatAmount != null ? symbol + ' ' + _fiatAmount : ''; void changeFiatAmount(String amount) => _fiatAmount = formatAmount(amount); } diff --git a/lib/src/screens/dashboard/dashboard_page.dart b/lib/src/screens/dashboard/dashboard_page.dart index fa7819f2f..a379d22ed 100644 --- a/lib/src/screens/dashboard/dashboard_page.dart +++ b/lib/src/screens/dashboard/dashboard_page.dart @@ -18,14 +18,15 @@ import 'package:cake_wallet/src/stores/action_list/date_section_item.dart'; import 'package:cake_wallet/src/stores/action_list/trade_list_item.dart'; import 'package:cake_wallet/src/stores/action_list/transaction_list_item.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; -import 'package:cake_wallet/src/screens/dashboard/date_section_raw.dart'; -import 'package:cake_wallet/src/screens/dashboard/trade_row.dart'; -import 'package:cake_wallet/src/screens/dashboard/transaction_raw.dart'; +import 'package:cake_wallet/src/screens/dashboard/widgets/date_section_raw.dart'; +import 'package:cake_wallet/src/screens/dashboard/widgets/trade_row.dart'; +import 'package:cake_wallet/src/screens/dashboard/widgets/transaction_raw.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/screens/dashboard/wallet_menu.dart'; import 'package:cake_wallet/src/widgets/picker.dart'; import 'package:cake_wallet/src/screens/dashboard/widgets/wallet_card.dart'; import 'package:cake_wallet/src/screens/dashboard/widgets/buttons_widget.dart'; +import 'package:cake_wallet/src/screens/dashboard/widgets/trade_history_panel.dart'; class DashboardPage extends BasePage { final _bodyKey = GlobalKey(); @@ -115,6 +116,7 @@ class DashboardPageBody extends StatefulWidget { } class DashboardPageBodyState extends State { + final menuButton = Image.asset('assets/images/menu_button.png'); /*final _connectionStatusObserverKey = GlobalKey(); final _balanceObserverKey = GlobalKey(); final _balanceTitleObserverKey = GlobalKey(); @@ -136,7 +138,27 @@ class DashboardPageBodyState extends State { child: Column( children: [ Padding( - padding: EdgeInsets.only(left: 20, top: 78), + padding: EdgeInsets.only(top: 14), + child: Container( + width: double.infinity, + alignment: Alignment.centerRight, + child: SizedBox( + height: 37, + width: 37, + child: ButtonTheme( + minWidth: double.minPositive, + child: FlatButton( + highlightColor: Colors.transparent, + splashColor: Colors.transparent, + padding: EdgeInsets.all(0), + onPressed: () {}, + child: menuButton), + ), + ), + ) + ), + Padding( + padding: EdgeInsets.only(left: 20, top: 23), child: WalletCard(), ), Padding( @@ -144,8 +166,7 @@ class DashboardPageBodyState extends State { child: ButtonsWidget(), ), Expanded( - child: Container( - ) + child: TradeHistoryPanel() ) ], ), diff --git a/lib/src/screens/dashboard/date_section_raw.dart b/lib/src/screens/dashboard/widgets/date_section_raw.dart similarity index 89% rename from lib/src/screens/dashboard/date_section_raw.dart rename to lib/src/screens/dashboard/widgets/date_section_raw.dart index 86fc3ff06..edbc5c854 100644 --- a/lib/src/screens/dashboard/date_section_raw.dart +++ b/lib/src/screens/dashboard/widgets/date_section_raw.dart @@ -20,8 +20,8 @@ class DateSectionRaw extends StatelessWidget { final settingsStore = Provider.of(context); final currentLanguage = settingsStore.languageCode; final dateSectionDateFormat = settingsStore.getCurrentDateFormat( - formatUSA: "MMM d", - formatDefault: "d MMM"); + formatUSA: "yyyy MMM d", + formatDefault: "d MMM yyyy"); var title = ""; if (isToday) { @@ -39,7 +39,7 @@ class DateSectionRaw extends StatelessWidget { padding: const EdgeInsets.only(top: 10, bottom: 10), child: Center( child: Text(title, - style: TextStyle(fontSize: 16, color: Palette.wildDarkBlue))), + style: TextStyle(fontSize: 12, color: PaletteDark.historyPanelText))), ); } } diff --git a/lib/src/screens/dashboard/widgets/trade_history_panel.dart b/lib/src/screens/dashboard/widgets/trade_history_panel.dart new file mode 100644 index 000000000..2f4fad150 --- /dev/null +++ b/lib/src/screens/dashboard/widgets/trade_history_panel.dart @@ -0,0 +1,179 @@ +import 'dart:async'; +import 'package:cake_wallet/src/domain/common/balance_display_mode.dart'; +import 'package:cake_wallet/src/stores/action_list/action_list_store.dart'; +import 'package:cake_wallet/src/stores/action_list/date_section_item.dart'; +import 'package:cake_wallet/src/stores/action_list/trade_list_item.dart'; +import 'package:cake_wallet/src/stores/action_list/transaction_list_item.dart'; +import 'package:cake_wallet/src/stores/settings/settings_store.dart'; +import 'package:flutter/material.dart'; +import 'package:cake_wallet/palette.dart'; +import 'package:cake_wallet/generated/i18n.dart'; +import 'package:flutter_mobx/flutter_mobx.dart'; +import 'package:intl/intl.dart'; +import 'package:provider/provider.dart'; +import 'package:cake_wallet/routes.dart'; +import 'date_section_raw.dart'; +import 'trade_row.dart'; +import 'transaction_raw.dart'; + +class TradeHistoryPanel extends StatefulWidget { + @override + TradeHistoryPanelState createState() => TradeHistoryPanelState(); +} + +class TradeHistoryPanelState extends State { + final _listObserverKey = GlobalKey(); + final _listKey = GlobalKey(); + + double panelHeight; + double screenHeight; + double opacity; + bool isDraw; + + @override + void initState() { + panelHeight = 0; + screenHeight = 0; + opacity = 0; + isDraw = false; + super.initState(); + WidgetsBinding.instance.addPostFrameCallback(afterLayout); + } + + void afterLayout(dynamic _) { + screenHeight = MediaQuery.of(context).size.height; + setState(() { + panelHeight = screenHeight; + opacity = 1; + }); + Timer(Duration(milliseconds: 350), () => + setState(() => isDraw = true) + ); + } + + @override + Widget build(BuildContext context) { + final actionListStore = Provider.of(context); + final settingsStore = Provider.of(context); + final transactionDateFormat = DateFormat("HH:mm"); + final filterButton = Image.asset('assets/images/filter_button.png'); + + return Container( + width: double.infinity, + alignment: Alignment.bottomCenter, + child: AnimatedContainer( + width: double.infinity, + height: panelHeight, + duration: Duration(milliseconds: 1000), + curve: Curves.fastOutSlowIn, + decoration: BoxDecoration( + borderRadius: BorderRadius.only(topLeft: Radius.circular(20), topRight: Radius.circular(20)), + color: PaletteDark.historyPanel.withOpacity(opacity), + ), + child: isDraw + ? Container( + padding: EdgeInsets.only(top: 20, left: 20, right: 20), + child: Column( + children: [ + Container( + width: double.infinity, + height: 36, + margin: EdgeInsets.only(bottom: 10), + child: Stack( + alignment: Alignment.center, + children: [ + Text( + S.of(context).trade_history_title, + style: TextStyle( + fontSize: 20 + ), + ), + Positioned( + right: 0, + child: GestureDetector( + onTap: () {}, + child: filterButton, + ) + ) + ], + ), + ), + Observer( + key: _listObserverKey, + builder: (_) { + final items = actionListStore.items == null + ? [] + : actionListStore.items; + final itemsCount = items.length; + final symbol = settingsStore.fiatCurrency.toString(); + + return Expanded( + child: ListView.builder( + key: _listKey, + padding: EdgeInsets.only(bottom: 15), + itemCount: itemsCount, + itemBuilder: (context, index) { + + final item = items[index]; + + if (item is DateSectionItem) { + return DateSectionRaw(date: item.date); + } + + if (item is TransactionListItem) { + final transaction = item.transaction; + final savedDisplayMode = settingsStore.balanceDisplayMode; + final formattedAmount = + savedDisplayMode == BalanceDisplayMode.hiddenBalance + ? '---' + : transaction.amountFormatted(); + final formattedFiatAmount = + savedDisplayMode == BalanceDisplayMode.hiddenBalance + ? '---' + : transaction.fiatAmount(symbol); + + return TransactionRow( + onTap: () => Navigator.of(context).pushNamed( + Routes.transactionDetails, + arguments: transaction), + direction: transaction.direction, + formattedDate: + transactionDateFormat.format(transaction.date), + formattedAmount: formattedAmount, + formattedFiatAmount: formattedFiatAmount, + isPending: transaction.isPending); + } + + if (item is TradeListItem) { + final trade = item.trade; + final savedDisplayMode = settingsStore.balanceDisplayMode; + final formattedAmount = trade.amount != null + ? savedDisplayMode == BalanceDisplayMode.hiddenBalance + ? '---' + : trade.amountFormatted() + : trade.amount; + + return TradeRow( + onTap: () => Navigator.of(context) + .pushNamed(Routes.tradeDetails, arguments: trade), + provider: trade.provider, + from: trade.from, + to: trade.to, + createdAtFormattedDate: + transactionDateFormat.format(trade.createdAt), + formattedAmount: formattedAmount); + } + + return Container(); + } + ) + ); + }) + ], + ), + ) + : Offstage() + ), + ); + } +} \ No newline at end of file diff --git a/lib/src/screens/dashboard/trade_row.dart b/lib/src/screens/dashboard/widgets/trade_row.dart similarity index 71% rename from lib/src/screens/dashboard/trade_row.dart rename to lib/src/screens/dashboard/widgets/trade_row.dart index 75a3371bd..ce603c359 100644 --- a/lib/src/screens/dashboard/trade_row.dart +++ b/lib/src/screens/dashboard/widgets/trade_row.dart @@ -21,25 +21,25 @@ class TradeRow extends StatelessWidget { @override Widget build(BuildContext context) { - final amountCrypto = provider == ExchangeProviderDescription.xmrto - ? to.toString() - : from.toString(); + final amountCrypto = from.toString(); return InkWell( onTap: onTap, child: Container( - padding: EdgeInsets.only(top: 14, bottom: 14, left: 20, right: 20), - decoration: BoxDecoration( - border: Border( - bottom: BorderSide( - color: PaletteDark.darkGrey, - width: 0.5, - style: BorderStyle.solid))), + padding: EdgeInsets.only(top: 5, bottom: 5), child: Row(children: [ - _getPoweredImage(provider), + Container( + height: 36, + width: 36, + decoration: BoxDecoration( + shape: BoxShape.circle, + color: PaletteDark.historyPanelButton + ), + child: _getPoweredImage(provider), + ), Expanded( child: Padding( - padding: const EdgeInsets.only(left: 10, right: 10), + padding: const EdgeInsets.only(left: 10), child: Column( children: [ Row( @@ -48,23 +48,20 @@ class TradeRow extends StatelessWidget { Text('${from.toString()} → ${to.toString()}', style: TextStyle( fontSize: 16, - color: Theme.of(context) - .primaryTextTheme - .subhead - .color)), + )), formattedAmount != null ? Text(formattedAmount + ' ' + amountCrypto, style: const TextStyle( - fontSize: 16, color: Palette.purpleBlue)) + fontSize: 16)) : Container() ]), - SizedBox(height: 6), + SizedBox(height: 5), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Text(createdAtFormattedDate, style: const TextStyle( - fontSize: 13, color: Palette.blueGrey)) + fontSize: 14, color: PaletteDark.historyPanelText)) ]), ], ), diff --git a/lib/src/screens/dashboard/transaction_raw.dart b/lib/src/screens/dashboard/widgets/transaction_raw.dart similarity index 60% rename from lib/src/screens/dashboard/transaction_raw.dart rename to lib/src/screens/dashboard/widgets/transaction_raw.dart index 383db5218..bf970cd27 100644 --- a/lib/src/screens/dashboard/transaction_raw.dart +++ b/lib/src/screens/dashboard/widgets/transaction_raw.dart @@ -24,24 +24,25 @@ class TransactionRow extends StatelessWidget { return InkWell( onTap: onTap, child: Container( - padding: EdgeInsets.only(top: 14, bottom: 14, left: 20, right: 20), - decoration: BoxDecoration( - border: Border( - bottom: BorderSide( - color: PaletteDark.darkGrey, - width: 0.5, - style: BorderStyle.solid))), + padding: EdgeInsets.only(top: 5, bottom: 5), child: Row(children: [ - Image.asset( - direction == TransactionDirection.incoming - ? 'assets/images/transaction_incoming.png' - : 'assets/images/transaction_outgoing.png', - height: 25, - width: 25), + Container( + height: 36, + width: 36, + decoration: BoxDecoration( + shape: BoxShape.circle, + color: PaletteDark.historyPanelButton + ), + child: Image.asset( + direction == TransactionDirection.incoming + ? 'assets/images/down_arrow.png' + : 'assets/images/up_arrow.png'), + ), Expanded( child: Padding( - padding: const EdgeInsets.only(left: 10, right: 10), + padding: const EdgeInsets.only(left: 10), child: Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, @@ -53,24 +54,25 @@ class TransactionRow extends StatelessWidget { (isPending ? S.of(context).pending : ''), style: TextStyle( fontSize: 16, - color: Theme.of(context) - .primaryTextTheme - .subhead - .color)), - Text(formattedAmount, + )), + Text(direction == TransactionDirection.incoming + ? formattedAmount + : '- ' + formattedAmount, style: const TextStyle( - fontSize: 16, color: Palette.purpleBlue)) + fontSize: 16)) ]), - SizedBox(height: 6), + SizedBox(height: 5,), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Text(formattedDate, style: const TextStyle( - fontSize: 13, color: Palette.blueGrey)), - Text(formattedFiatAmount, + fontSize: 14, color: PaletteDark.historyPanelText)), + Text(direction == TransactionDirection.incoming + ? formattedFiatAmount + : '- ' + formattedFiatAmount, style: const TextStyle( - fontSize: 14, color: Palette.blueGrey)) + fontSize: 14, color: PaletteDark.historyPanelText)) ]), ], ), From 2a18f4a1e40a272f31cbaa2bdb17befe62137a31 Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Fri, 17 Apr 2020 22:40:11 +0300 Subject: [PATCH 05/11] CWA-198 | removed buttons_widget, fixed wallet_card, trade_history_panel, date_section_raw, trade_raw, transaction_raw and dashboard_page --- lib/generated/i18n.dart | 23 + lib/src/screens/dashboard/dashboard_page.dart | 590 +----------------- .../dashboard/widgets/buttons_widget.dart | 118 ---- .../dashboard/widgets/date_section_raw.dart | 11 +- .../widgets/trade_history_panel.dart | 476 +++++++++++--- .../screens/dashboard/widgets/trade_row.dart | 8 +- .../dashboard/widgets/transaction_raw.dart | 8 +- .../dashboard/widgets/wallet_card.dart | 36 +- res/values/strings_de.arb | 3 +- res/values/strings_en.arb | 3 +- res/values/strings_es.arb | 3 +- res/values/strings_hi.arb | 3 +- res/values/strings_ja.arb | 3 +- res/values/strings_ko.arb | 3 +- res/values/strings_nl.arb | 3 +- res/values/strings_pl.arb | 3 +- res/values/strings_pt.arb | 3 +- res/values/strings_ru.arb | 3 +- res/values/strings_uk.arb | 3 +- res/values/strings_zh.arb | 3 +- 20 files changed, 474 insertions(+), 832 deletions(-) delete mode 100644 lib/src/screens/dashboard/widgets/buttons_widget.dart diff --git a/lib/generated/i18n.dart b/lib/generated/i18n.dart index 845145783..99ece7cc0 100644 --- a/lib/generated/i18n.dart +++ b/lib/generated/i18n.dart @@ -39,6 +39,7 @@ class S implements WidgetsLocalizations { String get authentication => "Authentication"; String get available_balance => "Available Balance"; String get biometric_auth_reason => "Scan your fingerprint to authenticate"; + String get buy => "Buy"; String get cancel => "Cancel"; String get card_address => "Address:"; String get change => "Change"; @@ -439,6 +440,8 @@ class $de extends S { @override String get trade_details_fetching => "Holen"; @override + String get buy => "Kaufen"; + @override String get confirm_sending => "Bestätigen Sie das Senden"; @override String get settings_title => "die Einstellungen"; @@ -1009,6 +1012,8 @@ class $hi extends S { @override String get trade_details_fetching => "ला रहा है"; @override + String get buy => "खरीदें"; + @override String get confirm_sending => "भेजने की पुष्टि करें"; @override String get settings_title => "सेटिंग्स"; @@ -1579,6 +1584,8 @@ class $ru extends S { @override String get trade_details_fetching => "Получение"; @override + String get buy => "Купить"; + @override String get confirm_sending => "Подтвердить отправку"; @override String get settings_title => "Настройки"; @@ -2149,6 +2156,8 @@ class $ko extends S { @override String get trade_details_fetching => "가져 오는 중"; @override + String get buy => "구입"; + @override String get confirm_sending => "전송 확인"; @override String get settings_title => "설정"; @@ -2719,6 +2728,8 @@ class $pt extends S { @override String get trade_details_fetching => "Buscando"; @override + String get buy => "Comprar"; + @override String get confirm_sending => "Confirmar o envio"; @override String get settings_title => "Configurações"; @@ -3289,6 +3300,8 @@ class $uk extends S { @override String get trade_details_fetching => "Отримання"; @override + String get buy => "Купити"; + @override String get confirm_sending => "Підтвердити відправлення"; @override String get settings_title => "Налаштування"; @@ -3859,6 +3872,8 @@ class $ja extends S { @override String get trade_details_fetching => "フェッチング"; @override + String get buy => "購入"; + @override String get confirm_sending => "送信を確認"; @override String get settings_title => "設定"; @@ -4433,6 +4448,8 @@ class $pl extends S { @override String get trade_details_fetching => "Ujmujący"; @override + String get buy => "Kup"; + @override String get confirm_sending => "Potwierdź wysłanie"; @override String get settings_title => "Ustawienia"; @@ -5003,6 +5020,8 @@ class $es extends S { @override String get trade_details_fetching => "Cargando"; @override + String get buy => "Comprar"; + @override String get confirm_sending => "Confirmar envío"; @override String get settings_title => "Configuraciones"; @@ -5573,6 +5592,8 @@ class $nl extends S { @override String get trade_details_fetching => "Ophalen"; @override + String get buy => "Kopen"; + @override String get confirm_sending => "Bevestig verzending"; @override String get settings_title => "Instellingen"; @@ -6143,6 +6164,8 @@ class $zh extends S { @override String get trade_details_fetching => "正在取得"; @override + String get buy => "購買"; + @override String get confirm_sending => "确认发送"; @override String get settings_title => "设定值"; diff --git a/lib/src/screens/dashboard/dashboard_page.dart b/lib/src/screens/dashboard/dashboard_page.dart index a379d22ed..eca98a9e9 100644 --- a/lib/src/screens/dashboard/dashboard_page.dart +++ b/lib/src/screens/dashboard/dashboard_page.dart @@ -1,111 +1,18 @@ -import 'package:provider/provider.dart'; -import 'package:date_range_picker/date_range_picker.dart' as date_rage_picker; import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; -import 'package:flutter_mobx/flutter_mobx.dart'; -import 'package:cake_wallet/routes.dart'; import 'package:cake_wallet/palette.dart'; -import 'package:cake_wallet/generated/i18n.dart'; -import 'package:cake_wallet/src/domain/common/balance_display_mode.dart'; -import 'package:cake_wallet/src/domain/common/sync_status.dart'; -import 'package:cake_wallet/src/domain/exchange/exchange_provider_description.dart'; -import 'package:cake_wallet/src/stores/action_list/action_list_store.dart'; -import 'package:cake_wallet/src/stores/balance/balance_store.dart'; -import 'package:cake_wallet/src/stores/sync/sync_store.dart'; -import 'package:cake_wallet/src/stores/settings/settings_store.dart'; -import 'package:cake_wallet/src/stores/wallet/wallet_store.dart'; -import 'package:cake_wallet/src/stores/action_list/date_section_item.dart'; -import 'package:cake_wallet/src/stores/action_list/trade_list_item.dart'; -import 'package:cake_wallet/src/stores/action_list/transaction_list_item.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; -import 'package:cake_wallet/src/screens/dashboard/widgets/date_section_raw.dart'; -import 'package:cake_wallet/src/screens/dashboard/widgets/trade_row.dart'; -import 'package:cake_wallet/src/screens/dashboard/widgets/transaction_raw.dart'; -import 'package:cake_wallet/src/widgets/primary_button.dart'; -import 'package:cake_wallet/src/screens/dashboard/wallet_menu.dart'; -import 'package:cake_wallet/src/widgets/picker.dart'; import 'package:cake_wallet/src/screens/dashboard/widgets/wallet_card.dart'; -import 'package:cake_wallet/src/screens/dashboard/widgets/buttons_widget.dart'; import 'package:cake_wallet/src/screens/dashboard/widgets/trade_history_panel.dart'; class DashboardPage extends BasePage { final _bodyKey = GlobalKey(); - /*@override - Widget leading(BuildContext context) { - return SizedBox( - width: 30, - child: FlatButton( - padding: EdgeInsets.all(0), - onPressed: () => _presentWalletMenu(context), - child: Image.asset('assets/images/more.png', - color: Theme.of(context).primaryTextTheme.caption.color, - width: 30))); - } - - @override - Widget middle(BuildContext context) { - final walletStore = Provider.of(context); - - return Observer(builder: (_) { - return Column( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Text( - walletStore.name, - style: TextStyle( - color: Theme.of(context).primaryTextTheme.title.color), - ), - SizedBox(height: 5), - Text( - walletStore.account != null ? '${walletStore.account.label}' : '', - style: TextStyle( - fontWeight: FontWeight.w400, - fontSize: 10, - color: Theme.of(context).primaryTextTheme.title.color), - ), - ]); - }); - } - - @override - Widget trailing(BuildContext context) { - return SizedBox( - width: 20, - child: FlatButton( - padding: EdgeInsets.all(0), - onPressed: () => Navigator.of(context).pushNamed(Routes.settings), - child: Image.asset('assets/images/settings_icon.png', - color: Colors.grey, height: 20)), - ); - }*/ @override ObstructingPreferredSizeWidget appBar(BuildContext context) => null; @override Widget body(BuildContext context) => DashboardPageBody(key: _bodyKey); - - /*@override - Widget floatingActionButton(BuildContext context) => FloatingActionButton( - child: Image.asset('assets/images/exchange_icon.png', - color: Colors.white, height: 26, width: 22), - backgroundColor: Palette.floatingActionButton, - onPressed: () async => await Navigator.of(context, rootNavigator: true) - .pushNamed(Routes.exchange)); - - void _presentWalletMenu(BuildContext bodyContext) { - final walletMenu = WalletMenu(bodyContext); - - showDialog( - builder: (_) => Picker( - items: walletMenu.items, - selectedAtIndex: -1, - title: S.of(bodyContext).wallet_menu, - pickerHeight: 510, - onItemSelected: (String item) => - walletMenu.action(walletMenu.items.indexOf(item))), - context: bodyContext); - }*/ } class DashboardPageBody extends StatefulWidget { @@ -117,12 +24,6 @@ class DashboardPageBody extends StatefulWidget { class DashboardPageBodyState extends State { final menuButton = Image.asset('assets/images/menu_button.png'); - /*final _connectionStatusObserverKey = GlobalKey(); - final _balanceObserverKey = GlobalKey(); - final _balanceTitleObserverKey = GlobalKey(); - final _syncingObserverKey = GlobalKey(); - final _listObserverKey = GlobalKey(); - final _listKey = GlobalKey();*/ @override Widget build(BuildContext context) { @@ -161,491 +62,22 @@ class DashboardPageBodyState extends State { padding: EdgeInsets.only(left: 20, top: 23), child: WalletCard(), ), - Padding( - padding: EdgeInsets.only(top: 28), - child: ButtonsWidget(), - ), Expanded( - child: TradeHistoryPanel() + child: Stack( + alignment: Alignment.topCenter, + fit: StackFit.expand, + children: [ + Positioned( + top: 28, + left: 0, + child: TradeHistoryPanel() + ), + ], + ) ) ], ), ), ); - - /*final balanceStore = Provider.of(context); - final actionListStore = Provider.of(context); - final syncStore = Provider.of(context); - final settingsStore = Provider.of(context); - final transactionDateFormat = settingsStore.getCurrentDateFormat( - formatUSA: "MMMM d, yyyy, HH:mm", - formatDefault: "d MMMM yyyy, HH:mm"); - - return Observer( - key: _listObserverKey, - builder: (_) { - final items = actionListStore.items == null - ? [] - : actionListStore.items; - final itemsCount = items.length + 2; - - return ListView.builder( - key: _listKey, - padding: EdgeInsets.only(bottom: 15), - itemCount: itemsCount, - itemBuilder: (context, index) { - if (index == 0) { - return Container( - margin: EdgeInsets.only(bottom: 20), - decoration: BoxDecoration( - color: Theme.of(context).backgroundColor, - boxShadow: [ - BoxShadow( - color: Palette.shadowGreyWithOpacity, - blurRadius: 10, - offset: Offset(0, 12)) - ]), - child: Column( - children: [ - Observer( - key: _syncingObserverKey, - builder: (_) { - final status = syncStore.status; - final statusText = status.title(); - final progress = syncStore.status.progress(); - final isFialure = status is FailedSyncStatus; - - var descriptionText = ''; - - if (status is SyncingSyncStatus) { - descriptionText = S - .of(context) - .Blocks_remaining( - syncStore.status.toString()); - } - - if (status is FailedSyncStatus) { - descriptionText = S - .of(context) - .please_try_to_connect_to_another_node; - } - - return Container( - child: Column( - children: [ - SizedBox( - height: 3, - child: LinearProgressIndicator( - backgroundColor: Palette.separator, - valueColor: - AlwaysStoppedAnimation( - Palette.cakeGreen), - value: progress, - ), - ), - SizedBox(height: 10), - Text(statusText, - style: TextStyle( - fontSize: 14, - fontWeight: FontWeight.bold, - color: isFialure - ? Palette.failure - : Palette.cakeGreen)), - Text(descriptionText, - style: TextStyle( - fontSize: 11, - color: Palette.wildDarkBlue, - height: 2.0)) - ], - ), - ); - }), - GestureDetector( - onTapUp: (_) => balanceStore.isReversing = false, - onTapDown: (_) => balanceStore.isReversing = true, - child: Container( - padding: EdgeInsets.only(top: 40, bottom: 40), - color: Colors.transparent, - child: Column( - children: [ - Container(width: double.infinity), - Observer( - key: _balanceTitleObserverKey, - builder: (_) { - final savedDisplayMode = - settingsStore.balanceDisplayMode; - final displayMode = balanceStore - .isReversing - ? (savedDisplayMode == - BalanceDisplayMode - .availableBalance - ? BalanceDisplayMode.fullBalance - : BalanceDisplayMode - .availableBalance) - : savedDisplayMode; - - return Text(displayMode.toString(), - style: TextStyle( - color: Palette.violet, - fontSize: 16)); - }), - Observer( - key: _connectionStatusObserverKey, - builder: (_) { - final savedDisplayMode = - settingsStore.balanceDisplayMode; - var balance = '---'; - final displayMode = balanceStore - .isReversing - ? (savedDisplayMode == - BalanceDisplayMode - .availableBalance - ? BalanceDisplayMode.fullBalance - : BalanceDisplayMode - .availableBalance) - : savedDisplayMode; - - if (displayMode == - BalanceDisplayMode.availableBalance) { - balance = - balanceStore.unlockedBalance ?? - '0.0'; - } - - if (displayMode == - BalanceDisplayMode.fullBalance) { - balance = - balanceStore.fullBalance ?? '0.0'; - } - - return Text( - balance, - style: TextStyle( - color: Theme.of(context) - .primaryTextTheme - .caption - .color, - fontSize: 42), - ); - }), - Padding( - padding: EdgeInsets.only(top: 7), - child: Observer( - key: _balanceObserverKey, - builder: (_) { - final savedDisplayMode = - settingsStore.balanceDisplayMode; - final displayMode = - balanceStore.isReversing - ? (savedDisplayMode == - BalanceDisplayMode - .availableBalance - ? BalanceDisplayMode - .fullBalance - : BalanceDisplayMode - .availableBalance) - : savedDisplayMode; - final symbol = settingsStore - .fiatCurrency - .toString(); - var balance = '---'; - - if (displayMode == - BalanceDisplayMode - .availableBalance) { - balance = - '${balanceStore.fiatUnlockedBalance} $symbol'; - } - - if (displayMode == - BalanceDisplayMode.fullBalance) { - balance = - '${balanceStore.fiatFullBalance} $symbol'; - } - - return Text(balance, - style: TextStyle( - color: Palette.wildDarkBlue, - fontSize: 16)); - })) - ], - ), - ), - ), - Padding( - padding: const EdgeInsets.only( - left: 20, right: 20, bottom: 30), - child: Container( - child: Row( - mainAxisAlignment: - MainAxisAlignment.spaceBetween, - children: [ - Expanded( - child: PrimaryImageButton( - image: Image.asset( - 'assets/images/send_icon.png', - height: 25, - width: 25), - text: S.of(context).send, - onPressed: () => Navigator.of(context, - rootNavigator: true) - .pushNamed(Routes.send), - color: Theme.of(context) - .primaryTextTheme - .button - .backgroundColor, - borderColor: Theme.of(context) - .primaryTextTheme - .button - .decorationColor, - )), - SizedBox(width: 10), - Expanded( - child: PrimaryImageButton( - image: Image.asset( - 'assets/images/receive_icon.png', - height: 25, - width: 25), - text: S.of(context).receive, - onPressed: () => Navigator.of(context, - rootNavigator: true) - .pushNamed(Routes.receive), - color: Theme.of(context) - .accentTextTheme - .caption - .backgroundColor, - borderColor: Theme.of(context) - .accentTextTheme - .caption - .decorationColor, - )) - ], - ), - )), - ], - ), - ); - } - - if (index == 1 && actionListStore.totalCount > 0) { - return Padding( - padding: EdgeInsets.only(right: 20, top: 10, bottom: 20), - child: Row( - mainAxisAlignment: MainAxisAlignment.end, - children: [ - PopupMenuButton( - itemBuilder: (context) => [ - PopupMenuItem( - enabled: false, - value: -1, - child: Text(S.of(context).transactions, - style: TextStyle( - fontWeight: FontWeight.bold, - color: Theme.of(context).primaryTextTheme.caption.color))), - PopupMenuItem( - value: 0, - child: Observer( - builder: (_) => Row( - mainAxisAlignment: - MainAxisAlignment - .spaceBetween, - children: [ - Text(S.of(context).incoming), - Checkbox( - value: actionListStore - .transactionFilterStore - .displayIncoming, - onChanged: (value) => - actionListStore - .transactionFilterStore - .toggleIncoming(), - ) - ]))), - PopupMenuItem( - value: 1, - child: Observer( - builder: (_) => Row( - mainAxisAlignment: - MainAxisAlignment - .spaceBetween, - children: [ - Text(S.of(context).outgoing), - Checkbox( - value: actionListStore - .transactionFilterStore - .displayOutgoing, - onChanged: (value) => - actionListStore - .transactionFilterStore - .toggleOutgoing(), - ) - ]))), - PopupMenuItem( - value: 2, - child: - Text(S.of(context).transactions_by_date)), - PopupMenuDivider(), - PopupMenuItem( - enabled: false, - value: -1, - child: Text(S.of(context).trades, - style: TextStyle( - fontWeight: FontWeight.bold, - color: Theme.of(context).primaryTextTheme.caption.color))), - PopupMenuItem( - value: 3, - child: Observer( - builder: (_) => Row( - mainAxisAlignment: - MainAxisAlignment - .spaceBetween, - children: [ - Text('XMR.TO'), - Checkbox( - value: actionListStore - .tradeFilterStore - .displayXMRTO, - onChanged: (value) => - actionListStore - .tradeFilterStore - .toggleDisplayExchange( - ExchangeProviderDescription - .xmrto), - ) - ]))), - PopupMenuItem( - value: 4, - child: Observer( - builder: (_) => Row( - mainAxisAlignment: - MainAxisAlignment - .spaceBetween, - children: [ - Text('Change.NOW'), - Checkbox( - value: actionListStore - .tradeFilterStore - .displayChangeNow, - onChanged: (value) => - actionListStore - .tradeFilterStore - .toggleDisplayExchange( - ExchangeProviderDescription - .changeNow), - ) - ]))), - PopupMenuItem( - value: 5, - child: Observer( - builder: (_) => Row( - mainAxisAlignment: - MainAxisAlignment - .spaceBetween, - children: [ - Text('MorphToken'), - Checkbox( - value: actionListStore - .tradeFilterStore - .displayMorphToken, - onChanged: (value) => - actionListStore - .tradeFilterStore - .toggleDisplayExchange( - ExchangeProviderDescription - .morphToken), - ) - ]))) - ], - child: Text(S.of(context).filters, - style: TextStyle( - fontSize: 16.0, - color: Theme.of(context) - .primaryTextTheme - .subtitle - .color)), - onSelected: (item) async { - if (item == 2) { - final List picked = - await date_rage_picker.showDatePicker( - context: context, - initialFirstDate: DateTime.now() - .subtract(Duration(days: 1)), - initialLastDate: (DateTime.now()), - firstDate: DateTime(2015), - lastDate: DateTime.now() - .add(Duration(days: 1))); - - if (picked != null && picked.length == 2) { - actionListStore.transactionFilterStore - .changeStartDate(picked.first); - actionListStore.transactionFilterStore - .changeEndDate(picked.last); - } - } - }, - ) - ]), - ); - } - - index -= 2; - - if (index < 0 || index >= items.length) { - return Container(); - } - - final item = items[index]; - - if (item is DateSectionItem) { - return DateSectionRaw(date: item.date); - } - - if (item is TransactionListItem) { - final transaction = item.transaction; - final savedDisplayMode = settingsStore.balanceDisplayMode; - final formattedAmount = - savedDisplayMode == BalanceDisplayMode.hiddenBalance - ? '---' - : transaction.amountFormatted(); - final formattedFiatAmount = - savedDisplayMode == BalanceDisplayMode.hiddenBalance - ? '---' - : transaction.fiatAmount(); - - return TransactionRow( - onTap: () => Navigator.of(context).pushNamed( - Routes.transactionDetails, - arguments: transaction), - direction: transaction.direction, - formattedDate: - transactionDateFormat.format(transaction.date), - formattedAmount: formattedAmount, - formattedFiatAmount: formattedFiatAmount, - isPending: transaction.isPending); - } - - if (item is TradeListItem) { - final trade = item.trade; - final savedDisplayMode = settingsStore.balanceDisplayMode; - final formattedAmount = trade.amount != null - ? savedDisplayMode == BalanceDisplayMode.hiddenBalance - ? '---' - : trade.amountFormatted() - : trade.amount; - - return TradeRow( - onTap: () => Navigator.of(context) - .pushNamed(Routes.tradeDetails, arguments: trade), - provider: trade.provider, - from: trade.from, - to: trade.to, - createdAtFormattedDate: - transactionDateFormat.format(trade.createdAt), - formattedAmount: formattedAmount); - } - - return Container(); - }); - });*/ } } diff --git a/lib/src/screens/dashboard/widgets/buttons_widget.dart b/lib/src/screens/dashboard/widgets/buttons_widget.dart deleted file mode 100644 index cef410fdf..000000000 --- a/lib/src/screens/dashboard/widgets/buttons_widget.dart +++ /dev/null @@ -1,118 +0,0 @@ -import 'dart:async'; -import 'package:flutter/material.dart'; -import 'package:cake_wallet/palette.dart'; -import 'package:cake_wallet/generated/i18n.dart'; -import 'package:cake_wallet/routes.dart'; - -class ButtonsWidget extends StatefulWidget { - @override - ButtonsWidgetState createState() => ButtonsWidgetState(); -} - -class ButtonsWidgetState extends State { - final sendImage = Image.asset('assets/images/send.png'); - final exchangeImage = Image.asset('assets/images/exchange.png'); - final buyImage = Image.asset('assets/images/coins.png'); - - double height; - bool isDraw; - - @override - void initState() { - height = 0; - isDraw = false; - super.initState(); - WidgetsBinding.instance.addPostFrameCallback(afterLayout); - } - - void afterLayout(dynamic _) { - setState(() => height = 108); - Timer(Duration(milliseconds: 250), () => - setState(() => isDraw = true) - ); - } - - @override - Widget build(BuildContext context) { - return Container( - height: 108, - padding: EdgeInsets.only(left: 44, right: 44), - alignment: Alignment.bottomCenter, - child: AnimatedContainer( - height: height, - duration: Duration(milliseconds: 500), - curve: Curves.fastOutSlowIn, - child: isDraw - ? Row( - children: [ - Flexible( - child: actionButton( - image: sendImage, - title: S.of(context).send, - route: Routes.send - ) - ), - Flexible( - child: actionButton( - image: exchangeImage, - title: S.of(context).exchange, - route: Routes.exchange - ) - ), - Flexible( - child: actionButton( - image: buyImage, - title: 'Buy', - route: '' - ) - ) - ], - ) - : Offstage(), - ), - ); - } - - Widget actionButton({ - @required Image image, - @required String title, - @required String route}) { - - return Container( - width: double.infinity, - child: Column( - mainAxisAlignment: MainAxisAlignment.start, - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - GestureDetector( - onTap: () { - if (route.isNotEmpty) { - Navigator.of(context, rootNavigator: true).pushNamed(route); - } - }, - child: Container( - height: 48, - width: 48, - alignment: Alignment.center, - decoration: BoxDecoration( - color: Colors.white, - shape: BoxShape.circle - ), - child: image, - ), - ), - Padding( - padding: EdgeInsets.only(top: 10), - child: Text( - title, - style: TextStyle( - fontSize: 16, - color: PaletteDark.walletCardText - ), - ), - ) - ], - ), - ); - } -} \ No newline at end of file diff --git a/lib/src/screens/dashboard/widgets/date_section_raw.dart b/lib/src/screens/dashboard/widgets/date_section_raw.dart index edbc5c854..1fc0b4452 100644 --- a/lib/src/screens/dashboard/widgets/date_section_raw.dart +++ b/lib/src/screens/dashboard/widgets/date_section_raw.dart @@ -35,11 +35,12 @@ class DateSectionRaw extends StatelessWidget { title = dateSectionDateFormat.format(date); } - return Padding( - padding: const EdgeInsets.only(top: 10, bottom: 10), - child: Center( - child: Text(title, - style: TextStyle(fontSize: 12, color: PaletteDark.historyPanelText))), + return Container( + padding: EdgeInsets.only(top: 10, bottom: 10, left: 20, right: 20), + alignment: Alignment.center, + color: PaletteDark.historyPanel, + child: Text(title, + style: TextStyle(fontSize: 12, color: PaletteDark.historyPanelText)) ); } } diff --git a/lib/src/screens/dashboard/widgets/trade_history_panel.dart b/lib/src/screens/dashboard/widgets/trade_history_panel.dart index 2f4fad150..b1716c9de 100644 --- a/lib/src/screens/dashboard/widgets/trade_history_panel.dart +++ b/lib/src/screens/dashboard/widgets/trade_history_panel.dart @@ -1,10 +1,11 @@ -import 'dart:async'; import 'package:cake_wallet/src/domain/common/balance_display_mode.dart'; +import 'package:cake_wallet/src/domain/exchange/exchange_provider_description.dart'; import 'package:cake_wallet/src/stores/action_list/action_list_store.dart'; import 'package:cake_wallet/src/stores/action_list/date_section_item.dart'; import 'package:cake_wallet/src/stores/action_list/trade_list_item.dart'; import 'package:cake_wallet/src/stores/action_list/transaction_list_item.dart'; import 'package:cake_wallet/src/stores/settings/settings_store.dart'; +import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/palette.dart'; import 'package:cake_wallet/generated/i18n.dart'; @@ -15,6 +16,7 @@ import 'package:cake_wallet/routes.dart'; import 'date_section_raw.dart'; import 'trade_row.dart'; import 'transaction_raw.dart'; +import 'package:date_range_picker/date_range_picker.dart' as date_rage_picker; class TradeHistoryPanel extends StatefulWidget { @override @@ -27,15 +29,11 @@ class TradeHistoryPanelState extends State { double panelHeight; double screenHeight; - double opacity; - bool isDraw; @override void initState() { panelHeight = 0; screenHeight = 0; - opacity = 0; - isDraw = false; super.initState(); WidgetsBinding.instance.addPostFrameCallback(afterLayout); } @@ -44,11 +42,7 @@ class TradeHistoryPanelState extends State { screenHeight = MediaQuery.of(context).size.height; setState(() { panelHeight = screenHeight; - opacity = 1; }); - Timer(Duration(milliseconds: 350), () => - setState(() => isDraw = true) - ); } @override @@ -56,123 +50,399 @@ class TradeHistoryPanelState extends State { final actionListStore = Provider.of(context); final settingsStore = Provider.of(context); final transactionDateFormat = DateFormat("HH:mm"); - final filterButton = Image.asset('assets/images/filter_button.png'); return Container( - width: double.infinity, + height: MediaQuery.of(context).size.height, + width: MediaQuery.of(context).size.width, alignment: Alignment.bottomCenter, child: AnimatedContainer( - width: double.infinity, + width: MediaQuery.of(context).size.width, height: panelHeight, - duration: Duration(milliseconds: 1000), + duration: Duration(milliseconds: 500), curve: Curves.fastOutSlowIn, - decoration: BoxDecoration( - borderRadius: BorderRadius.only(topLeft: Radius.circular(20), topRight: Radius.circular(20)), - color: PaletteDark.historyPanel.withOpacity(opacity), - ), - child: isDraw - ? Container( - padding: EdgeInsets.only(top: 20, left: 20, right: 20), - child: Column( - children: [ - Container( - width: double.infinity, - height: 36, - margin: EdgeInsets.only(bottom: 10), - child: Stack( - alignment: Alignment.center, - children: [ - Text( - S.of(context).trade_history_title, - style: TextStyle( - fontSize: 20 - ), - ), - Positioned( - right: 0, - child: GestureDetector( - onTap: () {}, - child: filterButton, - ) - ) - ], - ), - ), - Observer( + child: CustomScrollView( + slivers: [ + SliverPersistentHeader( + delegate: ButtonHeader(), + pinned: true, + floating: false, + ), + Observer( key: _listObserverKey, builder: (_) { final items = actionListStore.items == null ? [] : actionListStore.items; - final itemsCount = items.length; + final itemsCount = items.length + 1; final symbol = settingsStore.fiatCurrency.toString(); + double freeSpaceHeight = MediaQuery.of(context).size.height - 496; // FIXME - return Expanded( - child: ListView.builder( - key: _listKey, - padding: EdgeInsets.only(bottom: 15), - itemCount: itemsCount, - itemBuilder: (context, index) { + return SliverList( + key: _listKey, + delegate: SliverChildBuilderDelegate( + (context, index) { - final item = items[index]; + if (index == itemsCount - 1) { + freeSpaceHeight = freeSpaceHeight >= 0 ? freeSpaceHeight : 0; - if (item is DateSectionItem) { - return DateSectionRaw(date: item.date); - } + return Container( + height: freeSpaceHeight, + width: MediaQuery.of(context).size.width, + color: PaletteDark.historyPanel, + ); + } - if (item is TransactionListItem) { - final transaction = item.transaction; - final savedDisplayMode = settingsStore.balanceDisplayMode; - final formattedAmount = - savedDisplayMode == BalanceDisplayMode.hiddenBalance - ? '---' - : transaction.amountFormatted(); - final formattedFiatAmount = - savedDisplayMode == BalanceDisplayMode.hiddenBalance - ? '---' - : transaction.fiatAmount(symbol); + final item = items[index]; - return TransactionRow( - onTap: () => Navigator.of(context).pushNamed( - Routes.transactionDetails, - arguments: transaction), - direction: transaction.direction, - formattedDate: - transactionDateFormat.format(transaction.date), - formattedAmount: formattedAmount, - formattedFiatAmount: formattedFiatAmount, - isPending: transaction.isPending); - } + if (item is DateSectionItem) { + freeSpaceHeight -= 32; // FIXME + return DateSectionRaw(date: item.date); + } - if (item is TradeListItem) { - final trade = item.trade; - final savedDisplayMode = settingsStore.balanceDisplayMode; - final formattedAmount = trade.amount != null - ? savedDisplayMode == BalanceDisplayMode.hiddenBalance - ? '---' - : trade.amountFormatted() - : trade.amount; + if (item is TransactionListItem) { + freeSpaceHeight -= 45; // FIXME + final transaction = item.transaction; + final savedDisplayMode = settingsStore.balanceDisplayMode; + final formattedAmount = + savedDisplayMode == BalanceDisplayMode.hiddenBalance + ? '---' + : transaction.amountFormatted(); + final formattedFiatAmount = + savedDisplayMode == BalanceDisplayMode.hiddenBalance + ? '---' + : transaction.fiatAmount(symbol); - return TradeRow( - onTap: () => Navigator.of(context) - .pushNamed(Routes.tradeDetails, arguments: trade), - provider: trade.provider, - from: trade.from, - to: trade.to, - createdAtFormattedDate: - transactionDateFormat.format(trade.createdAt), - formattedAmount: formattedAmount); - } + return TransactionRow( + onTap: () => Navigator.of(context).pushNamed( + Routes.transactionDetails, + arguments: transaction), + direction: transaction.direction, + formattedDate: + transactionDateFormat.format(transaction.date), + formattedAmount: formattedAmount, + formattedFiatAmount: formattedFiatAmount, + isPending: transaction.isPending); + } - return Container(); - } - ) + if (item is TradeListItem) { + freeSpaceHeight -= 45; // FIXME + final trade = item.trade; + final savedDisplayMode = settingsStore.balanceDisplayMode; + final formattedAmount = trade.amount != null + ? savedDisplayMode == BalanceDisplayMode.hiddenBalance + ? '---' + : trade.amountFormatted() + : trade.amount; + + return TradeRow( + onTap: () => Navigator.of(context) + .pushNamed(Routes.tradeDetails, arguments: trade), + provider: trade.provider, + from: trade.from, + to: trade.to, + createdAtFormattedDate: + transactionDateFormat.format(trade.createdAt), + formattedAmount: formattedAmount); + } + + return Container( + color: PaletteDark.historyPanel + ); + }, + + childCount: itemsCount + ) ); }) - ], - ), + ], ) - : Offstage() + ), + ); + } +} + +class ButtonHeader extends SliverPersistentHeaderDelegate { + final sendImage = Image.asset('assets/images/send.png'); + final exchangeImage = Image.asset('assets/images/exchange.png'); + final buyImage = Image.asset('assets/images/coins.png'); + final filterButton = Image.asset('assets/images/filter_button.png'); + + @override + Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) { + final actionListStore = Provider.of(context); + final historyPanelWidth = MediaQuery.of(context).size.width; + + double buttonsOpacity = 1 - shrinkOffset / (maxExtent - minExtent); + double buttonsHeight = maxExtent - minExtent - shrinkOffset; + + buttonsOpacity = buttonsOpacity >= 0 ? buttonsOpacity : 0; + buttonsHeight = buttonsHeight >= 0 ? buttonsHeight : 0; + + return Stack( + fit: StackFit.expand, + overflow: Overflow.visible, + children: [ + Opacity( + opacity: buttonsOpacity, + child: Container( + height: buttonsHeight, + padding: EdgeInsets.only(left: 44, right: 44), + child: Row( + children: [ + Flexible( + child: actionButton( + context: context, + image: sendImage, + title: S.of(context).send, + route: Routes.send + ) + ), + Flexible( + child: actionButton( + context: context, + image: exchangeImage, + title: S.of(context).exchange, + route: Routes.exchange + ) + ), + Flexible( + child: actionButton( + context: context, + image: buyImage, + title: S.of(context).buy, + route: '' + ) + ) + ], + ), + ), + ), + Positioned( + top: buttonsHeight, + left: 0, + child: Container( + width: historyPanelWidth, + height: 66, + padding: EdgeInsets.only(top: 20, left: 20, right: 20, bottom: 10), + decoration: BoxDecoration( + borderRadius: BorderRadius.only(topLeft: Radius.circular(20), topRight: Radius.circular(20)), + color: PaletteDark.historyPanel, + ), + child: Stack( + alignment: Alignment.center, + children: [ + Text( + S.of(context).trade_history_title, + style: TextStyle( + fontSize: 20, + color: Colors.white + ), + ), + Positioned( + right: 0, + child: PopupMenuButton( + itemBuilder: (context) => [ + PopupMenuItem( + enabled: false, + value: -1, + child: Text(S.of(context).transactions, + style: TextStyle( + fontWeight: FontWeight.bold, + color: Theme.of(context).primaryTextTheme.caption.color))), + PopupMenuItem( + value: 0, + child: Observer( + builder: (_) => Row( + mainAxisAlignment: + MainAxisAlignment + .spaceBetween, + children: [ + Text(S.of(context).incoming), + Checkbox( + value: actionListStore + .transactionFilterStore + .displayIncoming, + onChanged: (value) => + actionListStore + .transactionFilterStore + .toggleIncoming(), + ) + ]))), + PopupMenuItem( + value: 1, + child: Observer( + builder: (_) => Row( + mainAxisAlignment: + MainAxisAlignment + .spaceBetween, + children: [ + Text(S.of(context).outgoing), + Checkbox( + value: actionListStore + .transactionFilterStore + .displayOutgoing, + onChanged: (value) => + actionListStore + .transactionFilterStore + .toggleOutgoing(), + ) + ]))), + PopupMenuItem( + value: 2, + child: + Text(S.of(context).transactions_by_date)), + PopupMenuDivider(), + PopupMenuItem( + enabled: false, + value: -1, + child: Text(S.of(context).trades, + style: TextStyle( + fontWeight: FontWeight.bold, + color: Theme.of(context).primaryTextTheme.caption.color))), + PopupMenuItem( + value: 3, + child: Observer( + builder: (_) => Row( + mainAxisAlignment: + MainAxisAlignment + .spaceBetween, + children: [ + Text('XMR.TO'), + Checkbox( + value: actionListStore + .tradeFilterStore + .displayXMRTO, + onChanged: (value) => + actionListStore + .tradeFilterStore + .toggleDisplayExchange( + ExchangeProviderDescription + .xmrto), + ) + ]))), + PopupMenuItem( + value: 4, + child: Observer( + builder: (_) => Row( + mainAxisAlignment: + MainAxisAlignment + .spaceBetween, + children: [ + Text('Change.NOW'), + Checkbox( + value: actionListStore + .tradeFilterStore + .displayChangeNow, + onChanged: (value) => + actionListStore + .tradeFilterStore + .toggleDisplayExchange( + ExchangeProviderDescription + .changeNow), + ) + ]))), + PopupMenuItem( + value: 5, + child: Observer( + builder: (_) => Row( + mainAxisAlignment: + MainAxisAlignment + .spaceBetween, + children: [ + Text('MorphToken'), + Checkbox( + value: actionListStore + .tradeFilterStore + .displayMorphToken, + onChanged: (value) => + actionListStore + .tradeFilterStore + .toggleDisplayExchange( + ExchangeProviderDescription + .morphToken), + ) + ]))) + ], + child: filterButton, + onSelected: (item) async { + if (item == 2) { + final List picked = + await date_rage_picker.showDatePicker( + context: context, + initialFirstDate: DateTime.now() + .subtract(Duration(days: 1)), + initialLastDate: (DateTime.now()), + firstDate: DateTime(2015), + lastDate: DateTime.now() + .add(Duration(days: 1))); + + if (picked != null && picked.length == 2) { + actionListStore.transactionFilterStore + .changeStartDate(picked.first); + actionListStore.transactionFilterStore + .changeEndDate(picked.last); + } + } + }, + ), + ) + ], + ), + ) + ) + ], + ); + } + + @override + double get maxExtent => 174; + + @override + double get minExtent => 66; + + @override + bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) => true; + + Widget actionButton({ + BuildContext context, + @required Image image, + @required String title, + @required String route}) { + + return Container( + width: MediaQuery.of(context).size.width, + child: Column( + mainAxisAlignment: MainAxisAlignment.start, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + GestureDetector( + onTap: () { + if (route.isNotEmpty) { + Navigator.of(context, rootNavigator: true).pushNamed(route); + } + }, + child: Container( + height: 48, + width: 48, + alignment: Alignment.center, + decoration: BoxDecoration( + color: Colors.white, + shape: BoxShape.circle + ), + child: image, + ), + ), + Padding( + padding: EdgeInsets.only(top: 10), + child: Text( + title, + style: TextStyle( + fontSize: 16, + color: PaletteDark.walletCardText + ), + ), + ) + ], ), ); } diff --git a/lib/src/screens/dashboard/widgets/trade_row.dart b/lib/src/screens/dashboard/widgets/trade_row.dart index ce603c359..6927638b1 100644 --- a/lib/src/screens/dashboard/widgets/trade_row.dart +++ b/lib/src/screens/dashboard/widgets/trade_row.dart @@ -26,7 +26,8 @@ class TradeRow extends StatelessWidget { return InkWell( onTap: onTap, child: Container( - padding: EdgeInsets.only(top: 5, bottom: 5), + color: PaletteDark.historyPanel, + padding: EdgeInsets.only(top: 5, bottom: 5, left: 20, right: 20), child: Row(children: [ Container( height: 36, @@ -48,11 +49,14 @@ class TradeRow extends StatelessWidget { Text('${from.toString()} → ${to.toString()}', style: TextStyle( fontSize: 16, + color: Colors.white )), formattedAmount != null ? Text(formattedAmount + ' ' + amountCrypto, style: const TextStyle( - fontSize: 16)) + fontSize: 16, + color: Colors.white + )) : Container() ]), SizedBox(height: 5), diff --git a/lib/src/screens/dashboard/widgets/transaction_raw.dart b/lib/src/screens/dashboard/widgets/transaction_raw.dart index bf970cd27..824cd167c 100644 --- a/lib/src/screens/dashboard/widgets/transaction_raw.dart +++ b/lib/src/screens/dashboard/widgets/transaction_raw.dart @@ -24,7 +24,8 @@ class TransactionRow extends StatelessWidget { return InkWell( onTap: onTap, child: Container( - padding: EdgeInsets.only(top: 5, bottom: 5), + color: PaletteDark.historyPanel, + padding: EdgeInsets.only(top: 5, bottom: 5, left: 20, right: 20), child: Row(children: [ Container( height: 36, @@ -54,12 +55,15 @@ class TransactionRow extends StatelessWidget { (isPending ? S.of(context).pending : ''), style: TextStyle( fontSize: 16, + color: Colors.white )), Text(direction == TransactionDirection.incoming ? formattedAmount : '- ' + formattedAmount, style: const TextStyle( - fontSize: 16)) + fontSize: 16, + color: Colors.white + )) ]), SizedBox(height: 5,), Row( diff --git a/lib/src/screens/dashboard/widgets/wallet_card.dart b/lib/src/screens/dashboard/widgets/wallet_card.dart index d086b9c53..3177e8abe 100644 --- a/lib/src/screens/dashboard/widgets/wallet_card.dart +++ b/lib/src/screens/dashboard/widgets/wallet_card.dart @@ -159,7 +159,8 @@ class WalletCardState extends State { walletStore.name, style: TextStyle( fontSize: 20, - fontWeight: FontWeight.bold + fontWeight: FontWeight.bold, + color: Colors.white ), ), SizedBox(width: 10), @@ -243,7 +244,8 @@ class WalletCardState extends State { Text( balance, style: TextStyle( - fontSize: 28 + fontSize: 28, + color: Colors.white ), ) ], @@ -251,7 +253,8 @@ class WalletCardState extends State { Text( fiatBalance, style: TextStyle( - fontSize: 14 + fontSize: 14, + color: Colors.white ), ) ], @@ -276,7 +279,8 @@ class WalletCardState extends State { Text( descriptionText, style: TextStyle( - fontSize: 14 + fontSize: 14, + color: Colors.white ), ) ], @@ -299,6 +303,7 @@ class WalletCardState extends State { final walletStore = Provider.of(context); final rightArrow = Image.asset('assets/images/right_arrow.png'); double messageBoxHeight = 0; + double messageBoxWidth = cardWidth - 30; return Observer( key: _addressObserverKey, @@ -308,6 +313,7 @@ class WalletCardState extends State { height: cardHeight, alignment: Alignment.topCenter, child: Stack( + alignment: Alignment.topRight, children: [ Container( width: cardWidth, @@ -328,7 +334,7 @@ class WalletCardState extends State { children: [ Expanded( child: Container( - height: 72, + height: 84, child: Column( mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.start, @@ -344,10 +350,16 @@ class WalletCardState extends State { onTap: () { Clipboard.setData(ClipboardData( text: walletStore.subaddress.address)); - _addressObserverKey.currentState.setState(() => messageBoxHeight = 20); + _addressObserverKey.currentState.setState(() { + messageBoxHeight = 20; + messageBoxWidth = cardWidth; + }); Timer(Duration(milliseconds: 1000), () { try { - _addressObserverKey.currentState.setState(() => messageBoxHeight = 0); + _addressObserverKey.currentState.setState(() { + messageBoxHeight = 0; + messageBoxWidth = cardWidth - 30; + }); } catch(e) { print('${e.toString()}'); } @@ -357,6 +369,7 @@ class WalletCardState extends State { walletStore.subaddress.address, style: TextStyle( fontSize: 14, + color: Colors.white ), ), ) @@ -364,10 +377,10 @@ class WalletCardState extends State { ), ) ), - SizedBox(width: 20), + SizedBox(width: 10), Container( - width: 72, - height: 72, + width: 84, + height: 84, child: QrImage( data: walletStore.subaddress.address, backgroundColor: Colors.transparent, @@ -393,6 +406,7 @@ class WalletCardState extends State { S.current.subaddresses, style: TextStyle( fontSize: 14, + color: Colors.white ), ), rightArrow @@ -404,7 +418,7 @@ class WalletCardState extends State { ), ), AnimatedContainer( - width: cardWidth, + width: messageBoxWidth, height: messageBoxHeight, alignment: Alignment.center, duration: Duration(milliseconds: 500), diff --git a/res/values/strings_de.arb b/res/values/strings_de.arb index 572ccbbbd..a7e82893f 100644 --- a/res/values/strings_de.arb +++ b/res/values/strings_de.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "XMR-Empfänger erkannt", "openalias_alert_content" : "Sie senden Geld an\n${recipient_name}", - "card_address" : "Adresse:" + "card_address" : "Adresse:", + "buy" : "Kaufen" } \ No newline at end of file diff --git a/res/values/strings_en.arb b/res/values/strings_en.arb index 469b08f28..5681dc513 100644 --- a/res/values/strings_en.arb +++ b/res/values/strings_en.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "XMR Recipient Detected", "openalias_alert_content" : "You will be sending funds to\n${recipient_name}", - "card_address" : "Address:" + "card_address" : "Address:", + "buy" : "Buy" } \ No newline at end of file diff --git a/res/values/strings_es.arb b/res/values/strings_es.arb index be8257b32..260df0433 100644 --- a/res/values/strings_es.arb +++ b/res/values/strings_es.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "Destinatario XMR detectado", "openalias_alert_content" : "Enviará fondos a\n${recipient_name}", - "card_address" : "Dirección:" + "card_address" : "Dirección:", + "buy" : "Comprar" } \ No newline at end of file diff --git a/res/values/strings_hi.arb b/res/values/strings_hi.arb index b4a8763ec..85b6f080e 100644 --- a/res/values/strings_hi.arb +++ b/res/values/strings_hi.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "XMR प्राप्तकर्ता का पता लगाया", "openalias_alert_content" : "आपको धनराशि भेजी जाएगी\n${recipient_name}", - "card_address" : "पता:" + "card_address" : "पता:", + "buy" : "खरीदें" } \ No newline at end of file diff --git a/res/values/strings_ja.arb b/res/values/strings_ja.arb index c6e76cc1f..a291e6a12 100644 --- a/res/values/strings_ja.arb +++ b/res/values/strings_ja.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "XMR受信者が検出されました", "openalias_alert_content" : "に送金します\n${recipient_name}", - "card_address" : "住所:" + "card_address" : "住所:", + "buy" : "購入" } \ No newline at end of file diff --git a/res/values/strings_ko.arb b/res/values/strings_ko.arb index 8b470908c..50acfcbb1 100644 --- a/res/values/strings_ko.arb +++ b/res/values/strings_ko.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "XMR 수신자 감지", "openalias_alert_content" : "당신은에 자금을 보낼 것입니다\n${recipient_name}", - "card_address" : "주소:" + "card_address" : "주소:", + "buy" : "구입" } \ No newline at end of file diff --git a/res/values/strings_nl.arb b/res/values/strings_nl.arb index f0916e1d9..0268e8a0e 100644 --- a/res/values/strings_nl.arb +++ b/res/values/strings_nl.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "XMR-ontvanger gedetecteerd", "openalias_alert_content" : "U stuurt geld naar\n${recipient_name}", - "card_address" : "Adres:" + "card_address" : "Adres:", + "buy" : "Kopen" } \ No newline at end of file diff --git a/res/values/strings_pl.arb b/res/values/strings_pl.arb index d08fba806..dec019a07 100644 --- a/res/values/strings_pl.arb +++ b/res/values/strings_pl.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "Wykryto odbiorcę XMR", "openalias_alert_content" : "Będziesz wysyłać środki na\n${recipient_name}", - "card_address" : "Adres:" + "card_address" : "Adres:", + "buy" : "Kup" } \ No newline at end of file diff --git a/res/values/strings_pt.arb b/res/values/strings_pt.arb index 09e0a383c..fe855e87f 100644 --- a/res/values/strings_pt.arb +++ b/res/values/strings_pt.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "Destinatário XMR detectado", "openalias_alert_content" : "Você enviará fundos para\n${recipient_name}", - "card_address" : "Endereço:" + "card_address" : "Endereço:", + "buy" : "Comprar" } diff --git a/res/values/strings_ru.arb b/res/values/strings_ru.arb index cb7f935aa..5692f7421 100644 --- a/res/values/strings_ru.arb +++ b/res/values/strings_ru.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "Получатель XMR обнаружен", "openalias_alert_content" : "Вы будете отправлять средства\n${recipient_name}", - "card_address" : "Адрес:" + "card_address" : "Адрес:", + "buy" : "Купить" } \ No newline at end of file diff --git a/res/values/strings_uk.arb b/res/values/strings_uk.arb index e8a24c230..e44a993f7 100644 --- a/res/values/strings_uk.arb +++ b/res/values/strings_uk.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "Отримувача XMR виявлено", "openalias_alert_content" : "Ви будете відправляти кошти\n${recipient_name}", - "card_address" : "Адреса:" + "card_address" : "Адреса:", + "buy" : "Купити" } \ No newline at end of file diff --git a/res/values/strings_zh.arb b/res/values/strings_zh.arb index 5c074a0f4..06a428fce 100644 --- a/res/values/strings_zh.arb +++ b/res/values/strings_zh.arb @@ -351,5 +351,6 @@ "openalias_alert_title" : "檢測到XMR收件人", "openalias_alert_content" : "您將匯款至\n${recipient_name}", - "card_address" : "地址:" + "card_address" : "地址:", + "buy" : "購買" } \ No newline at end of file From a260ed7cea4a8b58ae80e28021986ccef3015922 Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Fri, 17 Apr 2020 23:27:23 +0300 Subject: [PATCH 06/11] CWA-198 | fixed dashboard_page --- lib/src/screens/dashboard/dashboard_page.dart | 17 ++++------------- 1 file changed, 4 insertions(+), 13 deletions(-) diff --git a/lib/src/screens/dashboard/dashboard_page.dart b/lib/src/screens/dashboard/dashboard_page.dart index eca98a9e9..0a4e57a15 100644 --- a/lib/src/screens/dashboard/dashboard_page.dart +++ b/lib/src/screens/dashboard/dashboard_page.dart @@ -62,19 +62,10 @@ class DashboardPageBodyState extends State { padding: EdgeInsets.only(left: 20, top: 23), child: WalletCard(), ), - Expanded( - child: Stack( - alignment: Alignment.topCenter, - fit: StackFit.expand, - children: [ - Positioned( - top: 28, - left: 0, - child: TradeHistoryPanel() - ), - ], - ) - ) + SizedBox( + height: 28, + ), + Expanded(child: TradeHistoryPanel()) ], ), ), From b3673d7c6359e61d61643866f52d6378874fff3a Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Sat, 18 Apr 2020 12:17:52 +0300 Subject: [PATCH 07/11] CWA-198 | fixed borders of date_section_raw, trade_raw and transaction_raw --- lib/src/screens/dashboard/widgets/date_section_raw.dart | 8 +++++++- lib/src/screens/dashboard/widgets/trade_row.dart | 8 +++++++- lib/src/screens/dashboard/widgets/transaction_raw.dart | 8 +++++++- 3 files changed, 21 insertions(+), 3 deletions(-) diff --git a/lib/src/screens/dashboard/widgets/date_section_raw.dart b/lib/src/screens/dashboard/widgets/date_section_raw.dart index 1fc0b4452..595171cb4 100644 --- a/lib/src/screens/dashboard/widgets/date_section_raw.dart +++ b/lib/src/screens/dashboard/widgets/date_section_raw.dart @@ -38,7 +38,13 @@ class DateSectionRaw extends StatelessWidget { return Container( padding: EdgeInsets.only(top: 10, bottom: 10, left: 20, right: 20), alignment: Alignment.center, - color: PaletteDark.historyPanel, + decoration: BoxDecoration( + color: PaletteDark.historyPanel, + border: Border.all( + width: 1, + color: PaletteDark.historyPanel + ), + ), child: Text(title, style: TextStyle(fontSize: 12, color: PaletteDark.historyPanelText)) ); diff --git a/lib/src/screens/dashboard/widgets/trade_row.dart b/lib/src/screens/dashboard/widgets/trade_row.dart index 6927638b1..e74fe5912 100644 --- a/lib/src/screens/dashboard/widgets/trade_row.dart +++ b/lib/src/screens/dashboard/widgets/trade_row.dart @@ -26,7 +26,13 @@ class TradeRow extends StatelessWidget { return InkWell( onTap: onTap, child: Container( - color: PaletteDark.historyPanel, + decoration: BoxDecoration( + color: PaletteDark.historyPanel, + border: Border.all( + width: 0.5, + color: PaletteDark.historyPanel + ), + ), padding: EdgeInsets.only(top: 5, bottom: 5, left: 20, right: 20), child: Row(children: [ Container( diff --git a/lib/src/screens/dashboard/widgets/transaction_raw.dart b/lib/src/screens/dashboard/widgets/transaction_raw.dart index 824cd167c..0aa79b2c8 100644 --- a/lib/src/screens/dashboard/widgets/transaction_raw.dart +++ b/lib/src/screens/dashboard/widgets/transaction_raw.dart @@ -24,7 +24,13 @@ class TransactionRow extends StatelessWidget { return InkWell( onTap: onTap, child: Container( - color: PaletteDark.historyPanel, + decoration: BoxDecoration( + color: PaletteDark.historyPanel, + border: Border.all( + width: 0.5, + color: PaletteDark.historyPanel + ), + ), padding: EdgeInsets.only(top: 5, bottom: 5, left: 20, right: 20), child: Row(children: [ Container( From 52d5dedaf82b95f3a7cb12db4263c391d297325b Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Tue, 21 Apr 2020 17:31:25 +0300 Subject: [PATCH 08/11] CWA-198 | moved ButtonHeader class to button_header.dart, fixed containers and bounds height for date_section_raw, trade_raw and transaction_raw, changed animation time for trade_history panel --- .../dashboard/widgets/button_header.dart | 297 +++++++++++++++++ .../dashboard/widgets/date_section_raw.dart | 1 + .../widgets/trade_history_panel.dart | 301 +----------------- .../screens/dashboard/widgets/trade_row.dart | 3 +- .../dashboard/widgets/transaction_raw.dart | 3 +- 5 files changed, 308 insertions(+), 297 deletions(-) create mode 100644 lib/src/screens/dashboard/widgets/button_header.dart diff --git a/lib/src/screens/dashboard/widgets/button_header.dart b/lib/src/screens/dashboard/widgets/button_header.dart new file mode 100644 index 000000000..3daa39ec7 --- /dev/null +++ b/lib/src/screens/dashboard/widgets/button_header.dart @@ -0,0 +1,297 @@ +import 'package:cake_wallet/src/domain/exchange/exchange_provider_description.dart'; +import 'package:cake_wallet/src/stores/action_list/action_list_store.dart'; +import 'package:flutter/cupertino.dart'; +import 'package:flutter/material.dart'; +import 'package:cake_wallet/palette.dart'; +import 'package:cake_wallet/generated/i18n.dart'; +import 'package:flutter_mobx/flutter_mobx.dart'; +import 'package:provider/provider.dart'; +import 'package:cake_wallet/routes.dart'; +import 'package:date_range_picker/date_range_picker.dart' as date_rage_picker; + +class ButtonHeader extends SliverPersistentHeaderDelegate { + final sendImage = Image.asset('assets/images/send.png'); + final exchangeImage = Image.asset('assets/images/exchange.png'); + final buyImage = Image.asset('assets/images/coins.png'); + final filterButton = Image.asset('assets/images/filter_button.png'); + + @override + Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) { + final actionListStore = Provider.of(context); + final historyPanelWidth = MediaQuery.of(context).size.width; + + double buttonsOpacity = 1 - shrinkOffset / (maxExtent - minExtent); + double buttonsHeight = maxExtent - minExtent - shrinkOffset; + + buttonsOpacity = buttonsOpacity >= 0 ? buttonsOpacity : 0; + buttonsHeight = buttonsHeight >= 0 ? buttonsHeight : 0; + + return Stack( + fit: StackFit.expand, + overflow: Overflow.visible, + children: [ + Opacity( + opacity: buttonsOpacity, + child: Container( + height: buttonsHeight, + padding: EdgeInsets.only(left: 44, right: 44), + child: Row( + children: [ + Flexible( + child: actionButton( + context: context, + image: sendImage, + title: S.of(context).send, + route: Routes.send + ) + ), + Flexible( + child: actionButton( + context: context, + image: exchangeImage, + title: S.of(context).exchange, + route: Routes.exchange + ) + ), + Flexible( + child: actionButton( + context: context, + image: buyImage, + title: S.of(context).buy, + route: '' + ) + ) + ], + ), + ), + ), + Positioned( + top: buttonsHeight, + left: 0, + child: Container( + width: historyPanelWidth, + height: 66, + padding: EdgeInsets.only(top: 20, left: 20, right: 20, bottom: 10), + decoration: BoxDecoration( + borderRadius: BorderRadius.only(topLeft: Radius.circular(20), topRight: Radius.circular(20)), + color: PaletteDark.historyPanel, + ), + child: Stack( + alignment: Alignment.center, + children: [ + Text( + S.of(context).trade_history_title, + style: TextStyle( + fontSize: 20, + color: Colors.white + ), + ), + Positioned( + right: 0, + child: PopupMenuButton( + itemBuilder: (context) => [ + PopupMenuItem( + enabled: false, + value: -1, + child: Text(S.of(context).transactions, + style: TextStyle( + fontWeight: FontWeight.bold, + color: Theme.of(context).primaryTextTheme.caption.color))), + PopupMenuItem( + value: 0, + child: Observer( + builder: (_) => Row( + mainAxisAlignment: + MainAxisAlignment + .spaceBetween, + children: [ + Text(S.of(context).incoming), + Checkbox( + value: actionListStore + .transactionFilterStore + .displayIncoming, + onChanged: (value) => + actionListStore + .transactionFilterStore + .toggleIncoming(), + ) + ]))), + PopupMenuItem( + value: 1, + child: Observer( + builder: (_) => Row( + mainAxisAlignment: + MainAxisAlignment + .spaceBetween, + children: [ + Text(S.of(context).outgoing), + Checkbox( + value: actionListStore + .transactionFilterStore + .displayOutgoing, + onChanged: (value) => + actionListStore + .transactionFilterStore + .toggleOutgoing(), + ) + ]))), + PopupMenuItem( + value: 2, + child: + Text(S.of(context).transactions_by_date)), + PopupMenuDivider(), + PopupMenuItem( + enabled: false, + value: -1, + child: Text(S.of(context).trades, + style: TextStyle( + fontWeight: FontWeight.bold, + color: Theme.of(context).primaryTextTheme.caption.color))), + PopupMenuItem( + value: 3, + child: Observer( + builder: (_) => Row( + mainAxisAlignment: + MainAxisAlignment + .spaceBetween, + children: [ + Text('XMR.TO'), + Checkbox( + value: actionListStore + .tradeFilterStore + .displayXMRTO, + onChanged: (value) => + actionListStore + .tradeFilterStore + .toggleDisplayExchange( + ExchangeProviderDescription + .xmrto), + ) + ]))), + PopupMenuItem( + value: 4, + child: Observer( + builder: (_) => Row( + mainAxisAlignment: + MainAxisAlignment + .spaceBetween, + children: [ + Text('Change.NOW'), + Checkbox( + value: actionListStore + .tradeFilterStore + .displayChangeNow, + onChanged: (value) => + actionListStore + .tradeFilterStore + .toggleDisplayExchange( + ExchangeProviderDescription + .changeNow), + ) + ]))), + PopupMenuItem( + value: 5, + child: Observer( + builder: (_) => Row( + mainAxisAlignment: + MainAxisAlignment + .spaceBetween, + children: [ + Text('MorphToken'), + Checkbox( + value: actionListStore + .tradeFilterStore + .displayMorphToken, + onChanged: (value) => + actionListStore + .tradeFilterStore + .toggleDisplayExchange( + ExchangeProviderDescription + .morphToken), + ) + ]))) + ], + child: filterButton, + onSelected: (item) async { + if (item == 2) { + final List picked = + await date_rage_picker.showDatePicker( + context: context, + initialFirstDate: DateTime.now() + .subtract(Duration(days: 1)), + initialLastDate: (DateTime.now()), + firstDate: DateTime(2015), + lastDate: DateTime.now() + .add(Duration(days: 1))); + + if (picked != null && picked.length == 2) { + actionListStore.transactionFilterStore + .changeStartDate(picked.first); + actionListStore.transactionFilterStore + .changeEndDate(picked.last); + } + } + }, + ), + ) + ], + ), + ) + ) + ], + ); + } + + @override + double get maxExtent => 174; + + @override + double get minExtent => 66; + + @override + bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) => true; + + Widget actionButton({ + BuildContext context, + @required Image image, + @required String title, + @required String route}) { + + return Container( + width: MediaQuery.of(context).size.width, + child: Column( + mainAxisAlignment: MainAxisAlignment.start, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + GestureDetector( + onTap: () { + if (route.isNotEmpty) { + Navigator.of(context, rootNavigator: true).pushNamed(route); + } + }, + child: Container( + height: 48, + width: 48, + alignment: Alignment.center, + decoration: BoxDecoration( + color: Colors.white, + shape: BoxShape.circle + ), + child: image, + ), + ), + Padding( + padding: EdgeInsets.only(top: 10), + child: Text( + title, + style: TextStyle( + fontSize: 16, + color: PaletteDark.walletCardText + ), + ), + ) + ], + ), + ); + } +} \ No newline at end of file diff --git a/lib/src/screens/dashboard/widgets/date_section_raw.dart b/lib/src/screens/dashboard/widgets/date_section_raw.dart index 595171cb4..4ec9382fd 100644 --- a/lib/src/screens/dashboard/widgets/date_section_raw.dart +++ b/lib/src/screens/dashboard/widgets/date_section_raw.dart @@ -36,6 +36,7 @@ class DateSectionRaw extends StatelessWidget { } return Container( + height: 36, padding: EdgeInsets.only(top: 10, bottom: 10, left: 20, right: 20), alignment: Alignment.center, decoration: BoxDecoration( diff --git a/lib/src/screens/dashboard/widgets/trade_history_panel.dart b/lib/src/screens/dashboard/widgets/trade_history_panel.dart index b1716c9de..99035a6d9 100644 --- a/lib/src/screens/dashboard/widgets/trade_history_panel.dart +++ b/lib/src/screens/dashboard/widgets/trade_history_panel.dart @@ -1,5 +1,4 @@ import 'package:cake_wallet/src/domain/common/balance_display_mode.dart'; -import 'package:cake_wallet/src/domain/exchange/exchange_provider_description.dart'; import 'package:cake_wallet/src/stores/action_list/action_list_store.dart'; import 'package:cake_wallet/src/stores/action_list/date_section_item.dart'; import 'package:cake_wallet/src/stores/action_list/trade_list_item.dart'; @@ -8,7 +7,6 @@ import 'package:cake_wallet/src/stores/settings/settings_store.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/palette.dart'; -import 'package:cake_wallet/generated/i18n.dart'; import 'package:flutter_mobx/flutter_mobx.dart'; import 'package:intl/intl.dart'; import 'package:provider/provider.dart'; @@ -16,7 +14,7 @@ import 'package:cake_wallet/routes.dart'; import 'date_section_raw.dart'; import 'trade_row.dart'; import 'transaction_raw.dart'; -import 'package:date_range_picker/date_range_picker.dart' as date_rage_picker; +import 'button_header.dart'; class TradeHistoryPanel extends StatefulWidget { @override @@ -58,7 +56,7 @@ class TradeHistoryPanelState extends State { child: AnimatedContainer( width: MediaQuery.of(context).size.width, height: panelHeight, - duration: Duration(milliseconds: 500), + duration: Duration(milliseconds: 1000), curve: Curves.fastOutSlowIn, child: CustomScrollView( slivers: [ @@ -75,7 +73,7 @@ class TradeHistoryPanelState extends State { : actionListStore.items; final itemsCount = items.length + 1; final symbol = settingsStore.fiatCurrency.toString(); - double freeSpaceHeight = MediaQuery.of(context).size.height - 496; // FIXME + double freeSpaceHeight = MediaQuery.of(context).size.height - 496; return SliverList( key: _listKey, @@ -95,12 +93,12 @@ class TradeHistoryPanelState extends State { final item = items[index]; if (item is DateSectionItem) { - freeSpaceHeight -= 32; // FIXME + freeSpaceHeight -= 38; return DateSectionRaw(date: item.date); } if (item is TransactionListItem) { - freeSpaceHeight -= 45; // FIXME + freeSpaceHeight -= 58; final transaction = item.transaction; final savedDisplayMode = settingsStore.balanceDisplayMode; final formattedAmount = @@ -125,7 +123,7 @@ class TradeHistoryPanelState extends State { } if (item is TradeListItem) { - freeSpaceHeight -= 45; // FIXME + freeSpaceHeight -= 58; final trade = item.trade; final savedDisplayMode = settingsStore.balanceDisplayMode; final formattedAmount = trade.amount != null @@ -159,291 +157,4 @@ class TradeHistoryPanelState extends State { ), ); } -} - -class ButtonHeader extends SliverPersistentHeaderDelegate { - final sendImage = Image.asset('assets/images/send.png'); - final exchangeImage = Image.asset('assets/images/exchange.png'); - final buyImage = Image.asset('assets/images/coins.png'); - final filterButton = Image.asset('assets/images/filter_button.png'); - - @override - Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) { - final actionListStore = Provider.of(context); - final historyPanelWidth = MediaQuery.of(context).size.width; - - double buttonsOpacity = 1 - shrinkOffset / (maxExtent - minExtent); - double buttonsHeight = maxExtent - minExtent - shrinkOffset; - - buttonsOpacity = buttonsOpacity >= 0 ? buttonsOpacity : 0; - buttonsHeight = buttonsHeight >= 0 ? buttonsHeight : 0; - - return Stack( - fit: StackFit.expand, - overflow: Overflow.visible, - children: [ - Opacity( - opacity: buttonsOpacity, - child: Container( - height: buttonsHeight, - padding: EdgeInsets.only(left: 44, right: 44), - child: Row( - children: [ - Flexible( - child: actionButton( - context: context, - image: sendImage, - title: S.of(context).send, - route: Routes.send - ) - ), - Flexible( - child: actionButton( - context: context, - image: exchangeImage, - title: S.of(context).exchange, - route: Routes.exchange - ) - ), - Flexible( - child: actionButton( - context: context, - image: buyImage, - title: S.of(context).buy, - route: '' - ) - ) - ], - ), - ), - ), - Positioned( - top: buttonsHeight, - left: 0, - child: Container( - width: historyPanelWidth, - height: 66, - padding: EdgeInsets.only(top: 20, left: 20, right: 20, bottom: 10), - decoration: BoxDecoration( - borderRadius: BorderRadius.only(topLeft: Radius.circular(20), topRight: Radius.circular(20)), - color: PaletteDark.historyPanel, - ), - child: Stack( - alignment: Alignment.center, - children: [ - Text( - S.of(context).trade_history_title, - style: TextStyle( - fontSize: 20, - color: Colors.white - ), - ), - Positioned( - right: 0, - child: PopupMenuButton( - itemBuilder: (context) => [ - PopupMenuItem( - enabled: false, - value: -1, - child: Text(S.of(context).transactions, - style: TextStyle( - fontWeight: FontWeight.bold, - color: Theme.of(context).primaryTextTheme.caption.color))), - PopupMenuItem( - value: 0, - child: Observer( - builder: (_) => Row( - mainAxisAlignment: - MainAxisAlignment - .spaceBetween, - children: [ - Text(S.of(context).incoming), - Checkbox( - value: actionListStore - .transactionFilterStore - .displayIncoming, - onChanged: (value) => - actionListStore - .transactionFilterStore - .toggleIncoming(), - ) - ]))), - PopupMenuItem( - value: 1, - child: Observer( - builder: (_) => Row( - mainAxisAlignment: - MainAxisAlignment - .spaceBetween, - children: [ - Text(S.of(context).outgoing), - Checkbox( - value: actionListStore - .transactionFilterStore - .displayOutgoing, - onChanged: (value) => - actionListStore - .transactionFilterStore - .toggleOutgoing(), - ) - ]))), - PopupMenuItem( - value: 2, - child: - Text(S.of(context).transactions_by_date)), - PopupMenuDivider(), - PopupMenuItem( - enabled: false, - value: -1, - child: Text(S.of(context).trades, - style: TextStyle( - fontWeight: FontWeight.bold, - color: Theme.of(context).primaryTextTheme.caption.color))), - PopupMenuItem( - value: 3, - child: Observer( - builder: (_) => Row( - mainAxisAlignment: - MainAxisAlignment - .spaceBetween, - children: [ - Text('XMR.TO'), - Checkbox( - value: actionListStore - .tradeFilterStore - .displayXMRTO, - onChanged: (value) => - actionListStore - .tradeFilterStore - .toggleDisplayExchange( - ExchangeProviderDescription - .xmrto), - ) - ]))), - PopupMenuItem( - value: 4, - child: Observer( - builder: (_) => Row( - mainAxisAlignment: - MainAxisAlignment - .spaceBetween, - children: [ - Text('Change.NOW'), - Checkbox( - value: actionListStore - .tradeFilterStore - .displayChangeNow, - onChanged: (value) => - actionListStore - .tradeFilterStore - .toggleDisplayExchange( - ExchangeProviderDescription - .changeNow), - ) - ]))), - PopupMenuItem( - value: 5, - child: Observer( - builder: (_) => Row( - mainAxisAlignment: - MainAxisAlignment - .spaceBetween, - children: [ - Text('MorphToken'), - Checkbox( - value: actionListStore - .tradeFilterStore - .displayMorphToken, - onChanged: (value) => - actionListStore - .tradeFilterStore - .toggleDisplayExchange( - ExchangeProviderDescription - .morphToken), - ) - ]))) - ], - child: filterButton, - onSelected: (item) async { - if (item == 2) { - final List picked = - await date_rage_picker.showDatePicker( - context: context, - initialFirstDate: DateTime.now() - .subtract(Duration(days: 1)), - initialLastDate: (DateTime.now()), - firstDate: DateTime(2015), - lastDate: DateTime.now() - .add(Duration(days: 1))); - - if (picked != null && picked.length == 2) { - actionListStore.transactionFilterStore - .changeStartDate(picked.first); - actionListStore.transactionFilterStore - .changeEndDate(picked.last); - } - } - }, - ), - ) - ], - ), - ) - ) - ], - ); - } - - @override - double get maxExtent => 174; - - @override - double get minExtent => 66; - - @override - bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) => true; - - Widget actionButton({ - BuildContext context, - @required Image image, - @required String title, - @required String route}) { - - return Container( - width: MediaQuery.of(context).size.width, - child: Column( - mainAxisAlignment: MainAxisAlignment.start, - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - GestureDetector( - onTap: () { - if (route.isNotEmpty) { - Navigator.of(context, rootNavigator: true).pushNamed(route); - } - }, - child: Container( - height: 48, - width: 48, - alignment: Alignment.center, - decoration: BoxDecoration( - color: Colors.white, - shape: BoxShape.circle - ), - child: image, - ), - ), - Padding( - padding: EdgeInsets.only(top: 10), - child: Text( - title, - style: TextStyle( - fontSize: 16, - color: PaletteDark.walletCardText - ), - ), - ) - ], - ), - ); - } } \ No newline at end of file diff --git a/lib/src/screens/dashboard/widgets/trade_row.dart b/lib/src/screens/dashboard/widgets/trade_row.dart index e74fe5912..1ea5f098d 100644 --- a/lib/src/screens/dashboard/widgets/trade_row.dart +++ b/lib/src/screens/dashboard/widgets/trade_row.dart @@ -26,10 +26,11 @@ class TradeRow extends StatelessWidget { return InkWell( onTap: onTap, child: Container( + height: 56, decoration: BoxDecoration( color: PaletteDark.historyPanel, border: Border.all( - width: 0.5, + width: 1, color: PaletteDark.historyPanel ), ), diff --git a/lib/src/screens/dashboard/widgets/transaction_raw.dart b/lib/src/screens/dashboard/widgets/transaction_raw.dart index 0aa79b2c8..517318260 100644 --- a/lib/src/screens/dashboard/widgets/transaction_raw.dart +++ b/lib/src/screens/dashboard/widgets/transaction_raw.dart @@ -24,10 +24,11 @@ class TransactionRow extends StatelessWidget { return InkWell( onTap: onTap, child: Container( + height: 56, decoration: BoxDecoration( color: PaletteDark.historyPanel, border: Border.all( - width: 0.5, + width: 1, color: PaletteDark.historyPanel ), ), From 3cd8af422814ca939e37387206eb40839d4a4959 Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Thu, 30 Apr 2020 20:35:06 +0300 Subject: [PATCH 09/11] CWA-198 | changed background color of dashboard page; added color of bounds and shadows to wallet card; changed color of buttons in the button_header --- assets/images/2.0x/header.png | Bin 0 -> 186 bytes assets/images/3.0x/header.png | Bin 0 -> 231 bytes assets/images/header.png | Bin 0 -> 153 bytes lib/palette.dart | 2 + lib/src/screens/base_page.dart | 15 +++--- lib/src/screens/dashboard/dashboard_page.dart | 51 ++++++++---------- .../dashboard/widgets/button_header.dart | 2 +- .../dashboard/widgets/wallet_card.dart | 48 +++++++++++------ lib/src/widgets/nav_bar.dart | 15 +++--- 9 files changed, 75 insertions(+), 58 deletions(-) create mode 100644 assets/images/2.0x/header.png create mode 100644 assets/images/3.0x/header.png create mode 100644 assets/images/header.png diff --git a/assets/images/2.0x/header.png b/assets/images/2.0x/header.png new file mode 100644 index 0000000000000000000000000000000000000000..192b343ffd684397d66e3e6d36cd29d0820e0407 GIT binary patch literal 186 zcmeAS@N?(olHy`uVBq!ia0vp^azM<+!3HF+Y}E?^Qk(@Ik;M!QVyYm_=ozH)0Vv2= z9OUlAuomgzpde#$ zkh>GZx^prwfgF}}M_)$E)e-c@N{2EUe$B+uft5X^|8w>=Pqt#y=D-|(+#Zfx> z$I&LPtVIu+8^u)~UJCjl;KMNKY)0_LRp0)L$erlD%*^^+D{GUaP5=M^ literal 0 HcmV?d00001 diff --git a/assets/images/header.png b/assets/images/header.png new file mode 100644 index 0000000000000000000000000000000000000000..a3e8169aa4d041d27f2c449b6d184c266018bb42 GIT binary patch literal 153 zcmeAS@N?(olHy`uVBq!ia0vp^{6Ngi!3HFKL_!UL6lZ})WHAE+w=f7ZGR&GI0Tg5` z4sv&5Sa(k5C6L3C?&#~tz_78O`%fY(kgw null; + Color get backgroundColor => PaletteDark.mainBackgroundColor; + + @override + Widget trailing(BuildContext context) { + final menuButton = Image.asset('assets/images/header.png'); + + return SizedBox( + height: 37, + width: 37, + child: ButtonTheme( + minWidth: double.minPositive, + child: FlatButton( + highlightColor: Colors.transparent, + splashColor: Colors.transparent, + padding: EdgeInsets.all(0), + onPressed: () {}, + child: menuButton), + ), + ); + } @override Widget body(BuildContext context) => DashboardPageBody(key: _bodyKey); @@ -23,43 +42,17 @@ class DashboardPageBody extends StatefulWidget { } class DashboardPageBodyState extends State { - final menuButton = Image.asset('assets/images/menu_button.png'); @override Widget build(BuildContext context) { - final List colors = [PaletteDark.backgroundStart, PaletteDark.backgroundEnd]; return SafeArea( child: Container( - decoration: BoxDecoration( - gradient: LinearGradient( - colors: colors - ) - ), + color: PaletteDark.mainBackgroundColor, child: Column( children: [ Padding( - padding: EdgeInsets.only(top: 14), - child: Container( - width: double.infinity, - alignment: Alignment.centerRight, - child: SizedBox( - height: 37, - width: 37, - child: ButtonTheme( - minWidth: double.minPositive, - child: FlatButton( - highlightColor: Colors.transparent, - splashColor: Colors.transparent, - padding: EdgeInsets.all(0), - onPressed: () {}, - child: menuButton), - ), - ), - ) - ), - Padding( - padding: EdgeInsets.only(left: 20, top: 23), + padding: EdgeInsets.only(left: 20, top: 10), child: WalletCard(), ), SizedBox( diff --git a/lib/src/screens/dashboard/widgets/button_header.dart b/lib/src/screens/dashboard/widgets/button_header.dart index 3daa39ec7..71b8434e5 100644 --- a/lib/src/screens/dashboard/widgets/button_header.dart +++ b/lib/src/screens/dashboard/widgets/button_header.dart @@ -274,7 +274,7 @@ class ButtonHeader extends SliverPersistentHeaderDelegate { width: 48, alignment: Alignment.center, decoration: BoxDecoration( - color: Colors.white, + color: PaletteDark.borderCardColor, shape: BoxShape.circle ), child: image, diff --git a/lib/src/screens/dashboard/widgets/wallet_card.dart b/lib/src/screens/dashboard/widgets/wallet_card.dart index 3177e8abe..d3623e261 100644 --- a/lib/src/screens/dashboard/widgets/wallet_card.dart +++ b/lib/src/screens/dashboard/widgets/wallet_card.dart @@ -24,7 +24,7 @@ class WalletCardState extends State { final _balanceObserverKey = GlobalKey(); final _addressObserverKey = GlobalKey(); - final List colorsSync = [PaletteDark.walletCardTopEndSync, PaletteDark.walletCardBottomEndSync]; + final List colorsSync = [PaletteDark.walletCardSubAddressField, PaletteDark.walletCardBottomEndSync]; double cardWidth; double cardHeight; double screenWidth; @@ -67,20 +67,34 @@ class WalletCardState extends State { height: cardHeight, duration: Duration(milliseconds: 500), curve: Curves.fastOutSlowIn, - decoration: BoxDecoration( - borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)), - gradient: LinearGradient( - colors: [PaletteDark.walletCardTopStartSync.withOpacity(opacity), - PaletteDark.walletCardBottomStartSync.withOpacity(opacity)], - begin: Alignment.topCenter, - end: Alignment.bottomCenter - ) + padding: EdgeInsets.only( + top: 1, + left: 1, + bottom: 1 ), - child: InkWell( - onTap: () => setState(() => isFrontSide = !isFrontSide), - child: isFrontSide - ? frontSide() - : backSide() + decoration: BoxDecoration( + borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)), + color: PaletteDark.borderCardColor, + boxShadow: [ + BoxShadow( + color: PaletteDark.historyPanel.withOpacity(0.5), + blurRadius: 8, + offset: Offset(5, 5)) + ] + ), + child: Container( + width: cardWidth, + height: cardHeight, + decoration: BoxDecoration( + borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)), + color: PaletteDark.historyPanel + ), + child: InkWell( + onTap: () => setState(() => isFrontSide = !isFrontSide), + child: isFrontSide + ? frontSide() + : backSide() + ), ), ), ); @@ -99,6 +113,7 @@ class WalletCardState extends State { final status = syncStore.status; final statusText = status.title(); final progress = syncStore.status.progress(); + final indicatorWidth = progress * cardWidth; String shortAddress = walletStore.subaddress.address; shortAddress = shortAddress.replaceRange(4, shortAddress.length - 4, '...'); @@ -123,9 +138,10 @@ class WalletCardState extends State { height: cardHeight, child: Stack( children: [ - Container( + AnimatedContainer( + duration: Duration(milliseconds: 0), height: cardHeight, - width: progress * cardWidth, + width: indicatorWidth, decoration: BoxDecoration( borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)), gradient: LinearGradient( diff --git a/lib/src/widgets/nav_bar.dart b/lib/src/widgets/nav_bar.dart index 5e540a09f..a46072615 100644 --- a/lib/src/widgets/nav_bar.dart +++ b/lib/src/widgets/nav_bar.dart @@ -19,8 +19,9 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget { middle: middle, trailing: trailing, height: _height, - backgroundColor: - _isDarkTheme ? Theme.of(context).backgroundColor : backgroundColor); + backgroundColor: backgroundColor); + /*backgroundColor: + _isDarkTheme ? Theme.of(context).backgroundColor : backgroundColor);*/ } factory NavBar.withShadow( @@ -37,12 +38,14 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget { middle: middle, trailing: trailing, height: 80, - backgroundColor: - _isDarkTheme ? Theme.of(context).backgroundColor : backgroundColor, + backgroundColor: backgroundColor, + /*backgroundColor: + _isDarkTheme ? Theme.of(context).backgroundColor : backgroundColor,*/ decoration: BoxDecoration( - color: _isDarkTheme + color: backgroundColor, + /*_isDarkTheme ? Theme.of(context).backgroundColor - : backgroundColor, + : backgroundColor,*/ boxShadow: [ BoxShadow( color: Color.fromRGBO(132, 141, 198, 0.11), From bd5a4a9f03e09f8213202f49d65e1980fab274e0 Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Thu, 30 Apr 2020 22:54:09 +0300 Subject: [PATCH 10/11] CWA-198 | added right border of animated indicator in the wallet card --- .../screens/dashboard/widgets/wallet_card.dart | 17 ++++++++++++++--- 1 file changed, 14 insertions(+), 3 deletions(-) diff --git a/lib/src/screens/dashboard/widgets/wallet_card.dart b/lib/src/screens/dashboard/widgets/wallet_card.dart index d3623e261..c1b2ba7e9 100644 --- a/lib/src/screens/dashboard/widgets/wallet_card.dart +++ b/lib/src/screens/dashboard/widgets/wallet_card.dart @@ -45,7 +45,7 @@ class WalletCardState extends State { } void afterLayout(dynamic _) { - screenWidth = MediaQuery.of(context).size.width; + screenWidth = MediaQuery.of(context).size.width - 20; setState(() { cardWidth = screenWidth; opacity = 1; @@ -138,8 +138,7 @@ class WalletCardState extends State { height: cardHeight, child: Stack( children: [ - AnimatedContainer( - duration: Duration(milliseconds: 0), + Container( height: cardHeight, width: indicatorWidth, decoration: BoxDecoration( @@ -151,6 +150,18 @@ class WalletCardState extends State { ) ), ), + progress != 1 + ? Positioned( + left: indicatorWidth, + top: 0, + bottom: 0, + child: Container( + width: 1, + height: cardHeight, + color: PaletteDark.borderCardColor, + ) + ) + : Offstage(), isDraw ? Positioned( left: 20, right: 20, From f0ea28982eb7549768be14948488b61ab44c49e8 Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Thu, 30 Apr 2020 23:21:01 +0300 Subject: [PATCH 11/11] CWA-198 | fixed width of the copy information raw --- lib/src/screens/dashboard/widgets/wallet_card.dart | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/lib/src/screens/dashboard/widgets/wallet_card.dart b/lib/src/screens/dashboard/widgets/wallet_card.dart index c1b2ba7e9..a4c2f4b48 100644 --- a/lib/src/screens/dashboard/widgets/wallet_card.dart +++ b/lib/src/screens/dashboard/widgets/wallet_card.dart @@ -50,7 +50,7 @@ class WalletCardState extends State { cardWidth = screenWidth; opacity = 1; }); - Timer(Duration(milliseconds: 350), () => + Timer(Duration(milliseconds: 500), () => setState(() => isDraw = true) ); } @@ -330,7 +330,7 @@ class WalletCardState extends State { final walletStore = Provider.of(context); final rightArrow = Image.asset('assets/images/right_arrow.png'); double messageBoxHeight = 0; - double messageBoxWidth = cardWidth - 30; + double messageBoxWidth = cardWidth - 10; return Observer( key: _addressObserverKey, @@ -385,7 +385,7 @@ class WalletCardState extends State { try { _addressObserverKey.currentState.setState(() { messageBoxHeight = 0; - messageBoxWidth = cardWidth - 30; + messageBoxWidth = cardWidth - 10; }); } catch(e) { print('${e.toString()}');