https://github.com/silentcatd/animated_text_lerp

Package for animated text in Flutter. Useful for currency value increase/decrease value animation or text contents lerp animation.
https://github.com/silentcatd/animated_text_lerp

Last synced: 8 days ago
JSON representation

Package for animated text in Flutter. Useful for currency value increase/decrease value animation or text contents lerp animation.

• Host: GitHub
• URL: https://github.com/silentcatd/animated_text_lerp
• Owner: SilentCatD
• License: mit
• Created: 2023-01-22T15:03:14.000Z (almost 2 years ago)
• Default Branch: main
• Last Pushed: 2023-01-23T15:33:43.000Z (almost 2 years ago)
• Last Synced: 2023-08-10T14:14:32.676Z (over 1 year ago)
• Language: Dart
• Size: 2.74 MB
• Stars: 3
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        

[![pub package](https://img.shields.io/pub/v/animated_text_lerp?color=green&include_prereleases&style=plastic)](https://pub.dev/packages/animated_text_lerp)

Simple widgets to animate between number or string text. Useful for number increase/decrease 

animation, currency value animation or string content changing animation.

## Features

- Similar to a simple Text widget.

- Animating between number (int or double) with AnimatedNumberText.

- Animating between string, which will lerp each character respectively with AnimatedStringText.

- TextStyle animation supported.

- Think of Flutter's pre-built animated widget like AnimatedOpacity, AnimatedAlign, ..., 

but with text.

## Getting started

- First import it:

```dart

import 'package:animated_text_lerp/animated_text_lerp.dart';

```

## Usage

# AnimatedNumberText

[//]: # (![](https://github.com/SilentCatD/animated_text/blob/main/assets/animated_number_text.gif))



The widget support lerping between number values. Just setState with the current value and the 

widget will start animating to it.

```dart

AnimatedNumberText(

  value, // int or double

  curve: Curves.easeIn,

  duration: const Duration(seconds: 1),

  style: const TextStyle(fontSize: 30),

  formatter: (value) {

    final formatted =

    intl.NumberFormat.currency(locale: "en").format(value);

    return formatted;

  },

)

```

# AnimatedStringText

[//]: # (![](https://github.com/SilentCatD/animated_text/blob/main/assets/animated_text.gif))



The widget support lerping between string values. Just setState with the current value and the 

widget will start animating to it. Each character will lerp to the new corresponding one 

respectively.

```dart

AnimatedStringText(

  value, // string

  curve: Curves.easeIn,

  duration: const Duration(seconds: 1),

  style: const TextStyle(fontSize: 30),

)

```