padding - 有没有办法使用填充来处理 "join"Flutter Widgets？

Question

我有一行 Flutter 小部件，我想用 Padding 将它们分开，但只在小部件之间。有点像列表的 join() 函数的行为，其中您要加入的字符串仅附加在项目之间，而不是列表的末尾。例如。对于这样的事情:

var square = new Container(height: 50.0, width: 50.0; color: Colors.pink,);
return new Row(
  children: <Widget>[
    square,
    square,
    square,
  ],
);

我将得到一排 3 个粉色方 block ，中间没有空格。我想要一种更具程序化/Flutter 内置的方式来执行此操作:

const _rightPadding = const Padding(padding: const EdgeInsets.only(right: 16.0));
var square = new Container(height: 50.0, width: 50.0; color: Colors.pink,);
return new Row(
  children: <Widget>[
    square,
    rightPadding,
    square,
    rightPadding,
    square,
    // note there is no padding after this third square
  ],
);

我可以向我的 square 小部件内的 padding 属性添加一个右填充，但是我会在 Row 的末尾添加额外的填充。我可以添加一个 if 语句来检查我是否是列表中的最后一个 Widget 并且不为那个 Widget 添加填充，尽管它是额外的代码，我希望有更高效的东西。 :)

我注意到 Wrap Widget具有 runSpacing 和 spacing 属性 - 这正是我正在寻找的，但对于行和列。

Answer 1

我在文档中搜索了 Row，但找不到您要查找的内容(尽管它可能在那里，但我只是看不到它)。以编程方式执行此操作的一种方法是只使用一个函数，该函数接受一个元素列表并返回该列表，并在中间填充但不在最后一个元素上填充。也许是这样的:

List<Widget> createRowChildrenWithPadding(List<Widget> widgets, Padding pading) {
    var joined = List<Widget>();

    for (var i = 0;  i < widgets.length; i++) {
        if ( i != widgets.length - 1)  {
            joined.add(widgets[i]);
            joined.add(padding);
        } else {
            joined.add(widgets[i]);
        }
    }
    return joined;
}

然后您可以调用此函数并传入行的列表，并将返回值分配给行的 children 命名参数。如果您有任何问题，请告诉我，希望对您有所帮助!