根据颤动中的动态内容调整GridView子高度 [英] Adjust GridView child height according to the dynamic content in flutter

问题描述

如何在波动中实现这个复杂的视图？

我正在尝试实现 GridView 具有n列，并且子级应该具有一定的宽高比（例如1.3），但是子级的高度应该是（Android术语中的包装内容）。

I am trying to implement a GridView with n columns and the child should be of a certain aspect ratio(say 1.3) but the height of the child should be (wrap content in Android terminology).

我被困住是因为fas我了解GridView的 childAspectRatio：1.3 （默认值：1）始终以相同的纵横比而不是动态内容来布局子项。

I am stuck because as fas I understand GridView's childAspectRatio:1.3 (default:1) always lays out the child in same aspect ratio but not dynamic content.

注意：孩子应该根据图片的高度扩展其高度

Note: Child should expand its height according to the image's height

用例：我正在尝试实现以下视图，在其中包裹图像的 height =包装内容，以便在高度拉伸的图像看起来不错并形成 StaggeredGridView 类似于结构。

Use case: I am trying to implement a view like below, in which image is wrapped height = wrap content so that in case an image with stretched height can look good and form a StaggeredGridView like structure.

推荐答案

编辑：我在0.2.0中添加了构造函数 StaggeredTile.fit 。有了它，您应该能够构建您的应用程序;-）。

I added the constructor StaggeredTile.fit in the 0.2.0. With that you should be able to build you app ;-).

第一条评论：
现在使用 StaggeredGridView ，布局和子代渲染完全独立。因此，正如@rmtmckenzie所说，您将必须获取图像大小才能创建图块。
然后，您可以使用 StaggeredTile.count 构造函数，对 mainAxisCellCount 参数使用双精度值： new StaggeredTile.count（x，x * h / w）（其中 h 是图像的高度， w 其宽度，以便与您的图片具有相同的纵横比。

First comment: For now with StaggeredGridView, the layout and the children rendering are completely independant. So as @rmtmckenzie said, you will have to get the image size to create your tiles. Then you can use StaggeredTile.count constructor with a double value for the mainAxisCellCount parameter: new StaggeredTile.count(x, x*h/w) (where h is the height of your image and w its width. So that the tile with have the same aspect ratio as your image.

您想要完成的工作将需要更多之所以能够工作，是因为您想要在图像下方保留一些信息，为此，我认为您必须先计算图块的实际宽度，然后再使用 StaggeredTile.extent 构造函数。

What you want to accomplish will need more work because you want to have an area below the image with some information. For that I think you will have to compute the real width of your tile before creating it and use the StaggeredTile.extent constructor.

我知道这并不理想，我目前正在研究一种新的布局创建方式，希望它能帮助您构建像您这样的场景

I understand this is not ideal and I'm currently working on a new way to create the layout. I hope it will help to build scenarios like yours.

这篇关于根据颤动中的动态内容调整GridView子高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！