MediaQuery.of(context).size

main.dart

import 'dart:async';

import 'package:flutter/material.dart';
// import 'package:flutter/services.dart';
import 'widgets/AnimatedButton.dart';
import 'widgets/AnimatedInput.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        // This is the theme of your application.
        //
        // Try running your application with "flutter run". You'll see the
        // application has a blue toolbar. Then, without quitting the app, try
        // changing the primarySwatch below to Colors.green and then invoke
        // "hot reload" (press "r" in the console where you ran "flutter run",
        // or simply save your changes to "hot reload" in a Flutter IDE).
        // Notice that the counter didn't reset back to zero; the application
        // is not restarted.
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

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

  // This widget is the home page of your application. It is stateful, meaning
  // that it has a State object (defined below) that contains fields that affect
  // how it looks.

  // This class is the configuration for the state. It holds the values (in this
  // case the title) provided by the parent (in this case the App widget) and
  // used by the build method of the State. Fields in a Widget subclass are
  // always marked "final".

  final String title;

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

class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
  int _counter = 0;
  final FocusNode _blankFocusNode = FocusNode();
  final changeNotifier = new StreamController.broadcast();
  Animation<double> animatedScale;
  Animation<double> animatedTranslationY;
  Animation<double> animatedOpacity;
  AnimationController animationController;
  StreamSubscription streamSubscription;

  void _incrementCounter() {
    setState(() {
      // This call to setState tells the Flutter framework that something has
      // changed in this State, which causes it to rerun the build method below
      // so that the display can reflect the updated values. If we changed
      // _counter without calling setState(), then the build method would not be
      // called again, and so nothing would appear to happen.
      _counter++;
    });
  }

  void replay() {
    animationController.reset();
    animationController.forward();
  }

  @override
  didUpdateWidget(MyHomePage old) {
    super.didUpdateWidget(old);
    // // in case the stream instance changed, subscribe to the new one
    // if (widget.changeNotifier.stream.stream != old.changeNotifier.stream) {
    //   streamSubscription.cancel();
    //   streamSubscription = widget.shouldTriggerChange.listen((_) => replay());
    // }
  }

  @override
  void dispose() {
    _blankFocusNode.dispose();
    changeNotifier.close();
    animationController.dispose();
    streamSubscription.cancel();
    super.dispose();
  }

  @override
  void initState() {
    super.initState();

    animationController = AnimationController(
        duration: const Duration(milliseconds: 500), vsync: this);
    animatedScale = Tween<double>(begin: 1.0, end: 1.2).animate(CurvedAnimation(
      parent: animationController,
      curve: Curves.fastOutSlowIn,
    ))
      ..addListener(() {
        this.setState(() {});
      });
    animatedTranslationY =
        Tween<double>(begin: 0.0, end: 50.0).animate(CurvedAnimation(
      parent: animationController,
      curve: Curves.fastOutSlowIn,
    ))
          ..addListener(() {
            this.setState(() {});
          });
    animatedOpacity =
        Tween<double>(begin: 0.0, end: 1.0).animate(CurvedAnimation(
      parent: animationController,
      curve: Curves.fastOutSlowIn,
    ))
          ..addListener(() {
            this.setState(() {});
          });

    animationController.forward();

    streamSubscription = changeNotifier.stream.listen((_) {
      replay();
    });
  }

  Future<double> whenNotZero(Stream<double> source) async {
    await for (double value in source) {
      print("Width:" + value.toString());
      if (value > 0) {
        print("Width > 0: " + value.toString());
        return value;
      }
    }
    // stream exited without a true value, maybe return an exception.
  }

  @override
  Widget build(BuildContext context) {
    // This method is rerun every time setState is called, for instance as done
    // by the _incrementCounter method above.
    //
    // The Flutter framework has been optimized to make rerunning build methods
    // fast, so that you can just rebuild anything that needs updating rather
    // than having to individually change instances of widgets.

    return Scaffold(
//      appBar: AppBar(
//        // Here we take the value from the MyHomePage object that was created by
//        // the App.build method, and use it to set our appbar title.
//        title: Text(widget.title),
//      ),
      body: Container(
        // Center is a layout widget. It takes a single child and positions it
        // in the middle of the parent.
        child: GestureDetector(
          behavior: HitTestBehavior.opaque,
          onTap: () {
            FocusScope.of(context).requestFocus(_blankFocusNode);
          },
          child: SingleChildScrollView(
            padding: const EdgeInsets.all(8.0),
            child: IntrinsicHeight(
              child: FutureBuilder(
                future: whenNotZero(
                  Stream<double>.periodic(Duration(milliseconds: 50),
                      (x) => MediaQuery.of(context).size.width),
                ),
                builder: (BuildContext context, snapshot) {
                  if (snapshot.hasData) {
                    if (snapshot.data > 0) {
                      return Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          Container(padding: const EdgeInsets.all(0)),
                          Opacity(
                            opacity: animatedOpacity.value,
                            child: Transform.translate(
                              offset: Offset(0, animatedTranslationY.value),
                              child: Transform.scale(
                                scale: animatedScale.value,
                                child: Image.asset('graphics/nasa_logo.png',
                                    width: 150),
                              ),
                            ),
                          ),
                          Container(padding: const EdgeInsets.all(60)),
                          Container(
                            padding:
                                const EdgeInsets.symmetric(horizontal: 20.0),
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                AnimatedInput(
                                  shouldTriggerChange: changeNotifier.stream,
                                  width: MediaQuery.of(context).size.width,
                                  key: Key("username"),
                                  hint: "Username",
                                  icon: FontAwesomeIcons.solidUserCircle,
                                  baseDelay: 600,
                                ),
                                AnimatedInput(
                                  shouldTriggerChange: changeNotifier.stream,
                                  width: MediaQuery.of(context).size.width,
                                  key: Key("password"),
                                  hint: "Password",
                                  obscureText: true,
                                  icon: FontAwesomeIcons.lock,
                                  iconSize: 16.0,
                                  iconPadding: const EdgeInsets.only(left: 15),
                                  baseDelay: 800,
                                ),
                                Container(padding: const EdgeInsets.all(20)),
                                AnimatedButton(
                                    text: "Log In",
                                    shouldTriggerChange: changeNotifier.stream,
                                    onPressed: () {
                                      print("Login!");
                                    }),
                                Container(padding: const EdgeInsets.all(20)),
                                RawMaterialButton(
                                  child: Text("Reset"),
                                  onPressed: () {
                                    changeNotifier.sink.add(null);
                                  },
                                ),
                              ],
                            ),
                          ),
                        ],
                      );
                    }
                  } else {
                    return Container();
                  }
                },
              ),
            ),
          ),
        ),
      ),
    );
  }
}