Flutter 嵌套行 MainAxisAlignment

Question

我想做这个 ：

但这是我实际得到的：

这是我的代码：

Row itemTransaction(BuildContext context, Transaction transaction) {
  /// This is the function that will build each item of our transaction list.
  return new Row(
    children: <Widget>[
      new Container(
        width: MediaQuery.of(context).size.width / 6,
        height: MediaQuery.of(context).size.width / 6,
        child: new Image.asset(
          (transaction.sent) ? "images/tx_output.png" : "images/tx_input.png",
        ),
      ),
      new Column(
        children: <Widget>[
          new Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              discoderyText("test"),
              discoderyText("test 2"),
            ],
          ),
          discoderyText("SOME HASH KEY"),
        ],
      ),
    ],
  );
}

这discoderyText基本上是一个自定义文本（即带有颜色）。

正如您所看到的，mainAxisAlignment: MainAxisAlignment.spaceBetween我的 Row 已设置，因此test和test2 应该位于相对的两侧。

当我删除图像并且只返回Row包含两个的图像时Text，我设置了mainAxisAlignment它的工作原理。嵌套行似乎不能使用此变量。

这基本上是我的看法的计划：

Answer 1

截屏

Row(
  children: <Widget>[
    Container(
      width: MediaQuery.of(context).size.width / 6,
      height: MediaQuery.of(context).size.width / 6,
      child: CircleAvatar(backgroundImage: AssetImage(chocolateImage),),
    ),
    Expanded( // add this
      child: Padding(
        padding: const EdgeInsets.all(8.0), // give some padding
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          mainAxisSize: MainAxisSize.min, // set it to min
          children: <Widget>[
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Text("test"),
                Text("test 2"),
              ],
            ),
            Text("SOME HASH KEY HERE"),
          ],
        ),
      ),
    ),
  ],
)