时间戳

首页 > 解决方案 > 占用 Row 空间的一小部分

flutter - 占用 Row 空间的一小部分

问题描述

如何占用未使用的额外空间？

我正在构建一个基于 Rest 响应的小部件。

有时我可能会得到一个包含 3 个项目的列表。有时可能只有 1 或 2 个。

如果有 3 个项目，我希望它们连续占用所有空间，如下所示。

（实现这一点没有问题）

在此处输入图像描述

但是如果只有 1 或 2 条数据，我只希望它们占用 1/3 或 2/3 的空间，如下所示。

在此处输入图像描述

在此处输入图像描述

我怎样才能做到这一点？

这就是我目前所拥有的，我有一个方法可以验证我拥有多少项目。

Row(
    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
    children: [
        Expanded(child: CustomWidget()), // at least 1 item will exist
        logicToCheckIfMoreThanXItemExists(count: 1) ? Expanded(child: CustomWidget()) : Text('Test1'),
        logicToCheckIfMoreThanXItemExists(count: 2) ? Expanded(child: CustomWidget()) : Text('Test2'),
    ],
)

如果我有 3 个项目，则没有问题。但如果它是 1 或 2，它最终会占用所有空间。因此只是为了测试，添加了文本小部件。

我可以放置假小部件以占用空间或使用扩展的 flex 值并在那里添加假子小部件。

寻找更清洁的替代品。请指教。谢谢你。

标签： flutterdart

解决方案

您可以使用 Spacer 小部件。这基本上是一个没有孩子的扩展

推荐阅读