flutter tween animation axis example

Example: Flutter Tween animation by flutter420

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: FlutterAnimation(),
    );
  }
}

class FlutterAnimation extends StatefulWidget {
  @override
  _FlutterAnimationState createState() => _FlutterAnimationState();
}

class _FlutterAnimationState extends State<FlutterAnimation>
    with SingleTickerProviderStateMixin {
  AnimationController _controller;
  Animation<Color> colorAnimation;
  Animation<double> sizeAnimation;

  @override
  void initState() {
    super.initState();
    _controller =
        AnimationController(vsync: this, duration: Duration(seconds: 2));
    colorAnimation =
        ColorTween(begin: Colors.black, end: Colors.green).animate(_controller);

    sizeAnimation = Tween<double>(begin: 100, end: 500).animate(_controller);

    _controller.addListener(() {
      setState(() {});
    });
    _controller.forward();
  }

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Container(
          height: sizeAnimation.value,
          width: sizeAnimation.value,
          color: colorAnimation.value,
        ),
      ),
    );
  }
}

Tags:

Misc Example