AnimatedContainer

animated_container.dart

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

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  List<Color> list = [];

  var timer;
  var startTime=12;
  var opacityText = 0.0;

  var top = FractionalOffset.topCenter;
  var bottom = FractionalOffset.bottomCenter;


  /* Phone getHeight */
   double getHeight(BuildContext context) => MediaQuery.of(context).size.height;

  /* Phone getWidth */
   double getWidth(BuildContext context) => MediaQuery.of(context).size.width;

  startTimer(){
    list = [Colors.white,Colors.white70];
    timer = new Timer.periodic(Duration(seconds: 1), (Timer timer) => setState((){
      if(startTime<1){
        timer.cancel();
        opacityText = 1.0;

        // change to screen.
      }
      else{
        if(startTime<12 && startTime>=9) list = [Colors.white38,Colors.white12];
        else if(startTime<9 && startTime>=6) list = [Colors.white10,Colors.black12];
        else { list = [Colors.black54,Colors.black]; }
        startTime-=3;
      }
    }));
  }

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    startTimer();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Colors.black,
        body: new Container(
          alignment: Alignment.center,
          child: new Column(
            mainAxisAlignment: MainAxisAlignment.center,
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              new AnimatedContainer(
                duration: Duration(seconds: 1),
                height: getHeight(context),
                width:  getWidth(context),
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10.0),
                    gradient: LinearGradient(
                        begin: top,
                        end: bottom,
                        colors: list,
                        stops: [0.0,1.0]
                    )
                ),
                child: AnimatedOpacity(
                  opacity: opacityText,
                  duration: Duration(milliseconds: 700),
                  child:Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      Image.asset("assets/images/flutter.png"),
                      Text(
                        "Animated Container",
                        style: TextStyle(color: Colors.white,fontSize: 30.0,fontStyle: FontStyle.normal),
                      )
                    ],
                  ),
                ),
              ),
            ],
          ),
        )
    );
  }
}