CounterMagnification

main.dart

import 'dart:math';
import 'package:flutter/material.dart';
void main() {
  runApp(MyApp());
}
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: CounterMagnification(),
    );
  }
}
class CounterMagnification extends StatefulWidget {
  @override
  _CounterMagnificationState createState() => _CounterMagnificationState();
}
class _CounterMagnificationState extends State<CounterMagnification>
    with TickerProviderStateMixin {
  AnimationController _controller;
  @override
  void initState() {
    super.initState();
    _controller = AnimationController(
      duration: const Duration(milliseconds: 2500),
      vsync: this,
    );
  }
  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }
  Future<void> _playAnimation() async {
    try {
      _controller.reset();
      await _controller.forward().orCancel;
      //await _controller.reverse().orCancel;
    } on TickerCanceled {
      // the animation got canceled, probably because it was disposed of
    }
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      appBar: AppBar(
        title: const Text('Staggered Animation'),
      ),
      body: GestureDetector(
        behavior: HitTestBehavior.opaque,
        onTap: _playAnimation,
        child: Center(
          child: StagAnimnation(controller: _controller.view),
        ),
      ),
    );
  }
}
class StagAnimnation extends StatelessWidget {
  StagAnimnation({Key key, this.controller})
      : number = IntTween(
          begin: 0,
          end: 500,
        ).animate(
          CurvedAnimation(
            parent: controller,
            curve: Interval(0.0, 0.75, curve: Curves.decelerate),
          ),
        ),
        angle = Tween<double>(
          begin: 0.0,
          end: 2 * pi,
        ).animate(
          CurvedAnimation(
            parent: controller,
            curve: Interval(0.76, 1.0, curve: Curves.ease),
          ),
        ),
        super(key: key);
  final AnimationController controller;
  final Animation<int> number;
  final Animation<double> angle;
  // This function is called each time the controller "ticks" a new frame.
  // When it runs, all of the animation's values will have been
  // updated to reflect the controller's current value.
  Widget _buildAnimation(BuildContext context, Widget child) {
    return Text(
      "${number.value}",
      style: TextStyle(
        fontSize: 42 + (8 * sin(angle.value)),
        color: Colors.white,
      ),
    );
  }
  @override
  Widget build(BuildContext context) {
    return AnimatedBuilder(
      animation: controller,
      builder: _buildAnimation,
    );
  }
}