颤振嵌套行MainAxisAlignment [英] Flutter nested Rows MainAxisAlignment

查看:99
本文介绍了颤振嵌套行MainAxisAlignment的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想这样做:

但这是我真正得到的:

这是我的代码:

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基本上是自定义文本(即带有颜色).

The discoderyText is basically a custom text (i.e. with colors).

如您所见,为我的行设置了mainAxisAlignment: MainAxisAlignment.spaceBetween,因此testtest2 应该位于相反的一侧.

As you can see, there is mainAxisAlignment: MainAxisAlignment.spaceBetween set for my Row, so test and test2 should be on opposite sides.

当我删除图像时,我只返回包含两个TextRow,并且设置了mainAxisAlignment,它可以工作.似乎嵌套行不能使用此变量.

When I remove the image and I only returns a Row that contains two Text, and I set the mainAxisAlignment, it works. It seems like nested rows can NOT use this variable.

这基本上是我的观点:

推荐答案

屏幕截图

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"),
          ],
        ),
      ),
    ),
  ],
)

这篇关于颤振嵌套行MainAxisAlignment的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆