Flutter - 仅在有足够空间可用时才显示图像答案

【问题标题】：Flutter - only show image if enough space availableFlutter - 仅在有足够空间可用时才显示图像
【发布时间】：2019-01-15 21:45:30
【问题描述】：

我有一个 Expanded 小部件，它带有一个 Image.asset(...) 作为它的孩子。
在小型手机上没有足够的空间并且图像被大量缩小。因为无论如何它只是为了吸引眼球，如果至少没有可用的height >= 100.0，我想隐藏/不显示Image。

如何在 Flutter 中实现这一点？有没有办法获取父小部件的大小？

【问题讨论】：

你能把你的代码放上来吗？

标签： flutter flutter-layout

【解决方案1】：

您可以使用LayoutBuilder 获取小部件的输入约束。

然后根据这些约束决定显示或不显示图像

LayoutBuilder(
  builder: (context, constraint) {
      if (constraint.maxHeight < 100.0) {
        // too small
        return Container();
      } else {
        // ok
        return Column(
          children: <Widget>[
            Image.asset("foo"),
            Container()
          ],
        );
      }
  },
)

【讨论】：

太棒了！你为我节省了大量时间！

【解决方案2】：

Awesome Remi 的解决方案，您也可以使用 MediaQuery 和 MediaQueryData，它有一些属性和方法可以在这种情况下为您提供帮助。

一些属性是方向、大小、填充、devicePixelRatio 等。

例子：

MediaQuery.of(context).orientation

https://docs.flutter.io/flutter/widgets/MediaQuery-class.html https://docs.flutter.io/flutter/widgets/MediaQueryData-class.html

【讨论】：