rolling_number_text 1.0.6

A Flutter package for animated number text with rolling digit animation and increase/decrease amount display.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:rolling_number_text/rolling_number_text.dart';
import 'dart:async';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Animated Number Text Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  late final AnimatedNumberTextController controller;
  Timer? _timer;

  @override
  void initState() {
    super.initState();
    controller = AnimatedNumberTextController();
    controller.initialize(1000000, shouldAnimate: true);

    // 예제: 1초마다 가격 증가
    _timer = Timer.periodic(const Duration(seconds: 1), (timer) {
      controller.updatePrice(controller.price.value + 100);
    });
  }

  @override
  void dispose() {
    _timer?.cancel();
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Animated Number Text Example'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            AnimatedNumberText(
              controller: controller,
              digitSpacing: 0.0,
              digitTextStyle: const TextStyle(
                fontSize: 44,
                fontWeight: FontWeight.bold,
                color: Colors.black,
              ),
              increaseTextStyle: const TextStyle(
                fontSize: 18,
                fontWeight: FontWeight.w600,
                color: Colors.green,
              ),
              animationDuration: const Duration(milliseconds: 800),
              animationCurve: Curves.easeOutCubic,
              increaseTextTop: -30,
              increaseTextRight: 20,
            ),
            const SizedBox(height: 50),
            ElevatedButton(
              onPressed: () {
                controller.updatePrice(controller.price.value + 1000);
              },
              child: const Text('Add 1000'),
            ),
          ],
        ),
      ),
    );
  }
}