MediaQuery in Flutter
An in-depth look at MediaQuery Widget
It’s been said, many developers learning Flutter first encounter the MediaQuery widget with an error. Something akin to, “MediaQuery.of() called with a context that does not contain a MediaQuery.” For example, these developers were no doubt told to use the static function, of, in the MediaQuery class when they wanted the width and or height of the phone’s screen. However, they did so with a little too much enthusiasm without starting their app up with a MaterialApp widget or a CupertinoApp widget.
The example app, mediaQuery.dart, we’re using, today, in this article is listed below. To demonstrate such an error, I initially didn’t use the class, MyApp, with its MaterialApp widget (first arrow) but merely supplied the widget, _MediaQueryWidget, to Flutter’s runApp() function and ran it. Because of the call MediaQuery.of() function (second arrow), the resulting ‘Red Screen of Dread’ is presented displaying the message, “No MediaQuery widget found.” The last screenshot comes about when the MaterialApp widget now used listing all the information currently provided by the MediaQuery widget.
