在 Flutter 中正确使用 MediaQuery答案

【问题标题】：Proper use of MediaQuery in Flutter在 Flutter 中正确使用 MediaQuery
【发布时间】：2019-02-22 00:47:59
【问题描述】：

使用 MediaQuery 的最佳做法是什么？该应用程序将用于不同的屏幕尺寸，因此硬编码小部件的宽度和高度可能是个问题。

我很难理解 MediaQuery 类的不同用途。我尝试在网上搜索它，但我没有找到很多例子。如果有人能帮助我理解这个类，或者可以提供一个链接，我可以用来理解这个 MediaQuery 类，那就太好了。

【问题讨论】：

是的，尽量避免静态高度。 MediaQuery 用于获取屏幕的某些方面，但您也应该在必要时与 AspectRatio 结合使用。还要考虑更多的动态布局小部件，例如 Flexible、FitBox、Expanded、Stack 等。
medium.com/flutter-community/…

【解决方案1】：

会有几点：

例如，MediaQuery.of(context).size.width - 不会为您提供物理设备测量的确切宽度（以像素为单位），而是以逻辑像素为单位。要获得准确的物理设备测量值，您需要执行以下操作：MediaQuery.of(context).size.width * MediaQuery.of(context).devicePixelRatio
- MediaQuery.of(context).padding.top是状态栏的高度
- kToolbarHeight是AppBar的高度
- 如果您有底部导航栏，则高度为kBottomNavigationBarHeight。

所以，要扣除以上所有值，我们可以这样做：MediaQuery.of(context).size.height — MediaQuery.of(context).padding.top — kToolbarHeight — kBottomNavigationBarHeight

如果您仍在寻找问题的答案，我已在不久前整理了本教程。 Widgets sizes relative to screen size in Flutter using MediaQuery。希望对你有帮助！

【讨论】：