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

Merge pull request #107 from cake-tech/CAKE-45-replace-wallet-menu

Browse source 
CAKE-45 | created wallet menu item and wallet menu alert; deleted wal…
This commit is contained in:
M 2020-09-26 14:19:53 +03:00
commit 6e38efd327
5 changed files with 214 additions and 307 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -1,8 +1,8 @@
import 'package:cake_wallet/src/screens/wallet_list/widgets/wallet_menu_alert.dart';
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/entities/wallet_type.dart';
import 'package:cake_wallet/view_model/wallet_list/wallet_list_view_model.dart';
@ -10,7 +10,6 @@ import 'package:cake_wallet/src/widgets/primary_button.dart';
import 'package:cake_wallet/src/screens/base_page.dart';
import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
import 'package:cake_wallet/src/screens/wallet_list/wallet_menu.dart';
import 'package:cake_wallet/src/screens/wallet_list/widgets/wallet_tile.dart';
class WalletListPage extends BasePage {
WalletListPage({this.walletListViewModel});
@ -65,95 +64,66 @@ class WalletListBodyState extends State<WalletListBody> {
itemCount: widget.walletListViewModel.wallets.length,
itemBuilder: (__, index) {
final wallet = widget.walletListViewModel.wallets[index];
final screenWidth = MediaQuery.of(context).size.width;
final walletMenu = WalletMenu(context, widget.walletListViewModel);
final items =
walletMenu.generateItemsForWalletMenu(wallet.isCurrent);
final colors = walletMenu
.generateColorsForWalletMenu(wallet.isCurrent);
final images = walletMenu
.generateImagesForWalletMenu(wallet.isCurrent);
final currentColor = wallet.isCurrent
? Theme.of(context).accentTextTheme.subtitle.decorationColor
: Theme.of(context).backgroundColor;
return Container(
height: tileHeight,
width: double.infinity,
child: CustomScrollView(
scrollDirection: Axis.horizontal,
controller: scrollController,
slivers: <Widget>[
SliverPersistentHeader(
pinned: false,
floating: true,
delegate: WalletTile(
min: screenWidth - 170,
max: screenWidth,
image: _imageFor(type: wallet.type),
walletName: wallet.name,
walletAddress: '', //shortAddress,
isCurrent: wallet.isCurrent),
),
SliverList(
delegate:
SliverChildBuilderDelegate((context, index) {
final item = items[index];
final image = images[index];
final firstColor = colors[index*2];
final secondColor = colors[index*2 + 1];
final radius = index == 0 ? 10.0 : 0.0;
return GestureDetector(
onTap: () {
scrollController.animateTo(0.0,
duration: Duration(milliseconds: 500),
curve: Curves.fastOutSlowIn);
walletMenu.action(
walletMenu.listItems.indexOf(item),
wallet,
wallet.isCurrent);
},
child: Container(
height: tileHeight,
width: 80,
color: Theme.of(context).backgroundColor,
return GestureDetector(
onTap: () {
showDialog<void>(
context: context,
builder: (dialogContext) {
return WalletMenuAlert(
wallet: wallet,
walletMenu: walletMenu,
items: items);
}
);
},
child: Container(
height: tileHeight,
width: double.infinity,
child: Row(
children: <Widget>[
Container(
height: tileHeight,
width: 4,
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topRight: Radius.circular(4),
bottomRight: Radius.circular(4)),
color: currentColor
),
),
Expanded(
child: Container(
padding: EdgeInsets.only(left: 5, right: 5),
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(radius),
bottomLeft: Radius.circular(radius)),
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
firstColor,
secondColor
]
height: tileHeight,
padding: EdgeInsets.only(left: 20, right: 20),
color: Theme.of(context).backgroundColor,
alignment: Alignment.centerLeft,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
_imageFor(type: wallet.type),
SizedBox(width: 10),
Text(
wallet.name,
style: TextStyle(
fontSize: 22,
fontWeight: FontWeight.w600,
color: Theme.of(context).primaryTextTheme.title.color
),
)
),
child: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
image,
SizedBox(height: 2),
Text(
item,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 7,
fontWeight: FontWeight.w500,
color: Colors.white),
)
],
),
],
),
),
),
);
}, childCount: items.length))
],
),
),
],
),
)
);
}),
),

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

@ -1,11 +1,10 @@
import 'package:cake_wallet/src/screens/wallet_list/wallet_menu_item.dart';
import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart';
import 'package:cake_wallet/utils/show_pop_up.dart';
import 'package:cake_wallet/view_model/wallet_list/wallet_list_view_model.dart';
import 'package:flutter/material.dart';
import 'package:cake_wallet/routes.dart';
import 'package:provider/provider.dart';
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';
@ -16,85 +15,46 @@ class WalletMenu {
final WalletListViewModel walletListViewModel;
final BuildContext context;
final List<String> listItems = [
S.current.wallet_list_load_wallet,
S.current.show_seed,
S.current.remove,
S.current.rescan
final List<WalletMenuItem> menuItems = [
WalletMenuItem(
title: S.current.wallet_list_load_wallet,
firstGradientColor: Palette.cornflower,
secondGradientColor: Palette.royalBlue,
image: Image.asset('assets/images/load.png',
height: 24, width: 24, color: Colors.white)),
WalletMenuItem(
title: S.current.show_seed,
firstGradientColor: Palette.moderateOrangeYellow,
secondGradientColor: Palette.moderateOrange,
image: Image.asset('assets/images/eye_action.png',
height: 24, width: 24, color: Colors.white)),
WalletMenuItem(
title: S.current.remove,
firstGradientColor: Palette.lightRed,
secondGradientColor: Palette.persianRed,
image: Image.asset('assets/images/trash.png',
height: 24, width: 24, color: Colors.white)),
WalletMenuItem(
title: S.current.rescan,
firstGradientColor: Palette.shineGreen,
secondGradientColor: Palette.moderateGreen,
image: Image.asset('assets/images/scanner.png',
height: 24, width: 24, color: Colors.white))
];
final List<Color> firstColors = [
Palette.cornflower,
Palette.moderateOrangeYellow,
Palette.lightRed,
Palette.shineGreen
];
List<WalletMenuItem> generateItemsForWalletMenu(bool isCurrentWallet) {
final items = List<WalletMenuItem>();
final List<Color> secondColors = [
Palette.royalBlue,
Palette.moderateOrange,
Palette.persianRed,
Palette.moderateGreen
];
final List<Image> listImages = [
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) {
final items = List<String>();
if (!isCurrentWallet) items.add(listItems[0]);
if (isCurrentWallet) items.add(listItems[1]);
if (!isCurrentWallet) items.add(listItems[2]);
if (isCurrentWallet) items.add(listItems[3]);
if (!isCurrentWallet) items.add(menuItems[0]);
if (isCurrentWallet) items.add(menuItems[1]);
if (!isCurrentWallet) items.add(menuItems[2]);
if (isCurrentWallet) items.add(menuItems[3]);
return items;
}
List<Color> generateColorsForWalletMenu(bool isCurrentWallet) {
final colors = <Color>[];
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 = <Image>[];
if (!isCurrentWallet) images.add(listImages[0]);
if (isCurrentWallet) images.add(listImages[1]);
if (!isCurrentWallet) images.add(listImages[2]);
if (isCurrentWallet) images.add(listImages[3]);
return images;
}
Future<void> action(
int index, WalletListItem wallet, bool isCurrentWallet) async {
int index, WalletListItem wallet) async {
switch (index) {
case 0:
await Navigator.of(context).pushNamed(Routes.auth, arguments:

16
lib/src/screens/wallet_list/wallet_menu_item.dart Normal file
View file

@ -0,0 +1,16 @@
import 'dart:ui';
import 'package:flutter/cupertino.dart';
class WalletMenuItem {
WalletMenuItem({
@required this.title,
@required this.firstGradientColor,
@required this.secondGradientColor,
@required this.image
});
final String title;
final Color firstGradientColor;
final Color secondGradientColor;
final Image image;
}

112
lib/src/screens/wallet_list/widgets/wallet_menu_alert.dart Normal file
View file

@ -0,0 +1,112 @@
import 'dart:ui';
import 'package:cake_wallet/palette.dart';
import 'package:cake_wallet/src/screens/wallet_list/wallet_menu.dart';
import 'package:cake_wallet/src/screens/wallet_list/wallet_menu_item.dart';
import 'package:cake_wallet/view_model/wallet_list/wallet_list_item.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';
class WalletMenuAlert extends StatelessWidget {
WalletMenuAlert({
@required this.wallet,
@required this.walletMenu,
@required this.items
});
final WalletListItem wallet;
final WalletMenu walletMenu;
final List<WalletMenuItem> items;
final closeButton = Image.asset('assets/images/close.png',
color: Palette.darkBlueCraiola,
);
@override
Widget build(BuildContext context) {
return AlertBackground(
child: Stack(
alignment: Alignment.center,
children: <Widget>[
Padding(
padding: EdgeInsets.only(
left: 24,
right: 24,
),
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(14)),
child: Container(
color: Theme.of(context).textTheme.body2.decorationColor,
padding: EdgeInsets.only(left: 24),
child: ListView.separated(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
itemCount: items.length,
separatorBuilder: (context, _) => Container(
height: 1,
color: Theme.of(context).accentTextTheme.subhead.backgroundColor,
),
itemBuilder: (_, index) {
final item = items[index];
return GestureDetector(
onTap: () {
Navigator.of(context).pop();
walletMenu.action(
walletMenu.menuItems.indexOf(item),
wallet);
},
child: Container(
height: 60,
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Container(
height: 32,
width: 32,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(4)),
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
item.firstGradientColor,
item.secondGradientColor
]
)
),
child: Center(
child: item.image,
),
),
SizedBox(width: 12),
Expanded(
child: Text(
item.title,
style: TextStyle(
color: Theme.of(context).primaryTextTheme.title.color,
fontSize: 18,
fontFamily: 'Poppins',
fontWeight: FontWeight.w500,
decoration: TextDecoration.none
),
)
)
],
),
),
);
},
),
),
),
),
AlertCloseButton(image: closeButton)
],
),
);
}
}

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

@ -1,151 +0,0 @@
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
class WalletTile extends SliverPersistentHeaderDelegate {
WalletTile({
@required this.min,
@required this.max,
@required this.image,
@required this.walletName,
@required this.walletAddress,
@required this.isCurrent
});
final double min;
final double max;
final Image image;
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 = 10 * opacity;
panelWidth = panelWidth < 10 ? 0 : 10;
final currentColor = isCurrent
? Theme.of(context).accentTextTheme.subtitle.decorationColor
: Theme.of(context).backgroundColor;
return Stack(
fit: StackFit.expand,
overflow: Overflow.visible,
children: <Widget>[
Positioned(
top: 0,
right: max - 4,
child: Container(
height: tileHeight,
width: 4,
decoration: BoxDecoration(
borderRadius: BorderRadius.only(topRight: Radius.circular(4), bottomRight: Radius.circular(4)),
color: currentColor
),
),
),
Positioned(
top: 0,
right: 10,
child: Container(
height: tileHeight,
width: max - 14,
padding: EdgeInsets.only(left: 20, right: 20),
color: Theme.of(context).backgroundColor,
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>[
Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
image,
SizedBox(width: 10),
Text(
walletName,
style: TextStyle(
fontSize: 22,
fontWeight: FontWeight.bold,
color: Theme.of(context).primaryTextTheme.title.color
),
)
],
),
isCurrent ? SizedBox(height: 5) : Offstage(),
isCurrent
? Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
SizedBox(width: 34),
Text(
walletAddress,
style: TextStyle(
fontSize: 12,
color: Theme.of(context).primaryTextTheme.caption.color
),
)
],
)
: Offstage()
],
),*/
),
),
Positioned(
top: 0,
right: 0,
child: Opacity(
opacity: opacity,
child: Container(
height: tileHeight,
width: panelWidth,
decoration: BoxDecoration(
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
]
)
),
),
)
),
],
);
}
@override
double get maxExtent => max;
@override
double get minExtent => min;
@override
bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) => true;
}