stack icon rotates

This commit is contained in:
ryleedavis 2023-03-03 10:27:20 -07:00
parent 562dbfb058
commit 6fb692da0c
2 changed files with 93 additions and 4 deletions

View file

@ -17,6 +17,7 @@ import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/widgets/animated_widgets/rotate_icon.dart';
import 'package:stackwallet/widgets/background.dart';
import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart';
import 'package:stackwallet/widgets/stack_dialog.dart';
@ -34,6 +35,7 @@ class _HomeViewState extends ConsumerState<HomeView> {
final GlobalKey<ScaffoldState> _key = GlobalKey<ScaffoldState>();
late final PageController _pageController;
late final RotateIconController _rotateIconController;
late final List<Widget> _children;
@ -102,6 +104,7 @@ class _HomeViewState extends ConsumerState<HomeView> {
@override
void initState() {
_pageController = PageController();
_rotateIconController = RotateIconController();
_children = [
const WalletsView(),
if (Constants.enableExchange)
@ -131,6 +134,9 @@ class _HomeViewState extends ConsumerState<HomeView> {
@override
dispose() {
_pageController.dispose();
_rotateIconController.forward = null;
_rotateIconController.reverse = null;
_rotateIconController.reset = null;
super.dispose();
}
@ -138,6 +144,8 @@ class _HomeViewState extends ConsumerState<HomeView> {
int _hiddenCount = 0;
void _hiddenOptions() {
_rotateIconController.reset?.call();
_rotateIconController.forward?.call();
if (_hiddenCount == 5) {
Navigator.of(context).pushNamed(HiddenSettings.routeName);
}
@ -168,10 +176,15 @@ class _HomeViewState extends ConsumerState<HomeView> {
children: [
GestureDetector(
onTap: _hiddenOptions,
child: SvgPicture.asset(
Assets.svg.stackIcon(context),
width: 24,
height: 24,
child: RotateIcon(
icon: SvgPicture.asset(
Assets.svg.stackIcon(context),
width: 24,
height: 24,
),
curve: Curves.easeInOutCubic,
rotationPercent: 1.0,
controller: _rotateIconController,
),
),
const SizedBox(

View file

@ -0,0 +1,76 @@
import 'package:flutter/widgets.dart';
class RotateIconController {
VoidCallback? forward;
VoidCallback? reverse;
VoidCallback? reset;
}
class RotateIcon extends StatefulWidget {
const RotateIcon({
Key? key,
required this.icon,
required this.curve,
this.controller,
this.animationDurationMultiplier = 1.0,
this.rotationPercent = 0.5,
}) : super(key: key);
final Widget icon;
final Curve curve;
final RotateIconController? controller;
final double animationDurationMultiplier;
final double rotationPercent;
@override
State<RotateIcon> createState() => _RotateIconState();
}
class _RotateIconState extends State<RotateIcon>
with SingleTickerProviderStateMixin {
late final AnimationController animationController;
late final Animation<double> animation;
late final Duration duration;
@override
void initState() {
duration = Duration(
milliseconds: (500 * widget.animationDurationMultiplier).toInt(),
);
animationController = AnimationController(
vsync: this,
duration: duration,
);
animation = Tween<double>(
begin: 0.0,
end: widget.rotationPercent,
).animate(
CurvedAnimation(
curve: widget.curve,
parent: animationController,
),
);
widget.controller?.forward = animationController.forward;
widget.controller?.reverse = animationController.reverse;
widget.controller?.reset = animationController.reset;
super.initState();
}
@override
void dispose() {
animationController.dispose();
widget.controller?.forward = null;
widget.controller?.reverse = null;
super.dispose();
}
@override
Widget build(BuildContext context) {
return RotationTransition(
turns: animation,
child: widget.icon,
);
}
}