MediaQuery (Flutter Widget of the Week)

[MUSIC PLAYING] SPEAKER 1: If you're writing an app for both phone and tablet, you'll want to have different UI layouts for different screen sizes. You might find yourself in a similar situation if the user has a preference set for a much larger font size or wants to minimize animations. Thanks to MediaQuery, you can get information about what size device you're on, as well as user preferences, and build your layout accordingly. A previous Widget of the Week introduced Layout Builder, which could tell you how much space a particular widget has available. MediaQuery provides a higher-level view of your app's screen size and can provide more detailed information about user layout preferences. In practice, MediaQuery is always there. You just access it by calling MediaQuery.of in your build method. From there you can look up all sorts of interesting information about the device you're running on, like the size of the screen, and build your layout accordingly. MediaQuery also allows you to check your device's orientation or determine if the user has modified the default font size. You can also check out the parts of the screen that are obscured by a system UI, much like a lower-level safe area widget. You can look up interesting accessibility information, like whether the device is requesting you limit your animations or the level of screen contrast. For more information on Media Query and all other Flutter widgets, check out flutter.dev.

Channel: Flutter

Views: 260,625

Keywords: MediaQuery, different screen sizes, app screen sizes, different UI layout for different screen sizes, user interface, LayoutBuilder, user preferences, get information about device size, build an app for different devices, build your layout accordingly, responsive layout, responsive app, responsive screen size, app layouts, adjusting app layouts for different devices, Flutter, Flutter Widgets, Flutter Widget of the Week, Flutter 101, Flutter developers, Flutter.dev, UI, UX, GDS: Yes;

Id: A3WrA4zAaPw

Length: 1min 38sec (98 seconds)

Published: Thu May 23 2019