如何创建一排容器，它们之间没有任何间距？

Question

我正在尝试在颤动中创建一个容器行，并且我确实使用 Row 和多个容器作为子容器来做到这一点。现在，问题是每列之间有一个空白。我该如何删除这些。我尝试使用十字轴和主轴对齐，但没有帮助。我该如何解决这个问题，以便它们之间根本没有空间。

Here's a screenshot of the Row of Containers

---

Row(
                // mainAxisAlignment: MainAxisAlignment.spaceBetween,
                // crossAxisAlignment: CrossAxisAlignment.end,
                children: [
                  for (var i in list)
                    Container(
                      width: (MediaQuery.of(context).size.width - 30) /list.length,//Subtarcting 30 to adjust the padding of parent  
                      color: Colors.red,
                    ),

Answer 1

尝试将容器包装在 Expanded 小部件中：

Row(
   children: [
           for (var i in list)
              Expanded(
                 child: Container(
                      color: Colors.red,
                         )
                   )
           ]
     )
   

Answer 2

这实际上是 Android 上的一个错误，iOS 在没有 border 的情况下也能正常工作。考虑添加border 和width:0 和color:red 作为容器，如下所示：

      Row(
          // mainAxisAlignment: MainAxisAlignment.spaceBetween,
          // crossAxisAlignment: CrossAxisAlignment.end,
          children: [
          for (int i = 0; i < 30; i++)
          Container(
            decoration: BoxDecoration(
              border: Border.all(color: Colors.red, width: 0),
              color: Colors.red,
            ),
            width: (MediaQuery.of(context).size.width - 30) /
                30, //Subtarcting 30 to adjust the padding of parent
          ),
      ])

Answer 3

尝试将Row 小部件封装在container 小部件中并设置其颜色Colors.red

 Container(
  color: Colors.red,
  child:Row(children:<Widget>[
  
  for (var i in list)
  Container(width: (MediaQuery.of(context).size.width - 30) /5,//Subtarcting 30 to adjust the padding of parent  
                  color: Colors.red,),

]));