flutter - 淡入网络图像在加载后调整大小

Question

这是我的问题的视频 https://www.youtube.com/watch?v=wskX_bZNExw

如果您注意到，在加载网络图像后，它会调整大小（通常会删除空白空间）。

  Widget _buildPostThumbnail(List<SubmissionPreview> thumbnails) {
    if (thumbnails != null && thumbnails.isNotEmpty) {
      var image = thumbnails.first.resolutions.last;
      return Container(
        width: double.maxFinite,
        child: FadeInImage.memoryNetwork(
          placeholder: kTransparentImage,
          image: image.url.toString(),
        ),
      );
    }
    return Container();
  }

我怎样才能让图像从它在屏幕上弹出的那一刻起只占用最小空间，而不是在它有时间调整大小之后？

谢谢。

Answer 1

您可以将height周围环境的 设置Container为固定值并fit: BoxFit.fitheight在您的FadeInImage.

Answer 2

Widget _buildPostThumbnail(List<SubmissionPreview> thumbnails) {
    if (thumbnails != null && thumbnails.isNotEmpty) {
      var image = thumbnails.first.resolutions.last;
      return FadeInImage.memoryNetwork(
        fadeInDuration: Duration(milliseconds: 200),
        placeholder: kTransparentImage,
        image: image.url.toString(),
        width: double.maxFinite,
        fit: BoxFit.fitWidth,
        height: (image.height.toDouble() / image.width.toDouble()) * MediaQuery.of(context).size.width,
      );
    }
    return Container();
  }

我想通了，您想将高度除以宽度，然后将其乘以容器的宽度（在这种情况下，我希望照片的边缘与手机对齐）。