animated_number

安裝套件

flutter pub add animated_number

套件介紹

根據套件公開資料產生的選型評估，僅供參考。

一個 Flutter 套件，可為動態 UI 提供流暢的動畫數字過渡。它會自動對整數值之間的變更進行動畫處理，非常適合用於計數器、分數顯示或任何隨時間更新的數值資料。此套件輕量且易於整合，支援所有主要平台，包括 Android、iOS、Web、macOS、Windows 和 Linux。透過自訂持續時間、曲線和格式選項，它在值變更時提供視覺反饋，從而提升使用者體驗。

適用情境

即時得分計數器
動態統計顯示
進度指示器
動態價格更新
倒計時

主要特色

平滑數值插值
可自訂的動畫持續時間
支援十進位數字
靈活的格式選項
跨平台相容性

適合對象

遊戲化應用
儀表板小部件
財務追蹤介面
教育類應用
互動式 UI 組件

使用建議

最適合整數或小數值
可能需要額外的樣式設定以實現複雜格式化
僅限數值動畫
不適合非數值型資料
高頻率更新帶來的效能影響

原始 README

以下為關聯原始碼儲存庫的 README 原文快照，最新內容請造訪原始碼儲存庫。

Animated Number flutter package

This is an custom widget developed for flutter with some awesome features that will make your users more satisfied when they look into their numbers.

Preview

Sample

Getting started

Supported platforms

	Android	iOS	Linux	macOS	Web	Windows
Support	SDK 16+	9.0+	Any	10.11+	Any	Any

Usage

To use this plugin, add animated_number as a dependency in your pubspec.yaml file.

Examples

AnimatedNumber(
    startValue: 0,
    endValue: 2000,
    duration: Duration(seconds: 2),
    isFloatingPoint: false,
    style: TextStyle(
    color: Colors.orange,
    fontSize: 24,
    ),
)

AnimatedNumber(
    startValue: 0,
    endValue: 5500.38273626732,
    duration: Duration(seconds: 5),
    isFloatingPoint: true,
    decimalPoint: 4,
    style: TextStyle(
        color: Colors.lightBlue,
        fontSize: 42,
    ),
)

Features

Properties	Type	Description
startValue	num	Desired start value.
endValue	num	Desired end value.
duration	Duration	Duration for the animation.
isFloatingPoint	bool	Flag that controls if the iteration of the animation will be integer or floating point.
decimalPoint	int	Desired decimal points.
style	TextStyle?	Text style.
textAlign	TextAlign?	How the text should be aligned horizontally.
prefixText	String?	Desired prefix text.
sufixText	String?	Desired sufix text.

Contact

Any questions, issues or improvements feel free to contact me.
yagon2395@gmail.com

License

MIT

所屬分類

文字裝飾、效果與動畫

搜尋套件、儲存庫與 APP 分類