Ecosystem/cake_wallet
1
0
Fork 0
mirror of https://github.com/cake-tech/cake_wallet.git synced 2024-11-16 17:27:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

CAKE-28 | created filter tile, filter widget, checkbox widget and filter item; applied filter items to filter widget, also applied filter widget to dashboard page; reworked wallet list page and menu widget; applied light and dark themes to filter widget and wallet list age; fixed filtered method in the trade filter store

Browse source
This commit is contained in:
Oleksandr Sobol 2020-08-28 23:04:48 +03:00
parent 56519bbe86
commit 4ed7f6ec18
18 changed files with 531 additions and 289 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
assets/images/2.0x/back_vector.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 337 B

BIN
assets/images/3.0x/back_vector.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 459 B

BIN
assets/images/back_vector.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 251 B

11
lib/palette.dart
View file

@ -9,11 +9,20 @@ class Palette {
static const Color lavender = Color.fromRGBO(237, 245, 252, 1.0);
static const Color oceanBlue = Color.fromRGBO(30, 52, 78, 1.0);
static const Color lightBlueGrey = Color.fromRGBO(118, 131, 169, 1.0);
static const Color periwinkle = Color.fromRGBO(197, 208, 230, 1.0);
static const Color periwinkle = Color.fromRGBO(195, 210, 227, 1.0);
static const Color blue = Color.fromRGBO(88, 143, 252, 1.0);
static const Color darkLavender = Color.fromRGBO(229, 238, 250, 1.0);
static const Color nightBlue = Color.fromRGBO(46, 57, 96, 1.0);
static const Color moderateOrangeYellow = Color.fromRGBO(245, 134, 82, 1.0);
static const Color moderateOrange = Color.fromRGBO(235, 117, 63, 1.0);
static const Color shineGreen = Color.fromRGBO(76, 189, 87, 1.0);
static const Color moderateGreen = Color.fromRGBO(45, 158, 56, 1.0);
static const Color cornflower = Color.fromRGBO(85, 147, 240, 1.0);
static const Color royalBlue = Color.fromRGBO(43, 114, 221, 1.0);
static const Color lightRed = Color.fromRGBO(227, 87, 87, 1.0);
static const Color persianRed = Color.fromRGBO(206, 55, 55, 1.0);
// NEW DESIGN
static const Color blueCraiola = Color.fromRGBO(69, 110, 255, 1.0);
static const Color darkBlueCraiola = Color.fromRGBO(53, 86, 136, 1.0);

21
lib/src/screens/dashboard/widgets/filter_tile.dart Normal file
View file

@ -0,0 +1,21 @@
import 'package:flutter/material.dart';
class FilterTile extends StatelessWidget {
FilterTile({@required this.child});
final Widget child;
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
padding: EdgeInsets.only(
top: 18,
bottom: 18,
left: 24,
right: 24
),
child: child,
);
}
}

155
lib/src/screens/dashboard/widgets/filter_widget.dart Normal file
View file

@ -0,0 +1,155 @@
import 'dart:ui';
import 'package:cake_wallet/palette.dart';
import 'package:cake_wallet/src/screens/dashboard/widgets/filter_tile.dart';
import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:cake_wallet/src/widgets/alert_background.dart';
import 'package:cake_wallet/src/widgets/alert_close_button.dart';
import 'package:cake_wallet/src/widgets/checkbox_widget.dart';
import 'package:cake_wallet/generated/i18n.dart';
import 'package:date_range_picker/date_range_picker.dart' as date_rage_picker;
class FilterWidget extends StatelessWidget {
FilterWidget({@required this.dashboardViewModel});
final DashboardViewModel dashboardViewModel;
final backVector = Image.asset('assets/images/back_vector.png',
color: Palette.darkBlueCraiola
);
@override
Widget build(BuildContext context) {
return AlertBackground(
child: Stack(
alignment: Alignment.center,
children: <Widget>[
Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Text(
S.of(context).filters,
style: TextStyle(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.bold,
fontFamily: 'Poppins',
decoration: TextDecoration.none,
),
),
Padding(
padding: EdgeInsets.only(
left: 24,
right: 24,
top: 24
),
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(14)),
child: Container(
color: Theme.of(context).textTheme.body2.decorationColor,
child: ListView.separated(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
itemCount: dashboardViewModel.filterItems.length,
separatorBuilder: (context, _) => Container(
height: 1,
color: Theme.of(context).accentTextTheme.subhead.backgroundColor,
),
itemBuilder: (_, index1) {
final title = dashboardViewModel.filterItems.keys.elementAt(index1);
final section = dashboardViewModel.filterItems.values.elementAt(index1);
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Padding(
padding: EdgeInsets.only(
top: 20,
left: 24,
right: 24
),
child: Text(
title,
style: TextStyle(
color: Theme.of(context).accentTextTheme.subhead.color,
fontSize: 16,
fontWeight: FontWeight.w500,
fontFamily: 'Poppins',
decoration: TextDecoration.none
),
),
),
ListView.separated(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
itemCount: section.length,
separatorBuilder: (context, _) => Container(
height: 1,
padding: EdgeInsets.only(left: 24),
color: Theme.of(context).textTheme.body2.decorationColor,
child: Container(
height: 1,
color: Theme.of(context).accentTextTheme.subhead.backgroundColor,
),
),
itemBuilder: (_, index2) {
final item = section[index2];
final content = item.onChanged != null
? CheckboxWidget(
value: item.value,
caption: item.caption,
onChanged: item.onChanged
)
: GestureDetector(
onTap: () async {
final List<DateTime> 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) {
dashboardViewModel.transactionFilterStore
.changeStartDate(picked.first);
dashboardViewModel.transactionFilterStore
.changeEndDate(picked.last);
}
},
child: Padding(
padding: EdgeInsets.only(left: 32),
child: Text(
item.caption,
style: TextStyle(
color: Theme.of(context).primaryTextTheme.title.color,
fontSize: 18,
fontFamily: 'Poppins',
fontWeight: FontWeight.w500,
decoration: TextDecoration.none
),
),
),
);
return FilterTile(child: content);
},
)
],
);
},
),
),
),
),
],
),
AlertCloseButton(image: backVector)
],
),
);
}
}

175
lib/src/screens/dashboard/widgets/header_row.dart
View file

@ -1,9 +1,7 @@
import 'package:cake_wallet/src/screens/dashboard/widgets/filter_widget.dart';
import 'package:flutter/material.dart';
import 'package:cake_wallet/generated/i18n.dart';
import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
import 'package:cake_wallet/src/domain/exchange/exchange_provider_description.dart';
import 'package:date_range_picker/date_range_picker.dart' as date_rage_picker;
import 'package:flutter_mobx/flutter_mobx.dart';
class HeaderRow extends StatelessWidget {
HeaderRow({this.dashboardViewModel});
@ -31,148 +29,13 @@ class HeaderRow extends StatelessWidget {
color: Colors.white
),
),
PopupMenuButton<int>(
itemBuilder: (context) => [
PopupMenuItem(
enabled: false,
value: -1,
child: Text(S.of(context).transactions,
style: TextStyle(
fontWeight: FontWeight.bold,
color: Theme.of(context).primaryTextTheme.title.color))),
PopupMenuItem(
value: 0,
child: Observer(
builder: (_) => Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: [
Text(S.of(context).incoming,
style: TextStyle(
color: Theme.of(context).primaryTextTheme.title.color
),
),
Checkbox(
value: dashboardViewModel
.transactionFilterStore
.displayIncoming,
onChanged: (value) => dashboardViewModel
.transactionFilterStore
.toggleIncoming()
)
]))),
PopupMenuItem(
value: 1,
child: Observer(
builder: (_) => Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: [
Text(S.of(context).outgoing,
style: TextStyle(
color: Theme.of(context).primaryTextTheme.title.color
)
),
Checkbox(
value: dashboardViewModel
.transactionFilterStore
.displayOutgoing,
onChanged: (value) => dashboardViewModel
.transactionFilterStore
.toggleOutgoing(),
)
]))),
PopupMenuItem(
value: 2,
child:
Text(S.of(context).transactions_by_date,
style: TextStyle(
color: Theme.of(context).primaryTextTheme.title.color
)
)),
PopupMenuDivider(),
PopupMenuItem(
enabled: false,
value: -1,
child: Text(S.of(context).trades,
style: TextStyle(
fontWeight: FontWeight.bold,
color: Theme.of(context).primaryTextTheme.title.color))),
PopupMenuItem(
value: 3,
child: Observer(
builder: (_) => Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: [
Text('XMR.TO',
style: TextStyle(
color: Theme.of(context).primaryTextTheme.title.color
)
),
Checkbox(
value: dashboardViewModel
.tradeFilterStore
.displayXMRTO,
onChanged: (value) => dashboardViewModel
.tradeFilterStore
.toggleDisplayExchange(
ExchangeProviderDescription
.xmrto),
)
]))),
PopupMenuItem(
value: 4,
child: Observer(
builder: (_) => Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: [
Text('Change.NOW',
style: TextStyle(
color: Theme.of(context).primaryTextTheme.title.color
)
),
Checkbox(
value: dashboardViewModel
.tradeFilterStore
.displayChangeNow,
onChanged: (value) => dashboardViewModel
.tradeFilterStore
.toggleDisplayExchange(
ExchangeProviderDescription
.changeNow),
)
]))),
PopupMenuItem(
value: 5,
child: Observer(
builder: (_) => Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: [
Text('MorphToken',
style: TextStyle(
color: Theme.of(context).primaryTextTheme.title.color
)
),
Checkbox(
value: dashboardViewModel
.tradeFilterStore
.displayMorphToken,
onChanged: (value) => dashboardViewModel
.tradeFilterStore
.toggleDisplayExchange(
ExchangeProviderDescription
.morphToken),
)
])))
],
GestureDetector(
onTap: () {
showDialog<void>(
context: context,
builder: (context) => FilterWidget(dashboardViewModel: dashboardViewModel)
);
},
child: Container(
height: 36,
width: 36,
@ -182,27 +45,7 @@ class HeaderRow extends StatelessWidget {
),
child: filterIcon,
),
onSelected: (item) async {
if (item == 2) {
final 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) {
dashboardViewModel.transactionFilterStore
.changeStartDate(picked.first);
dashboardViewModel.transactionFilterStore
.changeEndDate(picked.last);
}
}
},
),
)
],
),
);

43
lib/src/screens/dashboard/widgets/menu_widget.dart
View file

@ -17,8 +17,8 @@ class MenuWidget extends StatefulWidget {
}
class MenuWidgetState extends State<MenuWidget> {
final moneroIcon = Image.asset('assets/images/monero_menu.png');
final bitcoinIcon = Image.asset('assets/images/bitcoin_menu.png');
Image moneroIcon;
Image bitcoinIcon;
final largeScreen = 731;
double menuWidth;
@ -36,10 +36,10 @@ class MenuWidgetState extends State<MenuWidget> {
screenWidth = 0;
screenHeight = 0;
headerHeight = 125;
headerHeight = 137;
tileHeight = 75;
fromTopEdge = 30;
fromBottomEdge = 21;
fromTopEdge = 50;
fromBottomEdge = 30;
super.initState();
WidgetsBinding.instance.addPostFrameCallback(afterLayout);
@ -67,6 +67,15 @@ class MenuWidgetState extends State<MenuWidget> {
final walletMenu = WalletMenu(context);
final itemCount = walletMenu.items.length;
moneroIcon = Image.asset('assets/images/monero_menu.png',
color: Theme.of(context)
.accentTextTheme
.overline.decorationColor);
bitcoinIcon = Image.asset('assets/images/bitcoin_menu.png',
color: Theme.of(context)
.accentTextTheme
.overline.decorationColor);
return Row(
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.center,
@ -87,17 +96,22 @@ class MenuWidgetState extends State<MenuWidget> {
topLeft: Radius.circular(24),
bottomLeft: Radius.circular(24)),
child: Container(
width: menuWidth,
height: double.infinity,
color: Theme.of(context).textTheme.body2.color,
alignment: Alignment.topCenter,
color: Theme.of(context).textTheme.body2.decorationColor,
child: ListView.separated(
padding: EdgeInsets.only(top: 0),
itemBuilder: (_, index) {
if (index == 0) {
return Container(
height: headerHeight,
color: Theme.of(context).textTheme.body2.color,
decoration: BoxDecoration(
gradient: LinearGradient(colors: [
Theme.of(context).accentTextTheme.display1.color,
Theme.of(context).accentTextTheme.display1.decorationColor,
],
begin: Alignment.topLeft,
end: Alignment.bottomRight),
),
padding: EdgeInsets.only(
left: 24,
top: fromTopEdge,
@ -121,8 +135,7 @@ class MenuWidgetState extends State<MenuWidget> {
Text(
widget.name,
style: TextStyle(
color: Theme.of(context).textTheme
.display2.color,
color: Colors.white,
fontSize: 16,
fontWeight: FontWeight.bold),
),
@ -131,8 +144,8 @@ class MenuWidgetState extends State<MenuWidget> {
widget.subname,
style: TextStyle(
color: Theme.of(context)
.primaryTextTheme
.caption.color,
.accentTextTheme
.overline.decorationColor,
fontWeight: FontWeight.w500,
fontSize: 12),
)
@ -194,7 +207,7 @@ class MenuWidgetState extends State<MenuWidget> {
color: Theme.of(context).primaryTextTheme.caption.decorationColor,
),
itemCount: itemCount + 1),
),
)
)
)
],

58
lib/src/screens/send/widgets/base_send_widget.dart
View file

@ -247,26 +247,44 @@ class BaseSendWidget extends StatelessWidget {
),
isTemplate
? Offstage()
: Padding(
padding: const EdgeInsets.only(top: 24),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(S.of(context).send_estimated_fee,
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w500,
color: Theme.of(context).primaryTextTheme.display2.color,
)),
Text(
sendViewModel.estimatedFee.toString() + ' '
+ sendViewModel.currency.title,
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w600,
color: Theme.of(context).primaryTextTheme.display2.color,
))
],
: GestureDetector(
onTap: () {},
child: Container(
padding: EdgeInsets.only(top: 24),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(S.of(context).send_estimated_fee,
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w500,
//color: Theme.of(context).primaryTextTheme.display2.color,
color: Colors.white
)),
Container(
child: Row(
children: <Widget>[
Text(
sendViewModel.estimatedFee.toString() + ' '
+ sendViewModel.currency.title,
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w600,
//color: Theme.of(context).primaryTextTheme.display2.color,
color: Colors.white
)),
Padding(
padding: EdgeInsets.only(left: 5),
child: Icon(
Icons.arrow_forward_ios,
size: 12,
color: Colors.white,),
)
],
),
)
],
),
),
)
],

42
lib/src/screens/wallet_list/wallet_list_page.dart
View file

@ -37,11 +37,14 @@ class WalletListBodyState extends State<WalletListBody> {
final bitcoinIcon =
Image.asset('assets/images/bitcoin.png', height: 24, width: 24);
final scrollController = ScrollController();
final double tileHeight = 60;
@override
Widget build(BuildContext context) {
final newWalletImage = Image.asset('assets/images/new_wallet.png',
height: 12, width: 12, color: Palette.oceanBlue);
height: 12,
width: 12,
color: Theme.of(context).accentTextTheme.headline.decorationColor);
final restoreWalletImage = Image.asset('assets/images/restore_wallet.png',
height: 12,
width: 12,
@ -58,7 +61,7 @@ class WalletListBodyState extends State<WalletListBody> {
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
separatorBuilder: (_, index) => Divider(
color: Theme.of(context).backgroundColor, height: 16),
color: Theme.of(context).backgroundColor, height: 32),
itemCount: widget.walletListViewModel.wallets.length,
itemBuilder: (__, index) {
final wallet = widget.walletListViewModel.wallets[index];
@ -80,7 +83,7 @@ class WalletListBodyState extends State<WalletListBody> {
.generateImagesForWalletMenu(wallet.isCurrent);
return Container(
height: 108,
height: tileHeight,
width: double.infinity,
child: CustomScrollView(
scrollDirection: Axis.horizontal,
@ -90,7 +93,7 @@ class WalletListBodyState extends State<WalletListBody> {
pinned: false,
floating: true,
delegate: WalletTile(
min: screenWidth - 228,
min: screenWidth - 170,
max: screenWidth,
image: _imageFor(type: wallet.type),
walletName: wallet.name,
@ -101,10 +104,11 @@ class WalletListBodyState extends State<WalletListBody> {
delegate:
SliverChildBuilderDelegate((context, index) {
final item = items[index];
final color = colors[index];
final image = images[index];
final firstColor = colors[index*2];
final secondColor = colors[index*2 + 1];
final radius = index == 0 ? 12.0 : 0.0;
final radius = index == 0 ? 10.0 : 0.0;
return GestureDetector(
onTap: () {
@ -117,8 +121,8 @@ class WalletListBodyState extends State<WalletListBody> {
wallet.isCurrent);
},
child: Container(
height: 108,
width: 108,
height: tileHeight,
width: 80,
color: Theme.of(context).backgroundColor,
child: Container(
padding: EdgeInsets.only(left: 5, right: 5),
@ -126,18 +130,27 @@ class WalletListBodyState extends State<WalletListBody> {
borderRadius: BorderRadius.only(
topLeft: Radius.circular(radius),
bottomLeft: Radius.circular(radius)),
color: color),
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
firstColor,
secondColor
]
)
),
child: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
image,
SizedBox(height: 5),
SizedBox(height: 2),
Text(
item,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 12,
fontSize: 7,
fontWeight: FontWeight.w500,
color: Colors.white),
)
],
@ -159,9 +172,8 @@ class WalletListBodyState extends State<WalletListBody> {
Navigator.of(context).pushNamed(Routes.newWalletType),
image: newWalletImage,
text: S.of(context).wallet_list_create_new_wallet,
color: Colors.white,
textColor: Palette.oceanBlue,
borderColor: Palette.oceanBlue,
color: Theme.of(context).accentTextTheme.subtitle.decorationColor,
textColor: Theme.of(context).accentTextTheme.headline.decorationColor,
),
SizedBox(height: 10.0),
PrimaryImageButton(
@ -169,7 +181,7 @@ class WalletListBodyState extends State<WalletListBody> {
.pushNamed(Routes.restoreWalletType),
image: restoreWalletImage,
text: S.of(context).wallet_list_restore_wallet,
color: Theme.of(context).primaryTextTheme.overline.color,
color: Theme.of(context).accentTextTheme.caption.color,
textColor: Theme.of(context).primaryTextTheme.title.color)
])),
));

50
lib/src/screens/wallet_list/wallet_menu.dart
View file

@ -6,6 +6,7 @@ import 'package:cake_wallet/generated/i18n.dart';
import 'package:cake_wallet/src/stores/wallet_list/wallet_list_store.dart';
import 'package:cake_wallet/view_model/wallet_list/wallet_list_item.dart';
import 'package:cake_wallet/src/screens/auth/auth_page.dart';
import 'package:cake_wallet/palette.dart';
class WalletMenu {
WalletMenu(this.context, this.walletListViewModel);
@ -20,18 +21,25 @@ class WalletMenu {
S.current.rescan
];
final List<Color> listColors = [
Colors.blue,
Colors.orange,
Colors.red,
Colors.green
final List<Color> firstColors = [
Palette.cornflower,
Palette.moderateOrangeYellow,
Palette.lightRed,
Palette.shineGreen
];
final List<Color> secondColors = [
Palette.royalBlue,
Palette.moderateOrange,
Palette.persianRed,
Palette.moderateGreen
];
final List<Image> listImages = [
Image.asset('assets/images/load.png', height: 32, width: 32, color: Colors.white),
Image.asset('assets/images/eye_action.png', height: 32, width: 32, color: Colors.white),
Image.asset('assets/images/trash.png', height: 32, width: 32, color: Colors.white),
Image.asset('assets/images/scanner.png', height: 32, width: 32, color: Colors.white)
Image.asset('assets/images/load.png', height: 24, width: 24, color: Colors.white),
Image.asset('assets/images/eye_action.png', height: 24, width: 24, color: Colors.white),
Image.asset('assets/images/trash.png', height: 24, width: 24, color: Colors.white),
Image.asset('assets/images/scanner.png', height: 24, width: 24, color: Colors.white)
];
List<String> generateItemsForWalletMenu(bool isCurrentWallet) {
@ -46,18 +54,30 @@ class WalletMenu {
}
List<Color> generateColorsForWalletMenu(bool isCurrentWallet) {
final colors = List<Color>();
final colors = <Color>[];
if (!isCurrentWallet) colors.add(listColors[0]);
if (isCurrentWallet) colors.add(listColors[1]);
if (!isCurrentWallet) colors.add(listColors[2]);
if (isCurrentWallet) colors.add(listColors[3]);
if (!isCurrentWallet) {
colors.add(firstColors[0]);
colors.add(secondColors[0]);
}
if (isCurrentWallet) {
colors.add(firstColors[1]);
colors.add(secondColors[1]);
}
if (!isCurrentWallet) {
colors.add(firstColors[2]);
colors.add(secondColors[2]);
}
if (isCurrentWallet) {
colors.add(firstColors[3]);
colors.add(secondColors[3]);
}
return colors;
}
List<Image> generateImagesForWalletMenu(bool isCurrentWallet) {
final images = List<Image>();
final images = <Image>[];
if (!isCurrentWallet) images.add(listImages[0]);
if (isCurrentWallet) images.add(listImages[1]);

67
lib/src/screens/wallet_list/widgets/wallet_tile.dart
View file

@ -17,17 +17,18 @@ class WalletTile extends SliverPersistentHeaderDelegate {
final String walletName;
final String walletAddress;
final bool isCurrent;
final double tileHeight = 60;
@override
Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) {
var opacity = 1 - shrinkOffset / (max - min);
opacity = opacity >= 0 ? opacity : 0;
var panelWidth = 12 * opacity;
panelWidth = panelWidth < 12 ? 0 : 12;
var panelWidth = 10 * opacity;
panelWidth = panelWidth < 10 ? 0 : 10;
final currentColor = isCurrent
? Theme.of(context).accentTextTheme.caption.color
? Theme.of(context).accentTextTheme.subtitle.decorationColor
: Theme.of(context).backgroundColor;
return Stack(
@ -38,7 +39,7 @@ class WalletTile extends SliverPersistentHeaderDelegate {
top: 0,
right: max - 4,
child: Container(
height: 108,
height: tileHeight,
width: 4,
decoration: BoxDecoration(
borderRadius: BorderRadius.only(topRight: Radius.circular(4), bottomRight: Radius.circular(4)),
@ -48,13 +49,30 @@ class WalletTile extends SliverPersistentHeaderDelegate {
),
Positioned(
top: 0,
right: 12,
right: 10,
child: Container(
height: 108,
width: max - 16,
height: tileHeight,
width: max - 14,
padding: EdgeInsets.only(left: 20, right: 20),
color: Theme.of(context).backgroundColor,
child: Column(
alignment: Alignment.centerLeft,
child: Row(
//mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
image,
SizedBox(width: 10),
Text(
walletName,
style: TextStyle(
fontSize: 22,
fontWeight: FontWeight.w600,
color: Theme.of(context).primaryTextTheme.title.color
),
)
],
),
/*Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
@ -92,7 +110,7 @@ class WalletTile extends SliverPersistentHeaderDelegate {
)
: Offstage()
],
),
),*/
),
),
Positioned(
@ -101,29 +119,18 @@ class WalletTile extends SliverPersistentHeaderDelegate {
child: Opacity(
opacity: opacity,
child: Container(
height: 108,
height: tileHeight,
width: panelWidth,
padding: EdgeInsets.only(
top: 1,
left: 1,
bottom: 1
),
decoration: BoxDecoration(
borderRadius: BorderRadius.only(topLeft: Radius.circular(12), bottomLeft: Radius.circular(12)),
color: Theme.of(context).accentTextTheme.subtitle.color
),
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.only(topLeft: Radius.circular(12), bottomLeft: Radius.circular(12)),
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Theme.of(context).accentTextTheme.caption.backgroundColor,
Theme.of(context).accentTextTheme.caption.decorationColor
]
)
),
borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)),
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Theme.of(context).accentTextTheme.headline.color,
Theme.of(context).accentTextTheme.headline.backgroundColor
]
)
),
),
)

81
lib/src/widgets/checkbox_widget.dart Normal file
View file

@ -0,0 +1,81 @@
import 'dart:ui';
import 'package:cake_wallet/palette.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class CheckboxWidget extends StatefulWidget {
CheckboxWidget({
@required this.value,
@required this.caption,
@required this.onChanged});
final bool value;
final String caption;
final Function(bool) onChanged;
@override
CheckboxWidgetState createState() => CheckboxWidgetState(value, caption, onChanged);
}
class CheckboxWidgetState extends State<CheckboxWidget> {
CheckboxWidgetState(this.value, this.caption, this.onChanged);
bool value;
String caption;
Function(bool) onChanged;
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
value = !value;
onChanged(value);
setState(() {});
},
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Container(
height: 16,
width: 16,
decoration: BoxDecoration(
color: value
? Palette.blueCraiola
: Theme.of(context).accentTextTheme.subhead.decorationColor,
borderRadius: BorderRadius.all(Radius.circular(2)),
border: Border.all(
color: value
? Palette.blueCraiola
: Theme.of(context).accentTextTheme.overline.color,
width: 1
)
),
child: value
? Center(
child: Icon(
Icons.done,
color: Colors.white,
size: 14,
),
)
: Offstage(),
),
Padding(
padding: EdgeInsets.only(left: 16),
child: Text(
caption,
style: TextStyle(
color: Theme.of(context).primaryTextTheme.title.color,
fontSize: 18,
fontFamily: 'Poppins',
fontWeight: FontWeight.w500,
decoration: TextDecoration.none
),
),
)
],
),
);
}
}

2
lib/store/dashboard/trade_filter_store.dart
View file

@ -43,7 +43,7 @@ abstract class TradeFilterStoreBase with Store {
final needToFilter = !displayChangeNow || !displayXMRTO || !displayMorphToken;
return needToFilter
? trades
? _trades
.where((item) =>
(displayXMRTO &&
item.trade.provider == ExchangeProviderDescription.xmrto) ||

62
lib/themes.dart
View file

@ -132,19 +132,26 @@ class Themes {
subtitle: TextStyle(
color: Palette.darkBlueCraiola, // QR code (exchange trade page)
backgroundColor: Palette.wildPeriwinkle, // divider (exchange trade page)
decorationColor: Palette.darkLavender // selected item
decorationColor: Palette.blueCraiola // crete new wallet button background (wallet list page)
),
headline: TextStyle(
color: Palette.moderateLavender, // first gradient color of wallet action buttons (wallet list page)
backgroundColor: Palette.moderateLavender, // second gradient color of wallet action buttons (wallet list page)
decorationColor: Colors.white // restore wallet button text color (wallet list page)
),
subhead: TextStyle(
color: Palette.darkGray, // titles color (filter widget)
backgroundColor: Palette.periwinkle, // divider color (filter widget)
decorationColor: Colors.white // checkbox background (filter widget)
),
overline: TextStyle(
color: Palette.wildPeriwinkle, // checkbox bounds (filter widget)
decorationColor: Colors.white, // menu subname
),
display1: TextStyle(
color: Palette.blueCraiola, // first gradient color (menu header)
decorationColor: Palette.pinkFlamingo // second gradient color(menu header)
),
headline: TextStyle(
color: Palette.darkLavender, // faq background
backgroundColor: Palette.lavender // faq extension
)
),
@ -288,19 +295,26 @@ class Themes {
subtitle: TextStyle(
color: PaletteDark.lightBlueGrey, // QR code (exchange trade page)
backgroundColor: PaletteDark.deepVioletBlue, // divider (exchange trade page)
decorationColor: PaletteDark.headerNightBlue // selected item
decorationColor: Colors.white // crete new wallet button background (wallet list page)
),
headline: TextStyle(
color: PaletteDark.distantBlue, // first gradient color of wallet action buttons (wallet list page)
backgroundColor: PaletteDark.distantNightBlue, // second gradient color of wallet action buttons (wallet list page)
decorationColor: Palette.darkBlueCraiola // restore wallet button text color (wallet list page)
),
subhead: TextStyle(
color: Colors.white, // titles color (filter widget)
backgroundColor: PaletteDark.darkOceanBlue, // divider color (filter widget)
decorationColor: PaletteDark.wildVioletBlue.withOpacity(0.3) // checkbox background (filter widget)
),
overline: TextStyle(
color: PaletteDark.wildVioletBlue, // checkbox bounds (filter widget)
decorationColor: PaletteDark.darkCyanBlue, // menu subname
),
display1: TextStyle(
color: PaletteDark.deepPurpleBlue, // first gradient color (menu header)
decorationColor: PaletteDark.deepPurpleBlue // second gradient color(menu header)
),
headline: TextStyle(
color: PaletteDark.lightNightBlue, // faq background
backgroundColor: PaletteDark.headerNightBlue // faq extension
)
),

41
lib/view_model/dashboard/dashboard_view_model.dart
View file

@ -8,6 +8,7 @@ import 'package:cake_wallet/src/domain/common/transaction_info.dart';
import 'package:cake_wallet/src/domain/exchange/exchange_provider_description.dart';
import 'package:cake_wallet/src/domain/exchange/trade.dart';
import 'package:cake_wallet/view_model/dashboard/balance_view_model.dart';
import 'package:cake_wallet/view_model/dashboard/filter_item.dart';
import 'package:cake_wallet/view_model/dashboard/trade_list_item.dart';
import 'package:cake_wallet/view_model/dashboard/transaction_list_item.dart';
import 'package:cake_wallet/view_model/dashboard/action_list_item.dart';
@ -35,6 +36,44 @@ abstract class DashboardViewModelBase with Store {
this.tradeFilterStore,
this.transactionFilterStore}) {
filterItems = {S.current.transactions : [
FilterItem(
value: transactionFilterStore.displayIncoming,
caption: S.current.incoming,
onChanged: (value) => transactionFilterStore.toggleIncoming()
),
FilterItem(
value: transactionFilterStore.displayOutgoing,
caption: S.current.outgoing,
onChanged: (value) => transactionFilterStore.toggleOutgoing()
),
FilterItem(
value: false,
caption: S.current.transactions_by_date,
onChanged: null
),
],
S.current.trades : [
FilterItem(
value: tradeFilterStore.displayXMRTO,
caption: 'XMR.TO',
onChanged: (value) => tradeFilterStore
.toggleDisplayExchange(ExchangeProviderDescription.xmrto)
),
FilterItem(
value: tradeFilterStore.displayChangeNow,
caption: 'Change.NOW',
onChanged: (value) => tradeFilterStore
.toggleDisplayExchange(ExchangeProviderDescription.changeNow)
),
FilterItem(
value: tradeFilterStore.displayMorphToken,
caption: 'MorphToken',
onChanged: (value) => tradeFilterStore
.toggleDisplayExchange(ExchangeProviderDescription.morphToken)
),
]};
name = appStore.wallet?.name;
wallet ??= appStore.wallet;
type = wallet.type;
@ -125,6 +164,8 @@ abstract class DashboardViewModelBase with Store {
TransactionFilterStore transactionFilterStore;
Map<String, List<FilterItem>> filterItems;
ReactionDisposer _reaction;
void _onWalletChange(WalletBase wallet) {

7
lib/view_model/dashboard/filter_item.dart Normal file
View file

@ -0,0 +1,7 @@
class FilterItem {
FilterItem({this.value, this.caption, this.onChanged});
bool value;
String caption;
Function(bool) onChanged;
}

5
lib/view_model/exchange/exchange_trade_view_model.dart
View file

@ -35,7 +35,8 @@ abstract class ExchangeTradeViewModelBase with Store {
break;
}
items = ObservableList.of([
items = ObservableList<ExchangeTradeItem>();
items.addAll([
ExchangeTradeItem(
title: S.current.id,
data: '${trade.id}',
@ -69,7 +70,7 @@ abstract class ExchangeTradeViewModelBase with Store {
bool isSendable;
@observable
ObservableList<ExchangeTradeItem> items;// = ObservableList();
ObservableList<ExchangeTradeItem> items;
ExchangeProvider _provider;