WIP: added arrowRotate lottie animation

This commit is contained in:
ryleedavis 2023-04-21 17:00:28 -06:00
parent 90ef8c8694
commit 360d6d7266
3 changed files with 104 additions and 16 deletions

View file

@ -1,9 +1,11 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:lottie/lottie.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/utilities/util.dart';
import 'package:stackwallet/widgets/animated_widgets/rotate_animation.dart';
import 'package:stackwallet/widgets/desktop/desktop_dialog.dart';
import 'package:stackwallet/widgets/desktop/desktop_dialog_close_button.dart';
import 'package:stackwallet/widgets/desktop/secondary_button.dart';
@ -22,6 +24,7 @@ class _RestoringDialogState extends State<ClaimingPaynymDialog>
with TickerProviderStateMixin {
late AnimationController? _spinController;
late Animation<double> _spinAnimation;
late RotateAnimationController? _rotateAnimationController;
@override
void initState() {
@ -35,6 +38,8 @@ class _RestoringDialogState extends State<ClaimingPaynymDialog>
curve: Curves.linear,
);
_rotateAnimationController = RotateAnimationController();
super.initState();
}
@ -43,6 +48,9 @@ class _RestoringDialogState extends State<ClaimingPaynymDialog>
_spinController?.dispose();
_spinController = null;
_rotateAnimationController?.forward = null;
_rotateAnimationController?.reset = null;
super.dispose();
}
@ -115,15 +123,23 @@ class _RestoringDialogState extends State<ClaimingPaynymDialog>
child: StackDialog(
title: "Claiming PayNym",
message: "We are generating your PayNym",
icon: RotationTransition(
turns: _spinAnimation,
child: SvgPicture.asset(
Assets.svg.arrowRotate,
color:
Theme.of(context).extension<StackColors>()!.accentColorDark,
width: 24,
height: 24,
// icon: RotationTransition(
// turns: _spinAnimation,
// child: SvgPicture.asset(
// Assets.svg.arrowRotate,
// color:
// Theme.of(context).extension<StackColors>()!.accentColorDark,
// width: 24,
// height: 24,
// ),
// ),
icon: RotateAnimation(
lottie: Lottie.asset(
Assets.lottie.arrowRotate,
// delegates: LottieDelegates(values: []),
),
curve: Curves.easeInOutCubic,
controller: _rotateAnimationController,
),
rightButton: SecondaryButton(
label: "Cancel",

View file

@ -1,5 +1,6 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:lottie/lottie.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/text_styles.dart';
@ -9,6 +10,8 @@ import 'package:stackwallet/utilities/util.dart';
import 'package:stackwallet/widgets/desktop/secondary_button.dart';
import 'package:stackwallet/widgets/stack_dialog.dart';
import '../../../widgets/animated_widgets/rotate_animation.dart';
class BuildingTransactionDialog extends StatefulWidget {
const BuildingTransactionDialog({
Key? key,
@ -28,6 +31,8 @@ class _RestoringDialogState extends State<BuildingTransactionDialog>
late AnimationController? _spinController;
late Animation<double> _spinAnimation;
late RotateAnimationController? _rotateAnimationController;
late final VoidCallback onCancel;
@override
@ -44,6 +49,8 @@ class _RestoringDialogState extends State<BuildingTransactionDialog>
curve: Curves.linear,
);
_rotateAnimationController = RotateAnimationController();
super.initState();
}
@ -52,6 +59,9 @@ class _RestoringDialogState extends State<BuildingTransactionDialog>
_spinController?.dispose();
_spinController = null;
_rotateAnimationController?.forward = null;
_rotateAnimationController?.reset = null;
super.dispose();
}
@ -80,15 +90,13 @@ class _RestoringDialogState extends State<BuildingTransactionDialog>
),
),
if (!isChans)
RotationTransition(
turns: _spinAnimation,
child: SvgPicture.asset(
Assets.svg.arrowRotate,
color:
Theme.of(context).extension<StackColors>()!.accentColorDark,
width: 24,
height: 24,
RotateAnimation(
lottie: Lottie.asset(
Assets.lottie.arrowRotate,
// delegates: LottieDelegates(values: []),
),
curve: Curves.easeInOutCubic,
controller: _rotateAnimationController,
),
const SizedBox(
height: 40,

View file

@ -0,0 +1,64 @@
import 'package:flutter/widgets.dart';
class RotateAnimationController {
VoidCallback? forward;
VoidCallback? reset;
}
class RotateAnimation extends StatefulWidget {
const RotateAnimation({
Key? key,
required this.lottie,
required this.curve,
this.controller,
}) : super(key: key);
final Widget lottie;
final Curve curve;
final RotateAnimationController? controller;
@override
State<RotateAnimation> createState() => _RotateAnimationState();
}
class _RotateAnimationState extends State<RotateAnimation>
with SingleTickerProviderStateMixin {
late final AnimationController animationController;
late final Animation<double> animation;
late final Duration duration;
@override
void initState() {
animationController = AnimationController(
vsync: this,
);
animation = Tween<double>(
begin: 0.0,
).animate(
CurvedAnimation(
curve: widget.curve,
parent: animationController,
),
);
widget.controller?.forward = animationController.forward;
widget.controller?.reset = animationController.reset;
super.initState();
}
@override
void dispose() {
animationController.dispose();
widget.controller?.forward = null;
super.dispose();
}
@override
Widget build(BuildContext context) {
return RotationTransition(
turns: animation,
child: widget.lottie,
);
}
}