easy_animate

Description:

easy animate

easy_animate #
beautiful simple animation for flutter!🚀
With this package, you can add animation effects super easily!!⛱
for example...
const FadeInAnimation(
child: YourFavoriteWidget(),
);
copied to clipboard
It`s so easy!🤩
You can easily add animation effects to your apps without setting any further properties.
However, you can customize/set Durtation, Direction, moveAmount and more properties as needed.

easy_animate

Dependency
Animation List

FadeIn
FadeOut
SlideIn
ScaleIn
Shake
Bounce
Fluffy
Pulse


Customizing Animation
Developer mode
Acknowledgments



Dependency #
simple_animation package
Animation List #
FadeIn #

FadeInAnimation(
animateDirection: AnimateDirection.left,
child: SomeWidget(),
);
copied to clipboard
FadeOut #

FadeOutAnimation(
animateDirection: AnimateDirection.right,
child: SomeWidget(),
);
copied to clipboard
SlideIn #

SlideInAnimation(
animateDirection: AnimateDirection.left,
child: SomeWidget(),
);
copied to clipboard
ScaleIn #

ScaleInAnimation(
child: SomeWidget(),
);
copied to clipboard
Shake #

ShakeAnimation(
isHorizontal: true,
child: SomeWidget(),
);
copied to clipboard
Bounce #

BouncingAnimation(
developerMode: true,
child: SomeWidget(),
);
copied to clipboard
Fluffy #

FluffyAnimation(
child: SomeWidget(),
);
copied to clipboard
Pulse #

PulseAnimation(
child: SomeWidget(),
);
copied to clipboard
Customizing Animation #
for example, you can customize FadeInAnimation like this.
FadeInAnimation(
animateDirection: AnimateDirection.right,
animateType: AnimateType.loop,
durationMilliseconds: 300,
moveAmount: 200,
child: MockBox(),
);
copied to clipboard



property
value
description




animateDirection
AnimateDirection.top, AnimateDirection.right, AnimateDirection.bottom, AnimateDirection.left, AnimateDirection.none
Defines the direction of the animation


animateType
AnimateType.once, AnimateType.loop, AnimateType.mirror
Defines the type of animation


durationMilliseconds
double
Defines the duration(ms) of the animation


moveAmount
double
Defines the distance of the animation


delay
Duration
Defines the delay of the animation



Developer mode #
You can check the animation effect in the developer mode.
It`s very useful for debugging.
AnimationDeveloperTools(
child: PulseAnimation(
developerMode: true, // don't forget this!
child: SomeWidget(),
)
);
copied to clipboard
Yes, just set AnimationDeveloperTools() as the parent widget and enable developerMode.
See simple_animation package for more details.
Acknowledgments #
I'm grateful for package simple_animation & Development team🙏