Simple Number Increment using Animation in Flutter

This Article is posted by seven.srikanth at 10-03-2019 08:33:54

In this article, I'm going to share you the example of how to create a Flutter program which will simply increment a Number using Animation.

Here is how the final output is going to look.

Below is an example code of how to do Number Increment using Animation in Flutter. This Code from Main.dart file. In order to run this project locally, all you need to do is to create a Project and copy paste the below code to Lib\main.dart file.

import 'package:flutter/material.dart';

main(List<String> args) {

class LogoApp extends StatefulWidget {
_LogoAppState createState() => _LogoAppState();

class _LogoAppState extends State<LogoApp>
with SingleTickerProviderStateMixin {

Animation<double> animation;
AnimationController _controller;
String i;
void initState() {
_controller = AnimationController(duration:const Duration(seconds: 10), vsync: this);
animation =Tween<double>(begin: 0, end: 300).animate(_controller)
// The state that has changed here is the animation objects value
i = animation.value.toStringAsFixed(0);

void dispose() {

Widget build(BuildContext context) {
return Center(
child: Container(
margin: EdgeInsets.symmetric(vertical: 10),
child: Text('$i', textDirection: TextDirection.rtl, style: TextStyle(fontSize: 20),),

Hope this example is helpful to you.


Tags: Simple Number Increment using Animation in Flutter

Login to comment.
Recent Comments

Be the first to Comment. You can ask a Query or Share your toughts or Just say thanks.

Recent Articles

Meme Generator with Flutter

Posted by theindianappguy on 25 Feb 2020 Tutorials

Flutter Scaffold Widget

Posted by themaaz32 on 05 Feb 2020 Tutorials

Flutter Tensorflow Tutorial

Posted by theindianappguy on 28 Jan 2020 Tutorials

Explicit Animations - RotationTransition in Flutter

Posted by seven.srikanth on 27 Jan 2020 Article

© 2018 - Fluttercentral | Email to me -