Ecosystem/stack_wallet
1
0
Fork 0
mirror of https://github.com/cypherstack/stack_wallet.git synced 2024-11-17 17:57:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

wallet navigation bar widget redesign

Browse source
This commit is contained in:
julian 2023-03-10 12:42:45 -06:00
parent dea92f4adf
commit 244b4992ed
11 changed files with 965 additions and 959 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

592
lib/pages/wallet_view/sub_widgets/wallet_navigation_bar.dart
View file

@ -1,592 +0,0 @@
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:stackwallet/pages/coin_control/coin_control_view.dart';
import 'package:stackwallet/pages/paynym/paynym_claim_view.dart';
import 'package:stackwallet/pages/paynym/paynym_home_view.dart';
import 'package:stackwallet/providers/global/paynym_api_provider.dart';
import 'package:stackwallet/providers/global/prefs_provider.dart';
import 'package:stackwallet/providers/global/wallets_provider.dart';
import 'package:stackwallet/providers/wallet/my_paynym_account_state_provider.dart';
import 'package:stackwallet/services/mixins/paynym_wallet_interface.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/enums/derive_path_type_enum.dart';
import 'package:stackwallet/utilities/logger.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/widgets/loading_indicator.dart';
import 'package:tuple/tuple.dart';
class WalletNavigationBar extends ConsumerStatefulWidget {
const WalletNavigationBar({
Key? key,
required this.onReceivePressed,
required this.onSendPressed,
required this.onExchangePressed,
required this.onBuyPressed,
required this.height,
required this.enableExchange,
required this.coin,
required this.walletId,
}) : super(key: key);
final VoidCallback onReceivePressed;
final VoidCallback onSendPressed;
final VoidCallback onExchangePressed;
final VoidCallback onBuyPressed;
final double height;
final bool enableExchange;
final Coin coin;
final String walletId;
@override
ConsumerState<WalletNavigationBar> createState() =>
_WalletNavigationBarState();
}
class _WalletNavigationBarState extends ConsumerState<WalletNavigationBar> {
double scale = 0;
final duration = const Duration(milliseconds: 200);
@override
Widget build(BuildContext context) {
final showMore = ref.watch(
walletsChangeNotifierProvider.select(
(value) => value.getManager(widget.walletId).hasPaynymSupport,
),
) ||
(ref.watch(
walletsChangeNotifierProvider.select(
(value) =>
value.getManager(widget.walletId).hasCoinControlSupport,
),
) &&
ref.watch(
prefsChangeNotifierProvider.select(
(value) => value.enableCoinControl,
),
));
return Column(
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.end,
children: [
// const Spacer(),
AnimatedScale(
scale: scale,
duration: duration,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
// AnimatedOpacity(
// opacity: scale,
// duration: duration,
// child: GestureDetector(
// onTap: () {},
// child: Container(
// padding: const EdgeInsets.all(16),
// width: 146,
// decoration: BoxDecoration(
// color:
// Theme.of(context).extension<StackColors>()!.popupBG,
// boxShadow: [
// Theme.of(context)
// .extension<StackColors>()!
// .standardBoxShadow
// ],
// borderRadius: BorderRadius.circular(
// widget.height / 2.0,
// ),
// ),
// child: Row(
// mainAxisAlignment: MainAxisAlignment.center,
// children: [
// Text(
// "Whirlpool",
// style: STextStyles.w600_12(context),
// ),
// ],
// ),
// ),
// ),
// ),
// const SizedBox(
// height: 8,
// ),
if (ref.watch(
walletsChangeNotifierProvider.select(
(value) => value
.getManager(widget.walletId)
.hasCoinControlSupport,
),
) &&
ref.watch(
prefsChangeNotifierProvider.select(
(value) => value.enableCoinControl,
),
))
AnimatedOpacity(
opacity: scale,
duration: duration,
child: GestureDetector(
onTap: () {
if (mounted) {
// hide more context menu
setState(() {
scale = 0;
});
Navigator.of(context).pushNamed(
CoinControlView.routeName,
arguments: Tuple2(
widget.walletId,
CoinControlViewType.manage,
),
);
}
},
child: Container(
padding: const EdgeInsets.all(16),
width: 146,
decoration: BoxDecoration(
color:
Theme.of(context).extension<StackColors>()!.popupBG,
boxShadow: [
Theme.of(context)
.extension<StackColors>()!
.standardBoxShadow
],
borderRadius: BorderRadius.circular(
widget.height / 2.0,
),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Coin control",
style: STextStyles.buttonSmall(context),
),
const SizedBox(
width: 16,
),
SvgPicture.asset(
Assets.svg.coinControl.gamePad,
height: 20,
width: 20,
color: Theme.of(context)
.extension<StackColors>()!
.bottomNavIconIcon,
),
],
),
),
),
),
if (ref.watch(
walletsChangeNotifierProvider.select(
(value) => value
.getManager(widget.walletId)
.hasCoinControlSupport,
),
) &&
ref.watch(
prefsChangeNotifierProvider.select(
(value) => value.enableCoinControl,
),
) &&
ref.watch(
walletsChangeNotifierProvider.select(
(value) =>
value.getManager(widget.walletId).hasPaynymSupport,
),
))
const SizedBox(
height: 8,
),
if (ref.watch(walletsChangeNotifierProvider.select((value) =>
value.getManager(widget.walletId).hasPaynymSupport)))
AnimatedOpacity(
opacity: scale,
duration: duration,
child: Consumer(builder: (context, ref, __) {
return GestureDetector(
onTap: () async {
setState(() {
scale = 0;
});
unawaited(
showDialog(
context: context,
builder: (context) => const LoadingIndicator(
width: 100,
),
),
);
final manager = ref
.read(walletsChangeNotifierProvider)
.getManager(widget.walletId);
final paynymInterface =
manager.wallet as PaynymWalletInterface;
final code = await paynymInterface.getPaymentCode(
DerivePathTypeExt.primaryFor(manager.coin));
final account = await ref
.read(paynymAPIProvider)
.nym(code.toString());
Logging.instance.log(
"my nym account: $account",
level: LogLevel.Info,
);
if (mounted) {
Navigator.of(context).pop();
// check if account exists and for matching code to see if claimed
if (account.value != null &&
account.value!.codes.first.claimed) {
ref.read(myPaynymAccountStateProvider.state).state =
account.value!;
await Navigator.of(context).pushNamed(
PaynymHomeView.routeName,
arguments: widget.walletId,
);
} else {
await Navigator.of(context).pushNamed(
PaynymClaimView.routeName,
arguments: widget.walletId,
);
}
}
},
child: Container(
padding: const EdgeInsets.all(16),
width: 146,
decoration: BoxDecoration(
color: Theme.of(context)
.extension<StackColors>()!
.popupBG,
boxShadow: [
Theme.of(context)
.extension<StackColors>()!
.standardBoxShadow
],
borderRadius: BorderRadius.circular(
widget.height / 2.0,
),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Paynym",
style: STextStyles.buttonSmall(context),
),
const SizedBox(
width: 16,
),
SvgPicture.asset(
Assets.svg.robotHead,
height: 20,
width: 20,
color: Theme.of(context)
.extension<StackColors>()!
.bottomNavIconIcon,
),
],
),
),
);
}),
),
const SizedBox(
height: 8,
),
],
),
),
Container(
height: widget.height,
decoration: BoxDecoration(
color: Theme.of(context).extension<StackColors>()!.bottomNavBack,
boxShadow: [
Theme.of(context).extension<StackColors>()!.standardBoxShadow
],
borderRadius: BorderRadius.circular(
widget.height / 2.0,
),
),
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 6,
vertical: 4,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
const SizedBox(
width: 12,
),
RawMaterialButton(
constraints: const BoxConstraints(
minWidth: 66,
),
onPressed: widget.onReceivePressed,
splashColor:
Theme.of(context).extension<StackColors>()!.highlight,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
widget.height / 2.0,
),
),
child: Container(
color: Colors.transparent,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 2.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const Spacer(),
Container(
decoration: BoxDecoration(
color: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.4),
borderRadius: BorderRadius.circular(
24,
),
),
child: Padding(
padding: const EdgeInsets.all(6.0),
child: SvgPicture.asset(
Assets.svg.arrowDownLeft,
width: 12,
height: 12,
color: Theme.of(context)
.extension<StackColors>()!
.accentColorDark,
),
),
),
const SizedBox(
height: 4,
),
Text(
"Receive",
style: STextStyles.buttonSmall(context),
),
const Spacer(),
],
),
),
),
),
RawMaterialButton(
constraints: const BoxConstraints(
minWidth: 66,
),
onPressed: widget.onSendPressed,
splashColor:
Theme.of(context).extension<StackColors>()!.highlight,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
widget.height / 2.0,
),
),
child: Container(
color: Colors.transparent,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 2.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const Spacer(),
Container(
decoration: BoxDecoration(
color: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.4),
borderRadius: BorderRadius.circular(
24,
),
),
child: Padding(
padding: const EdgeInsets.all(6.0),
child: SvgPicture.asset(
Assets.svg.arrowUpRight,
width: 12,
height: 12,
color: Theme.of(context)
.extension<StackColors>()!
.accentColorDark,
),
),
),
const SizedBox(
height: 4,
),
Text(
"Send",
style: STextStyles.buttonSmall(context),
),
const Spacer(),
],
),
),
),
),
if (widget.enableExchange)
RawMaterialButton(
constraints: const BoxConstraints(
minWidth: 66,
),
onPressed: widget.onExchangePressed,
splashColor:
Theme.of(context).extension<StackColors>()!.highlight,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
widget.height / 2.0,
),
),
child: Container(
color: Colors.transparent,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 2.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const Spacer(),
SvgPicture.asset(
Assets.svg.exchange(context),
width: 24,
height: 24,
),
const SizedBox(
height: 4,
),
Text(
"Exchange",
style: STextStyles.buttonSmall(context),
),
const Spacer(),
],
),
),
),
),
if (widget.coin.hasBuySupport)
RawMaterialButton(
constraints: const BoxConstraints(
minWidth: 66,
),
onPressed: widget.onBuyPressed,
splashColor:
Theme.of(context).extension<StackColors>()!.highlight,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
widget.height / 2.0,
),
),
child: Container(
color: Colors.transparent,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 2.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const Spacer(),
SvgPicture.asset(
Assets.svg.buy(context),
width: 24,
height: 24,
),
const SizedBox(
height: 4,
),
Text(
"Buy",
style: STextStyles.buttonSmall(context),
),
const Spacer(),
],
),
),
),
),
if (showMore)
RawMaterialButton(
constraints: const BoxConstraints(
minWidth: 66,
),
onPressed: () {
if (scale == 0) {
setState(() {
scale = 1;
});
} else if (scale == 1) {
setState(() {
scale = 0;
});
}
},
splashColor:
Theme.of(context).extension<StackColors>()!.highlight,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
widget.height / 2.0,
),
),
child: Container(
color: Colors.transparent,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 2.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const Spacer(),
const SizedBox(
height: 2,
),
SvgPicture.asset(
Assets.svg.bars,
width: 20,
height: 20,
color: Theme.of(context)
.extension<StackColors>()!
.bottomNavIconIcon,
),
const SizedBox(
height: 6,
),
Text(
"More",
style: STextStyles.buttonSmall(context),
),
const Spacer(),
],
),
),
),
),
const SizedBox(
width: 12,
),
],
),
),
),
],
);
}
}

228
lib/pages/wallet_view/wallet_view.dart
View file

@ -7,21 +7,25 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/svg.dart'; import 'package:flutter_svg/svg.dart';
import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart';
import 'package:stackwallet/pages/buy_view/buy_in_wallet_view.dart'; import 'package:stackwallet/pages/buy_view/buy_in_wallet_view.dart';
import 'package:stackwallet/pages/coin_control/coin_control_view.dart';
import 'package:stackwallet/pages/exchange_view/wallet_initiated_exchange_view.dart'; import 'package:stackwallet/pages/exchange_view/wallet_initiated_exchange_view.dart';
import 'package:stackwallet/pages/home_view/home_view.dart'; import 'package:stackwallet/pages/home_view/home_view.dart';
import 'package:stackwallet/pages/notification_views/notifications_view.dart'; import 'package:stackwallet/pages/notification_views/notifications_view.dart';
import 'package:stackwallet/pages/paynym/paynym_claim_view.dart';
import 'package:stackwallet/pages/paynym/paynym_home_view.dart';
import 'package:stackwallet/pages/receive_view/receive_view.dart'; import 'package:stackwallet/pages/receive_view/receive_view.dart';
import 'package:stackwallet/pages/send_view/send_view.dart'; import 'package:stackwallet/pages/send_view/send_view.dart';
import 'package:stackwallet/pages/settings_views/wallet_settings_view/wallet_network_settings_view/wallet_network_settings_view.dart'; import 'package:stackwallet/pages/settings_views/wallet_settings_view/wallet_network_settings_view/wallet_network_settings_view.dart';
import 'package:stackwallet/pages/settings_views/wallet_settings_view/wallet_settings_view.dart'; import 'package:stackwallet/pages/settings_views/wallet_settings_view/wallet_settings_view.dart';
import 'package:stackwallet/pages/wallet_view/sub_widgets/transactions_list.dart'; import 'package:stackwallet/pages/wallet_view/sub_widgets/transactions_list.dart';
import 'package:stackwallet/pages/wallet_view/sub_widgets/wallet_navigation_bar.dart';
import 'package:stackwallet/pages/wallet_view/sub_widgets/wallet_summary.dart'; import 'package:stackwallet/pages/wallet_view/sub_widgets/wallet_summary.dart';
import 'package:stackwallet/pages/wallet_view/transaction_views/all_transactions_view.dart'; import 'package:stackwallet/pages/wallet_view/transaction_views/all_transactions_view.dart';
import 'package:stackwallet/providers/global/auto_swb_service_provider.dart'; import 'package:stackwallet/providers/global/auto_swb_service_provider.dart';
import 'package:stackwallet/providers/global/paynym_api_provider.dart';
import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/providers.dart';
import 'package:stackwallet/providers/ui/transaction_filter_provider.dart'; import 'package:stackwallet/providers/ui/transaction_filter_provider.dart';
import 'package:stackwallet/providers/ui/unread_notifications_provider.dart'; import 'package:stackwallet/providers/ui/unread_notifications_provider.dart';
import 'package:stackwallet/providers/wallet/my_paynym_account_state_provider.dart';
import 'package:stackwallet/providers/wallet/public_private_balance_state_provider.dart'; import 'package:stackwallet/providers/wallet/public_private_balance_state_provider.dart';
import 'package:stackwallet/providers/wallet/wallet_balance_toggle_state_provider.dart'; import 'package:stackwallet/providers/wallet/wallet_balance_toggle_state_provider.dart';
import 'package:stackwallet/services/coins/firo/firo_wallet.dart'; import 'package:stackwallet/services/coins/firo/firo_wallet.dart';
@ -29,11 +33,14 @@ import 'package:stackwallet/services/coins/manager.dart';
import 'package:stackwallet/services/event_bus/events/global/node_connection_status_changed_event.dart'; import 'package:stackwallet/services/event_bus/events/global/node_connection_status_changed_event.dart';
import 'package:stackwallet/services/event_bus/events/global/wallet_sync_status_changed_event.dart'; import 'package:stackwallet/services/event_bus/events/global/wallet_sync_status_changed_event.dart';
import 'package:stackwallet/services/event_bus/global_event_bus.dart'; import 'package:stackwallet/services/event_bus/global_event_bus.dart';
import 'package:stackwallet/services/mixins/paynym_wallet_interface.dart';
import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/enums/backup_frequency_type.dart'; import 'package:stackwallet/utilities/enums/backup_frequency_type.dart';
import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/enums/derive_path_type_enum.dart';
import 'package:stackwallet/utilities/enums/wallet_balance_toggle_state.dart'; import 'package:stackwallet/utilities/enums/wallet_balance_toggle_state.dart';
import 'package:stackwallet/utilities/logger.dart';
import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/widgets/background.dart'; import 'package:stackwallet/widgets/background.dart';
@ -41,7 +48,16 @@ import 'package:stackwallet/widgets/conditional_parent.dart';
import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart';
import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart';
import 'package:stackwallet/widgets/custom_loading_overlay.dart'; import 'package:stackwallet/widgets/custom_loading_overlay.dart';
import 'package:stackwallet/widgets/loading_indicator.dart';
import 'package:stackwallet/widgets/stack_dialog.dart'; import 'package:stackwallet/widgets/stack_dialog.dart';
import 'package:stackwallet/widgets/wallet_navigation_bar/components/icons/buy_nav_icon.dart';
import 'package:stackwallet/widgets/wallet_navigation_bar/components/icons/coin_control_nav_icon.dart';
import 'package:stackwallet/widgets/wallet_navigation_bar/components/icons/exchange_nav_icon.dart';
import 'package:stackwallet/widgets/wallet_navigation_bar/components/icons/paynym_nav_icon.dart';
import 'package:stackwallet/widgets/wallet_navigation_bar/components/icons/receive_nav_icon.dart';
import 'package:stackwallet/widgets/wallet_navigation_bar/components/icons/send_nav_icon.dart';
import 'package:stackwallet/widgets/wallet_navigation_bar/components/wallet_navigation_bar_item.dart';
import 'package:stackwallet/widgets/wallet_navigation_bar/wallet_navigation_bar.dart';
import 'package:tuple/tuple.dart'; import 'package:tuple/tuple.dart';
/// [eventBus] should only be set during testing /// [eventBus] should only be set during testing
@ -398,7 +414,9 @@ class _WalletViewState extends ConsumerState<WalletView> {
child: WillPopScope( child: WillPopScope(
onWillPop: _onWillPop, onWillPop: _onWillPop,
child: Background( child: Background(
child: Scaffold( child: Stack(
children: [
Scaffold(
backgroundColor: backgroundColor:
Theme.of(context).extension<StackColors>()!.background, Theme.of(context).extension<StackColors>()!.background,
appBar: AppBar( appBar: AppBar(
@ -422,8 +440,8 @@ class _WalletViewState extends ConsumerState<WalletView> {
), ),
Expanded( Expanded(
child: Text( child: Text(
ref.watch( ref.watch(managerProvider
managerProvider.select((value) => value.walletName)), .select((value) => value.walletName)),
style: STextStyles.navBarTitle(context), style: STextStyles.navBarTitle(context),
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
), ),
@ -482,8 +500,9 @@ class _WalletViewState extends ConsumerState<WalletView> {
: Assets.svg.bell, : Assets.svg.bell,
width: 20, width: 20,
height: 20, height: 20,
color: ref.watch(notificationsProvider.select((value) => color: ref.watch(notificationsProvider.select(
value.hasUnreadNotificationsFor(walletId))) (value) => value
.hasUnreadNotificationsFor(walletId)))
? null ? null
: Theme.of(context) : Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
@ -511,15 +530,15 @@ class _WalletViewState extends ConsumerState<WalletView> {
futures.add(ref futures.add(ref
.read(notificationsProvider) .read(notificationsProvider)
.markAsRead( .markAsRead(
unreadNotificationIds.elementAt(i), false)); unreadNotificationIds.elementAt(i),
false));
} }
// wait for multiple to update if any // wait for multiple to update if any
Future.wait(futures).then((_) { Future.wait(futures).then((_) {
// only notify listeners once // only notify listeners once
ref ref.read(notificationsProvider).markAsRead(
.read(notificationsProvider) unreadNotificationIds.last, true);
.markAsRead(unreadNotificationIds.last, true);
}); });
}); });
}, },
@ -569,7 +588,8 @@ class _WalletViewState extends ConsumerState<WalletView> {
), ),
body: SafeArea( body: SafeArea(
child: Container( child: Container(
color: Theme.of(context).extension<StackColors>()!.background, color:
Theme.of(context).extension<StackColors>()!.background,
child: Column( child: Column(
children: [ children: [
const SizedBox( const SizedBox(
@ -601,7 +621,8 @@ class _WalletViewState extends ConsumerState<WalletView> {
child: TextButton( child: TextButton(
style: Theme.of(context) style: Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
.getSecondaryEnabledButtonStyle(context), .getSecondaryEnabledButtonStyle(
context),
onPressed: () async { onPressed: () async {
await showDialog<void>( await showDialog<void>(
context: context, context: context,
@ -635,7 +656,8 @@ class _WalletViewState extends ConsumerState<WalletView> {
context), context),
child: Text( child: Text(
"Continue", "Continue",
style: STextStyles.button(context), style:
STextStyles.button(context),
), ),
), ),
), ),
@ -643,7 +665,8 @@ class _WalletViewState extends ConsumerState<WalletView> {
}, },
child: Text( child: Text(
"Anonymize funds", "Anonymize funds",
style: STextStyles.button(context).copyWith( style:
STextStyles.button(context).copyWith(
color: Theme.of(context) color: Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
.buttonTextSecondary, .buttonTextSecondary,
@ -664,7 +687,8 @@ class _WalletViewState extends ConsumerState<WalletView> {
children: [ children: [
Text( Text(
"Transactions", "Transactions",
style: STextStyles.itemSubtitle(context).copyWith( style:
STextStyles.itemSubtitle(context).copyWith(
color: Theme.of(context) color: Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
.textDark3, .textDark3,
@ -686,9 +710,7 @@ class _WalletViewState extends ConsumerState<WalletView> {
height: 12, height: 12,
), ),
Expanded( Expanded(
child: Stack( child: Padding(
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16), padding: const EdgeInsets.symmetric(horizontal: 16),
child: ClipRRect( child: ClipRRect(
borderRadius: BorderRadius.vertical( borderRadius: BorderRadius.vertical(
@ -741,33 +763,19 @@ class _WalletViewState extends ConsumerState<WalletView> {
), ),
), ),
), ),
Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.only(
bottom: 14,
left: 16,
right: 16,
), ),
child: WalletNavigationBar( ],
walletId: widget.walletId, ),
coin: ref.watch(managerProvider ),
.select((value) => value.coin)), ),
enableExchange: ),
Constants.enableExchange && WalletNavigationBar(
ref.watch(managerProvider.select( items: [
(value) => value.coin)) != WalletNavigationBarItemData(
Coin.epicCash, label: "Receive",
height: WalletView.navBarHeight, icon: const ReceiveNavIcon(),
onExchangePressed: () => onTap: () {
_onExchangePressed(context), final coin = ref.read(managerProvider).coin;
onReceivePressed: () async {
final coin =
ref.read(managerProvider).coin;
if (mounted) { if (mounted) {
unawaited( unawaited(
Navigator.of(context).pushNamed( Navigator.of(context).pushNamed(
@ -776,32 +784,28 @@ class _WalletViewState extends ConsumerState<WalletView> {
walletId, walletId,
coin, coin,
), ),
)); ),
);
} }
}, },
onSendPressed: () { ),
final walletId = WalletNavigationBarItemData(
ref.read(managerProvider).walletId; label: "Send",
final coin = icon: const SendNavIcon(),
ref.read(managerProvider).coin; onTap: () {
final walletId = ref.read(managerProvider).walletId;
final coin = ref.read(managerProvider).coin;
switch (ref switch (ref
.read( .read(walletBalanceToggleStateProvider.state)
walletBalanceToggleStateProvider
.state)
.state) { .state) {
case WalletBalanceToggleState.full: case WalletBalanceToggleState.full:
ref ref
.read( .read(publicPrivateBalanceStateProvider.state)
publicPrivateBalanceStateProvider
.state)
.state = "Public"; .state = "Public";
break; break;
case WalletBalanceToggleState case WalletBalanceToggleState.available:
.available:
ref ref
.read( .read(publicPrivateBalanceStateProvider.state)
publicPrivateBalanceStateProvider
.state)
.state = "Private"; .state = "Private";
break; break;
} }
@ -813,26 +817,108 @@ class _WalletViewState extends ConsumerState<WalletView> {
), ),
); );
}, },
onBuyPressed: () { ),
WalletNavigationBarItemData(
label: "Exchange",
icon: const ExchangeNavIcon(),
onTap: () => _onExchangePressed(context),
),
WalletNavigationBarItemData(
label: "Buy",
icon: const BuyNavIcon(),
onTap: () {
unawaited( unawaited(
Navigator.of(context).pushNamed( Navigator.of(context).pushNamed(
BuyInWalletView.routeName, BuyInWalletView.routeName,
arguments: coin, arguments: coin,
)); ),
);
}, },
), ),
if (ref.watch(
walletsChangeNotifierProvider.select(
(value) => value
.getManager(widget.walletId)
.hasCoinControlSupport,
),
) &&
ref.watch(
prefsChangeNotifierProvider.select(
(value) => value.enableCoinControl,
),
))
WalletNavigationBarItemData(
label: "Coin control",
icon: const CoinControlNavIcon(),
onTap: () {
Navigator.of(context).pushNamed(
CoinControlView.routeName,
arguments: Tuple2(
widget.walletId,
CoinControlViewType.manage,
),
);
},
),
if (ref.watch(walletsChangeNotifierProvider.select((value) =>
value.getManager(widget.walletId).hasPaynymSupport)))
WalletNavigationBarItemData(
label: "PayNym",
icon: const PaynymNavIcon(),
onTap: () async {
unawaited(
showDialog(
context: context,
builder: (context) => const LoadingIndicator(
width: 100,
),
),
);
final manager = ref
.read(walletsChangeNotifierProvider)
.getManager(widget.walletId);
final paynymInterface =
manager.wallet as PaynymWalletInterface;
final code = await paynymInterface.getPaymentCode(
DerivePathTypeExt.primaryFor(manager.coin));
final account = await ref
.read(paynymAPIProvider)
.nym(code.toString());
Logging.instance.log(
"my nym account: $account",
level: LogLevel.Info,
);
if (mounted) {
Navigator.of(context).pop();
// check if account exists and for matching code to see if claimed
if (account.value != null &&
account.value!.codes.first.claimed) {
ref.read(myPaynymAccountStateProvider.state).state =
account.value!;
await Navigator.of(context).pushNamed(
PaynymHomeView.routeName,
arguments: widget.walletId,
);
} else {
await Navigator.of(context).pushNamed(
PaynymClaimView.routeName,
arguments: widget.walletId,
);
}
}
},
), ),
], ],
), ),
], ],
)
],
),
),
],
),
),
),
), ),
), ),
), ),

16
lib/widgets/wallet_navigation_bar/components/icons/buy_nav_icon.dart Normal file
View file

@ -0,0 +1,16 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:stackwallet/utilities/assets.dart';
class BuyNavIcon extends StatelessWidget {
const BuyNavIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return SvgPicture.asset(
Assets.svg.buy(context),
width: 24,
height: 24,
);
}
}

18
lib/widgets/wallet_navigation_bar/components/icons/coin_control_nav_icon.dart Normal file
View file

@ -0,0 +1,18 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
class CoinControlNavIcon extends StatelessWidget {
const CoinControlNavIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return SvgPicture.asset(
Assets.svg.coinControl.gamePad,
height: 20,
width: 20,
color: Theme.of(context).extension<StackColors>()!.bottomNavIconIcon,
);
}
}

16
lib/widgets/wallet_navigation_bar/components/icons/exchange_nav_icon.dart Normal file
View file

@ -0,0 +1,16 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:stackwallet/utilities/assets.dart';
class ExchangeNavIcon extends StatelessWidget {
const ExchangeNavIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return SvgPicture.asset(
Assets.svg.exchange(context),
width: 24,
height: 24,
);
}
}

18
lib/widgets/wallet_navigation_bar/components/icons/paynym_nav_icon.dart Normal file
View file

@ -0,0 +1,18 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
class PaynymNavIcon extends StatelessWidget {
const PaynymNavIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return SvgPicture.asset(
Assets.svg.robotHead,
height: 20,
width: 20,
color: Theme.of(context).extension<StackColors>()!.bottomNavIconIcon,
);
}
}

32
lib/widgets/wallet_navigation_bar/components/icons/receive_nav_icon.dart Normal file
View file

@ -0,0 +1,32 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
class ReceiveNavIcon extends StatelessWidget {
const ReceiveNavIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
color: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.4),
borderRadius: BorderRadius.circular(
24,
),
),
child: Padding(
padding: const EdgeInsets.all(6.0),
child: SvgPicture.asset(
Assets.svg.arrowDownLeft,
width: 12,
height: 12,
color: Theme.of(context).extension<StackColors>()!.accentColorDark,
),
),
);
}
}

32
lib/widgets/wallet_navigation_bar/components/icons/send_nav_icon.dart Normal file
View file

@ -0,0 +1,32 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
class SendNavIcon extends StatelessWidget {
const SendNavIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
color: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.4),
borderRadius: BorderRadius.circular(
24,
),
),
child: Padding(
padding: const EdgeInsets.all(6.0),
child: SvgPicture.asset(
Assets.svg.arrowUpRight,
width: 12,
height: 12,
color: Theme.of(context).extension<StackColors>()!.accentColorDark,
),
),
);
}
}

18
lib/widgets/wallet_navigation_bar/components/icons/whirlpool_nav_icon.dart Normal file
View file

@ -0,0 +1,18 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
class WhirlpoolNavIcon extends StatelessWidget {
const WhirlpoolNavIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return SvgPicture.asset(
Assets.svg.whirlPool,
height: 20,
width: 20,
color: Theme.of(context).extension<StackColors>()!.bottomNavIconIcon,
);
}
}

125
lib/widgets/wallet_navigation_bar/components/wallet_navigation_bar_item.dart Normal file
View file

@ -0,0 +1,125 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/widgets/rounded_container.dart';
import 'package:stackwallet/widgets/wallet_navigation_bar/wallet_navigation_bar.dart';
class WalletNavigationBarItemData {
WalletNavigationBarItemData({
required this.icon,
required this.label,
required this.onTap,
this.isMore = false,
this.overrideText,
});
final Widget icon;
final String? label;
final VoidCallback? onTap;
final bool isMore;
final Widget? overrideText;
}
class WalletNavigationBarItem extends ConsumerWidget {
const WalletNavigationBarItem({
Key? key,
required this.data,
required this.disableDuration,
}) : super(key: key);
final WalletNavigationBarItemData data;
final Duration disableDuration;
@override
Widget build(BuildContext context, WidgetRef ref) {
return GestureDetector(
onTap: data.isMore || !ref.watch(walletNavBarMore.state).state
? data.onTap
: null,
child: RoundedContainer(
color: Colors.transparent,
padding: const EdgeInsets.all(0),
radiusMultiplier: 2,
child: AnimatedOpacity(
opacity:
data.isMore || !ref.watch(walletNavBarMore.state).state ? 1 : 0.2,
duration: disableDuration,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0),
child: ConstrainedBox(
constraints: const BoxConstraints(
maxHeight: 45,
),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
SizedBox(
width: 24,
height: 24,
child: Center(
child: data.icon,
),
),
const Spacer(),
data.overrideText ??
Text(
data.label ?? "",
style: STextStyles.buttonSmall(context),
),
],
),
),
),
),
),
);
}
}
class WalletNavigationBarMoreItem extends ConsumerWidget {
const WalletNavigationBarMoreItem({
Key? key,
required this.data,
}) : super(key: key);
final WalletNavigationBarItemData data;
@override
Widget build(BuildContext context, WidgetRef ref) {
return GestureDetector(
onTap: () {
data.onTap?.call();
ref.read(walletNavBarMore.state).state = false;
},
child: Material(
color: Colors.transparent,
child: RoundedContainer(
color: Theme.of(context).extension<StackColors>()!.bottomNavBack,
radiusMultiplier: 100,
padding: const EdgeInsets.symmetric(
vertical: 16,
horizontal: 30,
),
child: Row(
children: [
Expanded(
child: Text(
data.label ?? "",
textAlign: TextAlign.center,
style: STextStyles.buttonSmall(context),
),
),
const SizedBox(
width: 10,
),
data.icon,
],
),
),
),
);
}
}

237
lib/widgets/wallet_navigation_bar/wallet_navigation_bar.dart Normal file
View file

@ -0,0 +1,237 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/svg.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/widgets/wallet_navigation_bar/components/wallet_navigation_bar_item.dart';
const _kMaxItems = 5;
final walletNavBarMore = StateProvider.autoDispose((ref) => false);
class WalletNavigationBar extends ConsumerStatefulWidget {
const WalletNavigationBar({
Key? key,
required this.items,
}) : super(key: key);
final List<WalletNavigationBarItemData> items;
@override
ConsumerState<WalletNavigationBar> createState() =>
_WalletNavigationBarState();
}
class _WalletNavigationBarState extends ConsumerState<WalletNavigationBar> {
static const double horizontalPadding = 16;
final _moreDuration = const Duration(milliseconds: 200);
late final bool hasMore;
double _moreScale = 0;
void _onMorePressed() {
ref.read(walletNavBarMore.state).state =
!ref.read(walletNavBarMore.state).state;
}
@override
void initState() {
hasMore = widget.items.length > _kMaxItems;
super.initState();
}
@override
Widget build(BuildContext context) {
return Stack(
alignment: Alignment.bottomCenter,
children: [
IgnorePointer(
ignoring: !ref.read(walletNavBarMore.state).state,
child: GestureDetector(
onTap: () {
if (ref.read(walletNavBarMore.state).state) {
ref.read(walletNavBarMore.state).state = false;
}
},
child: AnimatedOpacity(
opacity: ref.watch(walletNavBarMore.state).state ? 1 : 0,
duration: _moreDuration,
child: Container(
color: Colors.black.withOpacity(0.7),
),
),
),
),
Padding(
padding: const EdgeInsets.only(
left: horizontalPadding,
right: horizontalPadding,
bottom: horizontalPadding,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.end,
mainAxisSize: MainAxisSize.min,
children: [
AnimatedScale(
scale: ref.watch(walletNavBarMore.state).state ? 1 : 0,
duration: _moreDuration,
alignment: const Alignment(
0.5,
1.0,
),
child: AnimatedOpacity(
opacity: ref.watch(walletNavBarMore.state).state ? 1 : 0,
duration: _moreDuration,
child: IntrinsicWidth(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisSize: MainAxisSize.min,
children: [
...widget.items.sublist(_kMaxItems - 1).map(
(e) {
return Column(
children: [
WalletNavigationBarMoreItem(data: e),
const SizedBox(
height: 8,
),
],
);
},
),
],
),
),
),
),
Material(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
1000,
),
),
child: Container(
decoration: BoxDecoration(
color: Theme.of(context)
.extension<StackColors>()!
.bottomNavBack,
boxShadow: [
Theme.of(context)
.extension<StackColors>()!
.standardBoxShadow
],
borderRadius: BorderRadius.circular(
1000,
),
),
child: Padding(
padding: const EdgeInsets.symmetric(
vertical: 6,
horizontal: 12,
),
child: IntrinsicWidth(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Spacer(),
if (!hasMore)
...widget.items.map(
(e) => Flexible(
flex: 10000,
child: WalletNavigationBarItem(
data: e,
disableDuration: _moreDuration,
),
),
),
if (hasMore)
...widget.items.sublist(0, _kMaxItems - 1).map(
(e) => Flexible(
flex: 10000,
child: WalletNavigationBarItem(
data: e,
disableDuration: _moreDuration,
),
),
),
if (hasMore)
Flexible(
flex: 10000,
child: WalletNavigationBarItem(
data: WalletNavigationBarItemData(
icon: AnimatedCrossFade(
firstChild: SvgPicture.asset(
Assets.svg.bars,
width: 20,
height: 20,
color: Theme.of(context)
.extension<StackColors>()!
.bottomNavIconIcon,
),
secondChild: SvgPicture.asset(
Assets.svg.bars,
width: 20,
height: 20,
color: Theme.of(context)
.extension<StackColors>()!
.infoItemIcons,
),
crossFadeState: ref
.watch(walletNavBarMore.state)
.state
? CrossFadeState.showSecond
: CrossFadeState.showFirst,
duration: _moreDuration,
),
overrideText: AnimatedCrossFade(
firstChild: Text(
"More",
style:
STextStyles.buttonSmall(context),
),
secondChild: Text(
"More",
style:
STextStyles.buttonSmall(context)
.copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.infoItemIcons,
),
),
crossFadeState: ref
.watch(walletNavBarMore.state)
.state
? CrossFadeState.showSecond
: CrossFadeState.showFirst,
duration: _moreDuration,
),
label: null,
isMore: true,
onTap: _onMorePressed,
),
disableDuration: _moreDuration,
),
),
const Spacer(),
],
),
),
),
),
),
],
),
],
),
),
],
);
}
}