Tap Animation Kit

A flutter package which contains a collection of some cool and awesome animations.

Table of contents

Installing

1. Depend on it

Add this to your package's pubspec.yaml file:

dependencies:
  tap_animation_kit: ^0.0.1

2. Install it

You can install packages from the command line:

with pub:

$ pub get

with Flutter:

$ flutter packages get

3. Import it

Now in your Dart code, you can use:

import 'package:tap_animation_kit/tap_animation_kit.dart';

Usage

You can use the animation for text and image.

Align Transition

TextAnimation(
    animationBahavior: TapAlignTransition(
        props: AlignTransitionModel(
        alignment: alignTransition.animate(controller),
        child: const Text(
            'AT',
            style: TextStyle(fontSize: 20, color: Colors.white),
        ),
        ),
    ),
);

Alignment

TextAnimation(
    animationBahavior: TapAnimatedAlign(
        props: AlignmentModel(
        alignment: store.alignment,
        child: const Text('TextAlignmentExample',
            style: TextStyle(color: Colors.red, fontSize: 20)),
        curve: Curves.easeInQuint,
        duration: const Duration(seconds: 1),
        ),
    ),
);

Cross Fade

TextAnimation(
    animationBahavior: TapAnimatedCrossFade(
        props: CrossFadeModel(
        alignment: Alignment.topCenter,
        crossFadeState: store.crossFadeState,
        duration: const Duration(seconds: 1),
        firstCurve: Curves.easeInCubic,
        firstChild: const Text(
            'FirstTextCrossFade',
            style: TextStyle(
            color: Colors.orange,
            fontSize: 20,
            ),
        ),
        secondChild: const Text(
            'SecondTextCrossFade',
            style:
                TextStyle(color: Colors.blueGrey, fontSize: 20),
        ),
        secondCurve: Curves.bounceInOut,
        sizeCurve: Curves.easeOutExpo,
        ),
    ),
);

Default Text Style

TextAnimation(
    animationBahavior: TapAnimatedDefaultTextStyle(
        props: DefaultTextStyleModel(
        duration: const Duration(seconds: 2),
        textAlign: TextAlign.center,
        style: store.defaultTextStyle,
        child: const Text('DefaultTextStyleExample'),
        ),
    ),
);

Opacity

TextAnimation(
    animationBahavior: TapAnimatedOpacity(
        props: OpacityModel(
        child: const Text('TextOpacityExample',
            style:
                TextStyle(color: Colors.green, fontSize: 20.0)),
        opacity: store.opacity,
        curve: Curves.easeInCubic,
        duration: const Duration(seconds: 1),
        ),
    ),
);

Padding

TextAnimation(
    animationBahavior: TapAnimatedPadding(
        props: PaddingModel(
        padding: store.padding,
        child: const Text('TextPaddingExample',
            style:
                TextStyle(color: Colors.purple, fontSize: 20)),
        curve: Curves.linear,
        duration: const Duration(seconds: 1),
        ),
    ),
);

Rotation Transition

TextAnimation(
    animationBahavior: TapRotationTransition(
        props: RotationTransitionModel(
            child: const Text('R'),
            alignment: Alignment.topCenter,
            turns: CurvedAnimation(
            parent: controller,
            curve: Curves.bounceOut,
            ),
        ),
    ),
);

Bugs or Requests

If you encounter any problems feel free to open an issue. If you feel the library is missing a feature, please raise a ticket on GitHub and I'll look into it. Pull request are also welcome.

License

Tap-animation-kit is licensed under BSD license. View license.

Libraries

tap_animation_kit