颤振和底部溢出答案

【问题标题】：Flutter and Bottom Overflowed颤振和底部溢出
【发布时间】：2019-03-22 20:11:26
【问题描述】：

这是我的问题：

如何为每个项目创建一张卡片，而不必担心每个项目上的字段数量而不会溢出？

据我了解，这种情况下的卡片是一个方形盒子。

【问题讨论】：

你想要一个不同大小的网格视图给孩子吗？看看这个包：pub.dartlang.org/packages/flutter_staggered_grid_view
没有。我希望能够在每张卡上添加更多信息，并且没有底部溢出的消息
好的，所以您只需从 GridView 小部件中更改 childAspectRatio 属性
您确定固定的卡片布局适合您吗？用户可能会增加他们的字体大小以使文本更具可读性，然后您可能会再次破坏您的 UI。 @diegoveloper 的交错网格建议是一个好方法，或者您可能将文本显示在图像顶部（固定在角落..）
主要问题是我正在使用 Flutter Pagewise Package (pub.dartlang.org/packages/flutter_pagewise)，因为当时我需要从外部服务器 10 获取 JSON 格式的数据。我将研究交错网格，看看它是否适合我的应用程序。

【解决方案1】：

UI 上的溢出错误通常发生在小部件内的子级超出其父级尺寸时，除非父级小部件内的子级被 Scrollable 包裹。您可以在此处应用的一种解决方法是使用 IntrinsicHeight 作为父小部件从其子小部件动态调整其尺寸基础，并使用 ConstrainedBox 作为 IntrinsicHeight 小部件的子小部件来设置项目的最小尺寸。

IntrinsicHeight(
  child: ConstrainedBox(
    constraints: const BoxConstraints(
      /// Set minimum height for the item
      minHeight: 100,
    ),
    /// child widget with dynamic height goes here
    child: Container(),
  ),
),

或者，如果您正在寻找交错网格，则有一个适用于此用例的插件：flutter_staggered_grid_view

【讨论】：