mirror of
https://github.com/cypherstack/stack_wallet.git
synced 2024-11-16 17:27:39 +00:00
add breathing effect to recent activity on desktop
This commit is contained in:
parent
43071c01df
commit
c8a868a840
3 changed files with 180 additions and 154 deletions
|
@ -13,6 +13,7 @@ import '../../../../utilities/text_styles.dart';
|
|||
import '../../../../utilities/util.dart';
|
||||
import '../../../../wallets/crypto_currency/crypto_currency.dart';
|
||||
import '../../../../wallets/isar/providers/wallet_info_provider.dart';
|
||||
import '../../../../widgets/breathing.dart';
|
||||
import '../../../../widgets/desktop/desktop_dialog.dart';
|
||||
import '../../../../widgets/desktop/desktop_dialog_close_button.dart';
|
||||
import '../../../../widgets/trade_card.dart';
|
||||
|
@ -49,98 +50,100 @@ class TxListItem extends ConsumerWidget {
|
|||
color: Theme.of(context).extension<StackColors>()!.popupBG,
|
||||
borderRadius: radius,
|
||||
),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
TransactionCardV2(
|
||||
key: UniqueKey(),
|
||||
transaction: _tx,
|
||||
),
|
||||
TradeCard(
|
||||
key: Key(
|
||||
_tx.txid +
|
||||
_tx.type.name +
|
||||
_tx.hashCode.toString() +
|
||||
trade.uuid,
|
||||
), //
|
||||
trade: trade,
|
||||
onTap: () async {
|
||||
if (Util.isDesktop) {
|
||||
await showDialog<void>(
|
||||
context: context,
|
||||
builder: (context) => Navigator(
|
||||
initialRoute: TradeDetailsView.routeName,
|
||||
onGenerateRoute: RouteGenerator.generateRoute,
|
||||
onGenerateInitialRoutes: (_, __) {
|
||||
return [
|
||||
FadePageRoute(
|
||||
DesktopDialog(
|
||||
maxHeight: null,
|
||||
maxWidth: 580,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(
|
||||
left: 32,
|
||||
bottom: 16,
|
||||
child: Breathing(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
TransactionCardV2(
|
||||
key: UniqueKey(),
|
||||
transaction: _tx,
|
||||
),
|
||||
TradeCard(
|
||||
key: Key(
|
||||
_tx.txid +
|
||||
_tx.type.name +
|
||||
_tx.hashCode.toString() +
|
||||
trade.uuid,
|
||||
), //
|
||||
trade: trade,
|
||||
onTap: () async {
|
||||
if (Util.isDesktop) {
|
||||
await showDialog<void>(
|
||||
context: context,
|
||||
builder: (context) => Navigator(
|
||||
initialRoute: TradeDetailsView.routeName,
|
||||
onGenerateRoute: RouteGenerator.generateRoute,
|
||||
onGenerateInitialRoutes: (_, __) {
|
||||
return [
|
||||
FadePageRoute(
|
||||
DesktopDialog(
|
||||
maxHeight: null,
|
||||
maxWidth: 580,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(
|
||||
left: 32,
|
||||
bottom: 16,
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment:
|
||||
MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
"Trade details",
|
||||
style: STextStyles.desktopH3(
|
||||
context),
|
||||
),
|
||||
DesktopDialogCloseButton(
|
||||
onPressedOverride: Navigator.of(
|
||||
context,
|
||||
rootNavigator: true,
|
||||
).pop,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment:
|
||||
MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
"Trade details",
|
||||
style:
|
||||
STextStyles.desktopH3(context),
|
||||
),
|
||||
DesktopDialogCloseButton(
|
||||
onPressedOverride: Navigator.of(
|
||||
context,
|
||||
rootNavigator: true,
|
||||
).pop,
|
||||
),
|
||||
],
|
||||
Flexible(
|
||||
child: TradeDetailsView(
|
||||
tradeId: trade.tradeId,
|
||||
// TODO: [prio:med]
|
||||
// transactionIfSentFromStack: tx,
|
||||
transactionIfSentFromStack: null,
|
||||
walletName: ref
|
||||
.watch(pWalletName(_tx.walletId)),
|
||||
walletId: _tx.walletId,
|
||||
),
|
||||
),
|
||||
),
|
||||
Flexible(
|
||||
child: TradeDetailsView(
|
||||
tradeId: trade.tradeId,
|
||||
// TODO: [prio:med]
|
||||
// transactionIfSentFromStack: tx,
|
||||
transactionIfSentFromStack: null,
|
||||
walletName: ref
|
||||
.watch(pWalletName(_tx.walletId)),
|
||||
walletId: _tx.walletId,
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
const RouteSettings(
|
||||
name: TradeDetailsView.routeName,
|
||||
),
|
||||
),
|
||||
const RouteSettings(
|
||||
name: TradeDetailsView.routeName,
|
||||
),
|
||||
),
|
||||
];
|
||||
},
|
||||
),
|
||||
);
|
||||
} else {
|
||||
unawaited(
|
||||
Navigator.of(context).pushNamed(
|
||||
TradeDetailsView.routeName,
|
||||
arguments: Tuple4(
|
||||
trade.tradeId,
|
||||
_tx,
|
||||
_tx.walletId,
|
||||
ref.read(pWalletName(_tx.walletId)),
|
||||
];
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
},
|
||||
),
|
||||
],
|
||||
);
|
||||
} else {
|
||||
unawaited(
|
||||
Navigator.of(context).pushNamed(
|
||||
TradeDetailsView.routeName,
|
||||
arguments: Tuple4(
|
||||
trade.tradeId,
|
||||
_tx,
|
||||
_tx.walletId,
|
||||
ref.read(pWalletName(_tx.walletId)),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
},
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
} else {
|
||||
|
@ -149,10 +152,12 @@ class TxListItem extends ConsumerWidget {
|
|||
color: Theme.of(context).extension<StackColors>()!.popupBG,
|
||||
borderRadius: radius,
|
||||
),
|
||||
child: TransactionCardV2(
|
||||
// this may mess with combined firo transactions
|
||||
key: UniqueKey(),
|
||||
transaction: _tx,
|
||||
child: Breathing(
|
||||
child: TransactionCardV2(
|
||||
// this may mess with combined firo transactions
|
||||
key: UniqueKey(),
|
||||
transaction: _tx,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
@ -165,9 +170,11 @@ class TxListItem extends ConsumerWidget {
|
|||
color: Theme.of(context).extension<StackColors>()!.popupBG,
|
||||
borderRadius: radius,
|
||||
),
|
||||
child: FusionTxGroupCard(
|
||||
key: UniqueKey(),
|
||||
group: group,
|
||||
child: Breathing(
|
||||
child: FusionTxGroupCard(
|
||||
key: UniqueKey(),
|
||||
group: group,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
|
|
@ -13,6 +13,7 @@ import 'dart:io';
|
|||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:flutter_svg/svg.dart';
|
||||
|
||||
import '../../pages/wallets_view/wallets_overview.dart';
|
||||
import '../../providers/providers.dart';
|
||||
import '../../themes/coin_icon_provider.dart';
|
||||
|
@ -21,6 +22,7 @@ import '../../utilities/amount/amount.dart';
|
|||
import '../../utilities/text_styles.dart';
|
||||
import '../../wallets/crypto_currency/crypto_currency.dart';
|
||||
import '../../wallets/isar/providers/all_wallets_info_provider.dart';
|
||||
import '../../widgets/breathing.dart';
|
||||
import '../../widgets/conditional_parent.dart';
|
||||
import '../../widgets/desktop/desktop_dialog.dart';
|
||||
import '../../widgets/desktop/desktop_dialog_close_button.dart';
|
||||
|
@ -146,71 +148,56 @@ class _DesktopWalletSummaryRowState
|
|||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return MouseRegion(
|
||||
onEnter: (_) => setState(
|
||||
() => _hovering = true,
|
||||
),
|
||||
onExit: (_) => setState(
|
||||
() => _hovering = false,
|
||||
),
|
||||
child: AnimatedScale(
|
||||
scale: _hovering ? 1.00 : 0.98,
|
||||
duration: const Duration(
|
||||
milliseconds: 200,
|
||||
),
|
||||
child: RoundedWhiteContainer(
|
||||
padding: const EdgeInsets.all(20),
|
||||
hoverColor: Colors.transparent,
|
||||
onPressed: _onPressed,
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: Row(
|
||||
children: [
|
||||
SvgPicture.file(
|
||||
File(
|
||||
ref.watch(coinIconProvider(widget.coin)),
|
||||
),
|
||||
width: 28,
|
||||
height: 28,
|
||||
return Breathing(
|
||||
child: RoundedWhiteContainer(
|
||||
padding: const EdgeInsets.all(20),
|
||||
hoverColor: Colors.transparent,
|
||||
onPressed: _onPressed,
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: Row(
|
||||
children: [
|
||||
SvgPicture.file(
|
||||
File(
|
||||
ref.watch(coinIconProvider(widget.coin)),
|
||||
),
|
||||
const SizedBox(
|
||||
width: 10,
|
||||
),
|
||||
Text(
|
||||
widget.coin.prettyName,
|
||||
style:
|
||||
STextStyles.desktopTextExtraSmall(context).copyWith(
|
||||
color: Theme.of(context)
|
||||
.extension<StackColors>()!
|
||||
.textDark,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: Text(
|
||||
widget.walletCount == 1
|
||||
? "${widget.walletCount} wallet"
|
||||
: "${widget.walletCount} wallets",
|
||||
style: STextStyles.desktopTextExtraSmall(context).copyWith(
|
||||
color: Theme.of(context)
|
||||
.extension<StackColors>()!
|
||||
.textSubtitle1,
|
||||
width: 28,
|
||||
height: 28,
|
||||
),
|
||||
const SizedBox(
|
||||
width: 10,
|
||||
),
|
||||
Text(
|
||||
widget.coin.prettyName,
|
||||
style: STextStyles.desktopTextExtraSmall(context).copyWith(
|
||||
color:
|
||||
Theme.of(context).extension<StackColors>()!.textDark,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: Text(
|
||||
widget.walletCount == 1
|
||||
? "${widget.walletCount} wallet"
|
||||
: "${widget.walletCount} wallets",
|
||||
style: STextStyles.desktopTextExtraSmall(context).copyWith(
|
||||
color:
|
||||
Theme.of(context).extension<StackColors>()!.textSubtitle1,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
flex: 6,
|
||||
child: TablePriceInfo(
|
||||
coin: widget.coin,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
flex: 6,
|
||||
child: TablePriceInfo(
|
||||
coin: widget.coin,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
|
|
32
lib/widgets/breathing.dart
Normal file
32
lib/widgets/breathing.dart
Normal file
|
@ -0,0 +1,32 @@
|
|||
import 'package:flutter/material.dart';
|
||||
|
||||
class Breathing extends StatefulWidget {
|
||||
const Breathing({super.key, required this.child});
|
||||
|
||||
final Widget child;
|
||||
|
||||
@override
|
||||
State<Breathing> createState() => _BreathingState();
|
||||
}
|
||||
|
||||
class _BreathingState extends State<Breathing> {
|
||||
bool _hovering = false;
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return MouseRegion(
|
||||
onEnter: (_) => setState(
|
||||
() => _hovering = true,
|
||||
),
|
||||
onExit: (_) => setState(
|
||||
() => _hovering = false,
|
||||
),
|
||||
child: AnimatedScale(
|
||||
scale: _hovering ? 1.00 : 0.98,
|
||||
duration: const Duration(
|
||||
milliseconds: 200,
|
||||
),
|
||||
child: widget.child,
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
Loading…
Reference in a new issue