stack_wallet/lib/pages_desktop_specific/desktop_menu_item.dart

335 lines
9.4 KiB
Dart
Raw Normal View History

import 'package:flutter/material.dart';
2022-11-28 22:17:33 +00:00
import 'package:flutter_riverpod/flutter_riverpod.dart';
2022-11-29 17:56:56 +00:00
import 'package:flutter_svg/svg.dart';
2022-12-01 14:48:23 +00:00
import 'package:stackwallet/pages_desktop_specific/desktop_menu.dart';
2022-11-28 22:17:33 +00:00
import 'package:stackwallet/providers/desktop/current_desktop_menu_item.dart';
2022-11-29 17:56:56 +00:00
import 'package:stackwallet/providers/global/notifications_provider.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
2022-11-28 19:50:55 +00:00
class DMIController {
VoidCallback? toggle;
void dispose() {
toggle = null;
}
}
2022-12-01 16:10:18 +00:00
class DesktopMyStackIcon extends ConsumerWidget {
const DesktopMyStackIcon({Key? key}) : super(key: key);
2022-11-29 17:56:56 +00:00
@override
2022-12-01 16:10:18 +00:00
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.walletDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.myStack ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
2022-11-29 17:56:56 +00:00
}
2022-12-01 16:10:18 +00:00
class DesktopExchangeIcon extends ConsumerWidget {
const DesktopExchangeIcon({Key? key}) : super(key: key);
2022-11-29 17:56:56 +00:00
@override
2022-12-01 16:10:18 +00:00
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.exchangeDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.exchange ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
2023-01-04 16:49:13 +00:00
class DesktopBuyIcon extends ConsumerWidget {
const DesktopBuyIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.buy(context),
2023-01-04 16:49:13 +00:00
width: 20,
height: 20,
color: DesktopMenuItemId.buy ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
2022-12-01 16:10:18 +00:00
class DesktopNotificationsIcon extends ConsumerWidget {
const DesktopNotificationsIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
2022-11-29 17:56:56 +00:00
return SvgPicture.asset(
ref.watch(notificationsProvider
.select((value) => value.hasUnreadNotifications))
? Assets.svg.bellNew(context)
: Assets.svg.bell,
width: 20,
height: 20,
color: ref.watch(notificationsProvider
.select((value) => value.hasUnreadNotifications))
? null
: DesktopMenuItemId.notifications ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
2022-12-01 16:10:18 +00:00
class DesktopAddressBookIcon extends ConsumerWidget {
const DesktopAddressBookIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.addressBookDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.addressBook ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
class DesktopSettingsIcon extends ConsumerWidget {
const DesktopSettingsIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.gear,
width: 20,
height: 20,
color: DesktopMenuItemId.settings ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
class DesktopSupportIcon extends ConsumerWidget {
const DesktopSupportIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.messageQuestion,
width: 20,
height: 20,
color: DesktopMenuItemId.support ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
class DesktopAboutIcon extends ConsumerWidget {
const DesktopAboutIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.aboutDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.about ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
class DesktopExitIcon extends ConsumerWidget {
const DesktopExitIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.exitDesktop,
width: 20,
height: 20,
color: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
2022-11-28 22:17:33 +00:00
class DesktopMenuItem<T> extends ConsumerStatefulWidget {
const DesktopMenuItem({
Key? key,
required this.icon,
required this.label,
required this.value,
required this.onChanged,
2022-11-28 19:50:55 +00:00
required this.duration,
this.labelLength = 125,
this.controller,
}) : super(key: key);
final Widget icon;
final String label;
final T value;
final void Function(T) onChanged;
2022-11-28 19:50:55 +00:00
final Duration duration;
final double labelLength;
final DMIController? controller;
@override
2022-11-28 22:17:33 +00:00
ConsumerState<DesktopMenuItem<T>> createState() => _DesktopMenuItemState<T>();
2022-11-28 19:50:55 +00:00
}
2022-11-28 22:17:33 +00:00
class _DesktopMenuItemState<T> extends ConsumerState<DesktopMenuItem<T>>
2022-11-28 19:50:55 +00:00
with SingleTickerProviderStateMixin {
late final Widget icon;
late final String label;
late final T value;
late final void Function(T) onChanged;
late final Duration duration;
late final double labelLength;
late final DMIController? controller;
late final AnimationController animationController;
bool _iconOnly = false;
void toggle() {
setState(() {
_iconOnly = !_iconOnly;
});
if (_iconOnly) {
animationController.reverse();
} else {
animationController.forward();
}
}
@override
void initState() {
icon = widget.icon;
label = widget.label;
value = widget.value;
onChanged = widget.onChanged;
duration = widget.duration;
labelLength = widget.labelLength;
controller = widget.controller;
controller?.toggle = toggle;
animationController = AnimationController(
vsync: this,
duration: duration,
2022-11-28 20:25:49 +00:00
)..forward();
2022-11-28 19:50:55 +00:00
super.initState();
}
@override
void dispose() {
controller?.dispose();
animationController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
2022-11-28 22:17:33 +00:00
final group = ref.watch(currentDesktopMenuItemProvider.state).state;
2022-11-30 14:24:10 +00:00
return TextButton(
style: value == group
? Theme.of(context)
.extension<StackColors>()!
2023-01-24 19:29:12 +00:00
.getDesktopMenuButtonStyleSelected(context)
: Theme.of(context)
.extension<StackColors>()!
2023-01-24 19:29:12 +00:00
.getDesktopMenuButtonStyle(context),
onPressed: () {
onChanged(value);
},
child: Padding(
2022-11-28 19:50:55 +00:00
padding: const EdgeInsets.symmetric(
vertical: 16,
),
child: Row(
2022-11-28 19:50:55 +00:00
mainAxisAlignment: MainAxisAlignment.center,
children: [
2022-11-28 19:50:55 +00:00
AnimatedContainer(
duration: duration,
width: _iconOnly ? 0 : 16,
),
icon,
2022-11-28 19:50:55 +00:00
AnimatedOpacity(
duration: duration,
opacity: _iconOnly ? 0 : 1.0,
child: SizeTransition(
sizeFactor: animationController,
axis: Axis.horizontal,
axisAlignment: -1,
child: SizedBox(
width: labelLength,
child: Row(
children: [
const SizedBox(
width: 12,
),
Text(
label,
style: value == group
? STextStyles.desktopMenuItemSelected(context)
: STextStyles.desktopMenuItem(context),
),
],
),
),
2022-09-16 17:26:12 +00:00
),
2022-11-28 19:50:55 +00:00
)
],
),
),
);
}
}