Animate class

The Flutter Animate library makes adding beautiful animated effects to your widgets simple. It supports both a declarative and chained API. The latter is exposed via the Widget.animate extension, which simply wraps the widget in Animate.

// declarative:
Animate(child: foo, effects: [FadeEffect(), ScaleEffect()])

// chained API:
foo.animate().fade().scale() // equivalent to above

Effects are always run in parallel (ie. the fade and scale effects in the example above would be run simultaneously), but you can apply delays to offset them or run them in sequence.

All effects classes are immutable, and can be shared between Animate instances, which lets you create libraries of effects to reuse throughout your app.

List<Effect> transitionIn = [
  FadeEffect(duration: 100.ms, curve: Curves.easeOut),
  ScaleEffect(begin: 0.8, curve: Curves.easeIn)
];
// then:
Animate(child: foo, effects: transitionIn)
// or:
foo.animate(effects: transitionIn)

Effects inherit some of their properties (delay, duration, curve) from the previous effect if unspecified. So in the examples above, the scale will use the same duration as the fade that precedes it. All effects have reasonable defaults, so they can be used simply: foo.animate().fade()

Note that all effects are composed together, not run sequentially. For example, the following would not fade in myWidget, because the fadeOut effect would still be applying an opacity of 0:

myWidget.animate().fadeOut(duration: 200.ms).fadeIn(delay: 200.ms)

See SwapEffect for one approach to work around this.

Inheritance

Mixed-in types

AnimateManager<Animate>

Available extensions

Constructors

Animate({Key? key, Widget child = const SizedBox.shrink(), List<Effect>? effects, AnimateCallback? onInit, AnimateCallback? onPlay, AnimateCallback? onComplete, bool? autoPlay, Duration? delay, AnimationController? controller, Adapter? adapter, double? value, double? target}): Creates an Animate instance that will manage a list of effects and apply them to the specified child.

Properties

adapter → Adapter?: An Adapter can drive the animation from an external source (ex. a ScrollController, ValueNotifier, or arbitrary 0-1 value). For more information see Adapter or an adapter class (ChangeNotifierAdapter, ScrollAdapter, ValueAdapter, ValueNotifierAdapter).
final
autoPlay → bool: Setting autoPlay to false prevents the animation from automatically starting its controller (ie. calling AnimationController.forward).
final
child → Widget: The widget to apply animated effects to.
final
controller → AnimationController?: An external AnimationController can optionally be specified. By default Animate creates its own controller internally, which can be accessed via onInit or onPlay.
final
delay → Duration: Defines a delay before the animation is started. Unlike Effect.delay, this is not a part of the overall animation, and only runs once if the animation is looped. onPlay is called after this delay.
final
duration → Duration: The total duration for all effects.
no setter
hashCode → int: The hash code for this object.
no setterinherited
key → Key?: Controls how one widget replaces another widget in the tree.
finalinherited
makeRefreshable → Widget: Available on Widget?, provided by the WidgetExtension extension
Make your any widget refreshable with RefreshIndicator on top
no setter
onComplete → AnimateCallback?: Called when all effects complete. Provides an opportunity to manipulate the AnimationController (ex. to loop, reverse, etc).
final
onInit → AnimateCallback?: Called immediately after the controller is fully initialized, before the Animate.delay or the animation starts playing (see: onPlay). This is not called if an external controller is provided.
final
onPlay → AnimateCallback?: Called when the animation begins playing (ie. after Animate.delay, immediately after AnimationController.forward is called). Provides an opportunity to manipulate the AnimationController (ex. to loop, reverse, stop, etc). This is never called if autoPlay is false. See also: onInit.
final
runtimeType → Type: A representation of the runtime type of the object.
no setterinherited
target → double?: Sets a target position for the animation between 0 (start) and 1 (end). When target is changed, it will animate to the new position.
final
value → double?: Sets an initial position for the animation between 0 (start) and 1 (end). This corresponds to the value of the animation's controller. When value is changed, it will jump to the new position.
final

Methods

addEffect(Effect effect) → Animate: Adds an effect. This is mostly used by Effect extension methods to append effects to an Animate instance.
override
addEffects(List<Effect> effects) → Animate: inherited
addMaterialWidget() → Material: Available on Widget, provided by the GenericExtensions extension
addTooltipWidget(String toolTip) → Tooltip: Available on Widget, provided by the GenericExtensions extension
animate({Key? key, List<Effect>? effects, AnimateCallback? onInit, AnimateCallback? onPlay, AnimateCallback? onComplete, bool? autoPlay, Duration? delay, AnimationController? controller, Adapter? adapter, double? target, double? value}) → Animate: Available on Widget, provided by the AnimateWidgetExtensions extension
Wraps the target Widget in an Animate instance, and returns the instance for chaining calls. Ex. myWidget.animate() is equivalent to Animate(child: myWidget).
borderRadius([BorderRadiusGeometry? borderRadius]) → Widget: Available on Widget, provided by the GenericExtensions extension
boxDecoration([BoxDecoration? boxDecoration]) → Widget: Available on Widget, provided by the GenericExtensions extension
center({double? heightFactor, double? widthFactor}) → Widget: Available on Widget?, provided by the WidgetExtension extension
set parent widget in center
colorFilter([ColorFilter? colorFilter]) → Widget: Available on Widget, provided by the GenericExtensions extension
set parent widget in center
cornerRadiusWithClipRRect(double radius) → ClipRRect: Available on Widget?, provided by the WidgetExtension extension
add corner radius
cornerRadiusWithClipRRectOnly({int bottomLeft = 0, int bottomRight = 0, int topLeft = 0, int topRight = 0}) → ClipRRect: Available on Widget?, provided by the WidgetExtension extension
add custom corner radius each side
createElement() → StatefulElement: Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() → State<Animate>: Creates the mutable state for this widget at a given location in the tree.
override
debugDescribeChildren() → List<DiagnosticsNode>: Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void: Add additional properties associated with the node.
inherited
expand({int flex = 1}) → Widget: Available on Widget?, provided by the WidgetExtension extension
add Expanded to parent widget
fit({BoxFit? fit, AlignmentGeometry? alignment}) → Widget: Available on Widget?, provided by the WidgetExtension extension
add FittedBox to parent widget
flexible({int flex = 1, FlexFit? fit}) → Widget: Available on Widget?, provided by the WidgetExtension extension
add Flexible to parent widget
launch<T>(BuildContext context, {bool isNewTask = false, PageRouteAnimation? pageRouteAnimation, Duration? duration, String? routeName, Object? routeArguments}) → Future<T?>: Available on Widget?, provided by the WidgetExtension extension
Launch a new screen
noSuchMethod(Invocation invocation) → dynamic: Invoked when a nonexistent method or property is accessed.
inherited
onTap(Function? function, {BorderRadius? borderRadius, Color? splashColor, Color? hoverColor, Color? highlightColor, Color? focusColor, WidgetStateProperty<Color?>? overlayColor}) → Widget: Available on Widget?, provided by the WidgetExtension extension
add tap to parent widget
opacity({required double opacity, int durationInSecond = 1, Duration? duration}) → Widget: Available on Widget?, provided by the WidgetExtension extension
add opacity to parent widget
paddingAll(double padding) → Padding: Available on Widget?, provided by the WidgetExtension extension
return padding all
paddingBottom(double bottom) → Padding: Available on Widget?, provided by the WidgetExtension extension
return padding bottom
paddingDirectional({double start = 0.0, double top = 0.0, double end = 0.0, double bottom = 0.0}) → Widget: Available on Widget?, provided by the WidgetExtension extension
paddingLeft(double left) → Padding: Available on Widget?, provided by the WidgetExtension extension
return padding left
paddingOnly({double top = 0.0, double left = 0.0, double bottom = 0.0, double right = 0.0}) → Padding: Available on Widget?, provided by the WidgetExtension extension
return custom padding from each side
paddingRight(double right) → Padding: Available on Widget?, provided by the WidgetExtension extension
return padding right
paddingSymmetric({double vertical = 0.0, double horizontal = 0.0}) → Padding: Available on Widget?, provided by the WidgetExtension extension
return padding symmetric
paddingTop(double top) → Padding: Available on Widget?, provided by the WidgetExtension extension
return padding top
rotate({required double angle, bool transformHitTests = true, Offset? origin}) → Widget: Available on Widget?, provided by the WidgetExtension extension
add rotation to parent widget
scale({required double scale, Offset? origin, AlignmentGeometry? alignment, bool transformHitTests = true}) → Widget: Available on Widget?, provided by the WidgetExtension extension
add scaling to parent widget
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode: Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
tooltip({required String msg}) → Widget: Available on Widget?, provided by the WidgetExtension extension
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String: A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String: Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String: Returns a one-line detailed description of the object.
inherited
toStringShort() → String: A short, textual description of this widget.
inherited
translate({required Offset offset, bool transformHitTests = true, Key? key}) → Widget: Available on Widget?, provided by the WidgetExtension extension
add translate to parent widget
validate({Widget value = const SizedBox()}) → Widget: Available on Widget?, provided by the WidgetExtension extension
Validate given widget is not null and returns given value if null.
visible(bool visible, {Widget? defaultWidget}) → Widget: Available on Widget?, provided by the WidgetExtension extension
set visibility
withHeight(double height) → SizedBox: Available on Widget?, provided by the WidgetExtension extension
With custom height
withRoundedCorners({Color backgroundColor = whiteColor, BorderRadius borderRadius = const BorderRadius.all(Radius.circular(8.0)), LinearGradient? gradient, BoxBorder? border, List<BoxShadow>? boxShadow, DecorationImage? decorationImage, BoxShape boxShape = BoxShape.rectangle}) → Container: Available on Widget?, provided by the WidgetExtension extension
withScroll({ScrollPhysics? physics, EdgeInsetsGeometry? padding, Axis scrollDirection = Axis.vertical, ScrollController? controller, DragStartBehavior dragStartBehavior = DragStartBehavior.start, bool? primary, required bool reverse}) → Widget: Available on Widget?, provided by the WidgetExtension extension
withShaderMask(List<Color> colors, {BlendMode blendMode = BlendMode.srcATop}) → Widget: Available on Widget?, provided by the WidgetExtension extension
Wrap with ShaderMask widget
withShaderMaskGradient(Gradient gradient, {BlendMode blendMode = BlendMode.srcATop}) → Widget: Available on Widget?, provided by the WidgetExtension extension
Wrap with ShaderMask widget Gradient
withShadow({Color bgColor = whiteColor, Color shadowColor = Colors.black12, dynamic blurRadius = 10.0, dynamic spreadRadius = 0.0, Offset offset = const Offset(0.0, 0.0), LinearGradient? gradient, BoxBorder? border, DecorationImage? decorationImage, BoxShape boxShape = BoxShape.rectangle}) → Container: Available on Widget?, provided by the WidgetExtension extension
withSize({double width = 0.0, double height = 0.0}) → SizedBox: Available on Widget?, provided by the WidgetExtension extension
With custom height and width
withTooltip({required String msg}) → Widget: Available on Widget?, provided by the WidgetExtension extension
Validate given widget is not null and returns given value if null.
withVisibility(bool visible, {Widget? replacement, bool maintainAnimation = false, bool maintainState = false, bool maintainSize = false, bool maintainSemantics = false, bool maintainInteractivity = false}) → Visibility: Available on Widget?, provided by the WidgetExtension extension
set widget visibility
withWidth(double width) → SizedBox: Available on Widget?, provided by the WidgetExtension extension
With custom width

Operators

operator ==(Object other) → bool: The equality operator.
inherited

Static Properties

defaultCurve ↔ Curve: Default curve for effects.
getter/setter pair
defaultDuration ↔ Duration: Default duration for effects.
getter/setter pair
reparentTypes ↔ Map: Widget types to reparent, mapped to a method that handles that type. This is used to make it easy to work with widgets that require specific parents. For example, the Positioned widget, which needs its immediate parent to be a Stack.
getter/setter pair
restartOnHotReload ↔ bool: If true, then animations will automatically restart whenever a hot reload occurs. This is useful for testing animations quickly during development.
getter/setter pair