Flutter Awesome Animations Kit

Effortlessly animate any widget or list item by picking an animation type — no boilerplate, no complexity. 15 animation types, fully customizable. 🚀✨

last commit

Preview


Entry Animations (1/2) _{fadeIn · fadeInUp · scale · slideRTL · slideLTR · slideUp}	Entry Animations (2/2) _{slideDown · flip · bounce · scaleLTR · scaleCenterZoomOut · rotate}

Animated Text _{countUp · countDown · typing}	Attention Seekers _{pulse · shake}

Features

FlutterAnimatedView

15 built-in animation types: fadeIn, fadeInUp, scale, slideRTL, slideLTR, slideUp, slideDown, flip, bounce, scaleLTR, scaleCenterZoomOut, rotate, pulse, shake, none
Staggered ListView animations via the index parameter
Fully customizable duration, curve, repeatMode, and delayBetweenAnimation

FlutterAnimatedText

4 text animation types: countUp, countDown, typing, none
Configurable precision for decimal counters
Fully customizable duration, curve, style, and repeatMode

Installation

flutter pub add flutter_awesome_animations_kit

import 'package:flutter_awesome_animations_kit/flutter_awesome_animations_kit.dart';

Requires Flutter ≥ 3.0.0 · Dart ≥ 2.17.0

Quick Start

// Animate any widget
FlutterAnimatedView(
  animationType: AnimationType.fadeIn,
  child: const Text('Hello!'),
)

// Staggered ListView
ListView.builder(
  itemCount: 20,
  itemBuilder: (context, index) {
    return FlutterAnimatedView(
      index: index,
      animationType: AnimationType.slideRTL,
      child: ListTile(title: Text('Item $index')),
    );
  },
)

// Animated counter
FlutterAnimatedText(
  startValue: 0,
  endValue: 100,
  animationType: TextAnimationType.countUp,
)

FlutterAnimatedView

Animation Types

Type	Description
`none`	No animation
`fadeIn`	Fade in
`fadeInUp`	Fade in + slide up simultaneously
`scale`	Scale up from center
`slideRTL`	Slide from right to left
`slideLTR`	Slide from left to right
`slideUp`	Slide up from bottom
`slideDown`	Slide down from top
`flip`	3D flip
`bounce`	Bounce
`scaleLTR`	Scale from left edge
`scaleCenterZoomOut`	Zoom out from center
`rotate`	Full 360° spin into place
`pulse`	Scale pulse — great with `repeatMode`
`shake`	Horizontal shake — great with `repeatMode`

Parameters

Parameter	Type	Default	Description
`child`	`Widget`	required	The widget to animate
`animationType`	`AnimationType`	`AnimationType.slideRTL`	Animation to apply
`duration`	`Duration`	`Duration(milliseconds: 500)`	Animation duration
`curve`	`Curve`	`Curves.easeInOut`	Easing curve
`index`	`int?`	`null`	Item index for staggered ListView animations
`repeatMode`	`bool`	`false`	Repeat animation continuously
`delayBetweenAnimation`	`Duration`	`Duration(milliseconds: 50)`	Delay before animation starts (used without `index`)

Example — ListView

ListView.builder(
  itemCount: 20,
  itemBuilder: (context, index) {
    return FlutterAnimatedView(
      index: index,
      animationType: AnimationType.slideRTL,
      duration: const Duration(milliseconds: 500),
      curve: Curves.easeInOut,
      child: Card(
        child: ListTile(title: Text('Item $index')),
      ),
    );
  },
)

FlutterAnimatedView(
  animationType: AnimationType.scale,
  repeatMode: true,
  duration: const Duration(milliseconds: 800),
  child: const Icon(Icons.star, size: 48),
)

FlutterAnimatedText

Animation Types

Type	Description
`countUp`	Counts from `startValue` up to `endValue`
`countDown`	Counts from `endValue` down to `startValue`
`typing`	Reveals `normalText` character by character
`none`	Displays static text

Parameters

Parameter	Type	Default	Description
`animationType`	`TextAnimationType`	`TextAnimationType.none`	Animation to apply
`startValue`	`double?`	`null`	Start value (`countUp` / `countDown`)
`endValue`	`double?`	`null`	End value (`countUp` / `countDown`)
`precision`	`int`	`0`	Decimal places for count animations
`normalText`	`String?`	`null`	Text for `typing` / `none`
`duration`	`Duration`	`Duration(seconds: 1)`	Animation duration
`curve`	`Curve`	`Curves.easeInOut`	Easing curve
`style`	`TextStyle?`	`null`	Text style
`repeatMode`	`bool`	`false`	Repeat animation continuously

Example

Row(
  children: [
    // Count up 0 → 100
    FlutterAnimatedText(
      startValue: 0,
      endValue: 100,
      animationType: TextAnimationType.countUp,
      style: const TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
    ),

    // Count down 100 → 0 with decimal
    FlutterAnimatedText(
      startValue: 0,
      endValue: 100,
      precision: 1,
      animationType: TextAnimationType.countDown,
      style: const TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
    ),

    // Typing effect
    FlutterAnimatedText(
      normalText: 'Hello World...',
      animationType: TextAnimationType.typing,
      duration: const Duration(seconds: 2),
      style: const TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
    ),
  ],
)

Additional Information

Issues & feature requests: GitHub issue tracker
Contributions: Pull requests are welcome on GitHub
Platforms: Android ✅ · iOS ✅ · Web ✅

Flutter Awesome Animations Kit

Preview

Features

FlutterAnimatedView

FlutterAnimatedText

Installation

Quick Start

FlutterAnimatedView

Animation Types

Parameters

Example — ListView

Example — Standalone Widget

FlutterAnimatedText

Animation Types

Parameters

Example

Additional Information

Libraries

flutter_awesome_animations_kit package