flutter - 在 Flutter 中让 Row 子节点尽可能宽（父节点的剩余宽度）？

Question

我有一个小部件，我想在从 REST API 下载一些数据时显示它。FutureBuilder当Future尚未完成时，它将由 a 使用。

它应该显示一个灰色方块和一条灰色线。

类似于 Facebook 所做的事情：

我用 aRow和两个Containers 实现了它。但是，我希望这条线向右水平扩展，并在Row. 那就是碰壁的地方。我怎样才能做到这一点？

这是我的代码：

class Waiting extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.end,
          children: [
            Container(
              color: Colors.grey[200],
              height: 40,
              width: 40,
            ),
            SizedBox(width: 20),
            Padding(
              padding: const EdgeInsets.fromLTRB(0, 0, 0, 8),
              child: Container(
                color: Colors.grey[200],
                width: 140, // I want this to be as wide as possible
                height: 10,
              ),
            )
          ],
        ),
      ),
    );
  }
}

Answer 1

只需用扩展的小部件包装该部分：-

class Waiting extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.end,
          children: [
            Container(
              color: Colors.grey[200],
              height: 40,
              width: 40,
            ),
            SizedBox(width: 20),
            Expanded(                           //added expanded over here
            child: Padding(
              padding: const EdgeInsets.fromLTRB(0, 0, 0, 8),
              child: Container(
                color: Colors.grey[200],                    
                height: 10,
              ),
            ),
            ),
          ],
        ),
      ),
    );
  }
}