From 3cd8af422814ca939e37387206eb40839d4a4959 Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Thu, 30 Apr 2020 20:35:06 +0300 Subject: [PATCH 1/4] 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 2/4] 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 3/4] 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()}'); From 1a0149afc6bb792dc2e477cb5e69782ab5b03b10 Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Fri, 1 May 2020 22:24:31 +0300 Subject: [PATCH 4/4] CWA-200 | called menu widget --- lib/src/screens/dashboard/dashboard_page.dart | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/lib/src/screens/dashboard/dashboard_page.dart b/lib/src/screens/dashboard/dashboard_page.dart index bd0cfb6db..b05bb8d9a 100644 --- a/lib/src/screens/dashboard/dashboard_page.dart +++ b/lib/src/screens/dashboard/dashboard_page.dart @@ -1,3 +1,4 @@ +import 'package:cake_wallet/src/screens/dashboard/widgets/menu_widget.dart'; import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; import 'package:cake_wallet/palette.dart'; @@ -24,7 +25,12 @@ class DashboardPage extends BasePage { highlightColor: Colors.transparent, splashColor: Colors.transparent, padding: EdgeInsets.all(0), - onPressed: () {}, + onPressed: () async { + await showDialog( + builder: (_) => MenuWidget(), + context: context + ); + }, child: menuButton), ), );