title: Animation not working properly in flutter?
body: <p><a href="https://i.stack.imgur.com/453ed.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/453ed.png" alt="enter image description here"></a></p>
  
  <p>I want 1st circle to go up and come down when I press the <code>click</code> button!</p>
  
  <p>the animation is not working.
  I tried restarting the app many times but the problem still remains.
  what is the problem?</p>
  
  <pre><code>import 'package:flutter/material.dart';
  
      class Pin extends StatefulWidget {
      @override
      _PinState createState() =&gt; _PinState();
      }
  
      class _PinState extends State&lt;Pin&gt; with SingleTickerProviderStateMixin {
      AnimationController _controller;
      Animation&lt;EdgeInsets&gt; _animation;
      @override
      void initState() {
          super.initState();
          _controller = AnimationController(
          vsync: this,
          duration: Duration(milliseconds: 300),
          );
  
          _animation = EdgeInsetsTween(
          begin: EdgeInsets.only(top: 0, left: 0, right: 0, bottom: 0),
          end: EdgeInsets.only(top: 0, left: 0, right: 0, bottom: 12),
          ).animate(CurvedAnimation(
          parent: _controller,
          curve: Curves.easeInOut,
          ));
  
          //_controller.forward();
          _controller.addStatusListener((status) {
          if (status == AnimationStatus.completed) {
              _controller.reverse();
          }
          });
      }
  
      @override
      Widget build(BuildContext context) {
          return Container(
          padding: const EdgeInsets.all(100),
          width: double.infinity,
          height: MediaQuery.of(context).size.height * 0.6,
          color: const Color.fromRGBO(113, 201, 206, 1),
          child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: &lt;Widget&gt;[
  
              Container(
                  width: 233,
                  height: 44,
                  color: Colors.blue,
                  child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: &lt;Widget&gt;[
                      Container(
                      padding: _animation.value,
                      height: double.infinity,
                      color: Colors.red,
                      alignment: Alignment.bottomCenter,
                      child: Container(
                          width: 32,
                          height: 32,
                          decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.circular(16),
                          ),
                      ),
                      ),
                      Container(
                      height: double.infinity,
                      alignment: Alignment.bottomCenter,
                      child: Container(
                          width: 32,
                          height: 32,
                          decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.circular(16),
                          ),
                      ),
                      ),
                      Container(
                      height: double.infinity,
                      alignment: Alignment.bottomCenter,
                      child: Container(
                          width: 32,
                          height: 32,
                          decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.circular(16),
                          ),
                      ),
                      ),
                      Container(
                      height: double.infinity,
                      alignment: Alignment.bottomCenter,
                      child: Container(
                          width: 32,
                          height: 32,
                          decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.circular(16),
                          ),
                      ),
                      ),
                  ],
                  ),
              ),
              Container(
                  child: RaisedButton(
                  onPressed: () {
                      setState(() {
                      _controller.stop();
                      _controller.forward();
                      print("Animation Started");
                      });
                  },
                  child: Text("Chick!"),
                  ),
              ),
              ],
          ),
          );
      }
      }
  </code></pre>
  
  <p>all the elements are made up of containers where this has one large blue rectangle container and inside it has, small four containers and inside it has a container with a rounded corner.</p>