flutter - 如何将文本小部件放置在具有最大宽度的容器的水平端，而不展开它

Question

我有一个卡片小部件，它包装了一个给定最大宽度的容器小部件，这就是它的样子:

这是下面的代码:

Card(
          child: Container(
        constraints: new BoxConstraints(
          maxWidth: 250.0,
        ),
        margin: EdgeInsets.symmetric(horizontal: 10.0, vertical: 10.0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.start,
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[

            new Flexible(
              child: new Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[

                  new Container(
                    margin: const EdgeInsets.only(top: 5.0),
                    child:  new Text(messageSnapshot.inbox),
                  ),




                ],
              ),
            ),
          ],
        ),
      ))

当我尝试在其下创建另一个文本小部件时出现问题，我特别想移动到第一个文本下方的最右边，这就是我得到的:

我添加的第二个文本小部件会扩展，达到我想要的最末端，但也会将卡片扩展到我设置的最大宽度。这是它的代码:

Card(
     child: Container(
    constraints: new BoxConstraints(
      maxWidth: 250.0,
    ),
    margin: EdgeInsets.symmetric(horizontal: 10.0, vertical: 10.0),
    child: Row(
      mainAxisAlignment: MainAxisAlignment.start,
      mainAxisSize: MainAxisSize.min,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[

        new Flexible(
          child: new Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[

              new Container(
                margin: const EdgeInsets.only(top: 5.0),
                child:  new Text(messageSnapshot.inbox),
              ),


              Row(
                mainAxisAlignment: MainAxisAlignment.end,
                children: <Widget>[
                  Text("3:18am")
                ],
              )

            ],
          ),
        ),
      ],
    ),
  ))

但这就是我想要的

日期位于容器空间末尾的水平位置，初始文本创建时未展开。

我该如何解决这个问题？

Answer 1

将 Flexible 小部件内的元素包装在 IntrinsicWidth 小部件内。这将使 Column 中的所有子元素具有相同的宽度。然后，在第二个元素的 Row 中添加一个 MainAxisSize.max 属性，这样它将模仿第一个元素的宽度并服从 MainAxisAlign.end 以您想要的方式拥有属性(property)。

new Flexible(
            child: new IntrinsicWidth(
              child: new Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  new Container(
                    margin: const EdgeInsets.only(top: 5.0),
                    child: new Text(
                      messageSnapshot.inbox,
                    ),
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    mainAxisSize: MainAxisSize.max,
                    children: <Widget>[
                      Text(
                        "3:18am",
                      ),
                    ],
                  )
                ],
              ),
            ),
          ),