2022-09-15 21:38:30 +00:00
|
|
|
import 'package:flutter/material.dart';
|
|
|
|
import 'package:stackwallet/utilities/text_styles.dart';
|
2022-09-22 23:48:50 +00:00
|
|
|
import 'package:stackwallet/utilities/theme/stack_colors.dart';
|
2022-09-15 21:38:30 +00:00
|
|
|
|
2022-11-28 19:50:55 +00:00
|
|
|
class DMIController {
|
|
|
|
VoidCallback? toggle;
|
|
|
|
void dispose() {
|
|
|
|
toggle = null;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
class DesktopMenuItem<T> extends StatefulWidget {
|
2022-09-15 21:38:30 +00:00
|
|
|
const DesktopMenuItem({
|
|
|
|
Key? key,
|
|
|
|
required this.icon,
|
|
|
|
required this.label,
|
|
|
|
required this.value,
|
|
|
|
required this.group,
|
|
|
|
required this.onChanged,
|
2022-11-28 19:50:55 +00:00
|
|
|
required this.duration,
|
|
|
|
this.labelLength = 125,
|
|
|
|
this.controller,
|
2022-09-15 21:38:30 +00:00
|
|
|
}) : super(key: key);
|
|
|
|
|
|
|
|
final Widget icon;
|
|
|
|
final String label;
|
|
|
|
final T value;
|
|
|
|
final T group;
|
|
|
|
final void Function(T) onChanged;
|
2022-11-28 19:50:55 +00:00
|
|
|
final Duration duration;
|
|
|
|
final double labelLength;
|
|
|
|
final DMIController? controller;
|
|
|
|
|
|
|
|
@override
|
|
|
|
State<DesktopMenuItem<T>> createState() => _DesktopMenuItemState<T>();
|
|
|
|
}
|
|
|
|
|
|
|
|
class _DesktopMenuItemState<T> extends State<DesktopMenuItem<T>>
|
|
|
|
with SingleTickerProviderStateMixin {
|
|
|
|
late final Widget icon;
|
|
|
|
late final String label;
|
|
|
|
late final T value;
|
|
|
|
late final T group;
|
|
|
|
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;
|
|
|
|
group = widget.group;
|
|
|
|
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();
|
|
|
|
}
|
2022-09-15 21:38:30 +00:00
|
|
|
|
|
|
|
@override
|
|
|
|
Widget build(BuildContext context) {
|
|
|
|
return TextButton(
|
|
|
|
style: value == group
|
2022-09-22 23:48:50 +00:00
|
|
|
? Theme.of(context)
|
|
|
|
.extension<StackColors>()!
|
|
|
|
.getDesktopMenuButtonColorSelected(context)
|
|
|
|
: Theme.of(context)
|
|
|
|
.extension<StackColors>()!
|
|
|
|
.getDesktopMenuButtonColor(context),
|
2022-09-15 21:38:30 +00:00
|
|
|
onPressed: () {
|
|
|
|
onChanged(value);
|
|
|
|
},
|
|
|
|
child: Padding(
|
2022-11-28 19:50:55 +00:00
|
|
|
padding: const EdgeInsets.symmetric(
|
2022-09-15 21:38:30 +00:00
|
|
|
vertical: 16,
|
|
|
|
),
|
|
|
|
child: Row(
|
2022-11-28 19:50:55 +00:00
|
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
2022-09-15 21:38:30 +00:00
|
|
|
children: [
|
2022-11-28 19:50:55 +00:00
|
|
|
AnimatedContainer(
|
|
|
|
duration: duration,
|
|
|
|
width: _iconOnly ? 0 : 16,
|
|
|
|
),
|
2022-09-15 21:38:30 +00:00
|
|
|
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
|
|
|
)
|
2022-09-15 21:38:30 +00:00
|
|
|
],
|
|
|
|
),
|
|
|
|
),
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|