为什么Flutter的MediaQuery从屏幕顶部开始计算？

Question

当我使用MediaQuery来调整容器的大小，就像这样 =>

height: MediaQuery.of(context).size.height - 100,

容器的减法或调整大小从底部开始而不是顶部。请有人帮忙。

- august

Answer 1

你可以使用 Align 将其包装起来。这是因为Flutter默认从左上角绘制小部件。

类似这样：

Align(
  alignment: Alignment.bottomCenter,
  child: Container(
    height: MediaQuery.of(context).size.height - 100,
    color: Colors.white,
  ),
),

- Federick Jonathan

---

感谢@FederickJonathan的回答，它真的帮了我很多，再次感谢。 - august

@august 没问题，如果你觉得某个答案有帮助，请打勾标记一下，这样其他人就知道这篇帖子已经有了正确的答案。干杯~ - Federick Jonathan

Answer 2

作为对@FederickJonathan的回答的补充， Align提供了一些默认位置来对齐小部件，如此处所述：https://api.flutter.dev/flutter/painting/Alignment-class.html#constants 但是您也可以自定义位置。

您可以通过将Alignment作为Alignment(X, Y)来自定义位置。

X = -1.0 - 1.0，从左到右开始

Y = -1.0 - 1.0，从上到下开始

有趣的事实：

不仅是flutter，几乎所有渲染框架都从屏幕的左上角开始绘制以显示您的视图。

这被称为视图/屏幕的原点。

在flutter中，如果没有提供坐标或对齐方式，则会看到视图从左上角开始绘制。

起点在材料设计中也被认为是光的来源。因此，所有的阴影最初都是投射到底部右侧的。 更新：材料设计结合了各种光源来制造阴影。因此上述事实并不适用于材料设计，但仍可在其他设计指南中看到它。

- Harshvardhan Joshi

---

感谢@HarshvardhanJoshi的贡献，现在我对使用对齐有了更好的了解。 - august