Question

如图所示：

两个Text（神奇宝贝，上午11.25）之间有一条实线。 我想要的是行的长度等于最长的文本长度。但是行的行为类似于match_parent。

在Android Native中，我们可以使用垂直的LinearLayout，并在水平方向设置android：layout_width =“ wrap_content”的限制。

在Flutter中，我们只能将Column mainAxisSize：MainAxisSize.min限制设置为垂直。

我想这个问题是由于分频器引起的。当分隔线消失时，列的宽度为wrap_content。

实验如下：

      Container(
        color: Colors.red,
        margin: EdgeInsets.symmetric(horizontal: 8.0),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Container(
              margin: EdgeInsets.symmetric(vertical: 8.0),
              padding: EdgeInsets.all(4.0),
              child: Text(
                'Pokémon',
                style: TextStyle(
                    color: Colors.white,
                    fontSize: 18.0,
                    fontWeight: FontWeight.bold),
                maxLines: 1,
                overflow: TextOverflow.ellipsis,
              ),
            ),
            Divider(
              height: 2.0,
              color: Colors.white,
            ),
            Container(
              margin: EdgeInsets.only(top: 8.0),
              child: Text(
                '11.25 AM',
                style: TextStyle(
                    color: Colors.white,
                    fontSize: 12.0,
                    fontWeight: FontWeight.bold),
                maxLines: 1,
                overflow: TextOverflow.ellipsis,
              ),
            ),
          ],
        ),
      ),

Answer 1

您可以使用-IntrinsicWidth小部件。用它包裹列。

Container(
          color: Colors.red,
          margin: EdgeInsets.symmetric(horizontal: 8.0),
          child: IntrinsicWidth(
            child: Column(
              mainAxisSize: MainAxisSize.min,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                Container(
                  margin: EdgeInsets.symmetric(vertical: 8.0),
                  padding: EdgeInsets.all(4.0),
                  child: Text(
                    'Pokémon',
                    style: TextStyle(
                        color: Colors.white,
                        fontSize: 18.0,
                        fontWeight: FontWeight.bold),
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                  ),
                ),
                Divider(
                  height: 2.0,
                  color: Colors.white,
                ),
                Container(
                  margin: EdgeInsets.only(top: 8.0),
                  child: Text(
                    '11.25 AM',
                    style: TextStyle(
                        color: Colors.white,
                        fontSize: 12.0,
                        fontWeight: FontWeight.bold),
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                  ),
                ),
              ],
            ),
          ),
        ),

将Column的子项（例如Container Layout）设置为水平

1 个答案: