Flutter FittedBox / Expand / Flexible 基于列中的小部件

Question

我正在创建一个颤振聊天应用程序，我希望我的消息根据文本小部件宽度（短/长文本）灵活。

我有一列小部件，我希望消息文本确定同一列中所有其他小部件的最大宽度。

我会用一些截图更好地解释它：

不好的例子：

好例子：

我的代码：

return Padding(
      padding:
          EdgeInsets.only(left: MediaQuery.of(context).size.width * 0.15),
      child: Bubble(
        elevation: 1,
        shadowColor: Colors.black45,
        margin: BubbleEdges.only(top: 5, bottom: 5),
        alignment: Alignment.topRight,
        nip: BubbleNip.rightTop,
        nipRadius: 3,
        nipWidth: 13,
        nipHeight: 10,
        radius: Radius.circular(13),
        color: Color.fromRGBO(225, 255, 199, 1.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.end,
          children: [
            (document.data() as Map<String, dynamic>)
                        .containsKey('reply_message') &&
                    document.get('reply_message') != null
                ? FittedBox(
                    fit: BoxFit.fitWidth, // this is not fitting based on column current width (not max width)
                    child: Container(
                        decoration: BoxDecoration(
                            color: Color.fromRGBO(216, 247, 188, 1.0),
                            borderRadius: BorderRadius.circular(8)),
                        child: Padding(
                          padding: const EdgeInsets.all(6),
                          child: getReplyMessage(
                            document.get('reply_message'),
                          ),
                        )),
                  )
                : SizedBox(),
            Padding(
              padding: const EdgeInsets.only(bottom: 5),
              child: SelectableLinkify(
                onOpen: onOpenLink,
                text: document['content'],
                textAlign:
                    intl.Bidi.detectRtlDirectionality(document['content'])
                        ? TextAlign.right
                        : TextAlign.left,
                textDirection:
                    intl.Bidi.detectRtlDirectionality(document['content'])
                        ? ui.TextDirection.rtl
                        : ui.TextDirection.ltr,
                style: TextStyle(
                  fontSize: 16,
                  height: 1.35,
                  letterSpacing: -0.1,
                  fontFamily: 'Arimo',
                ),
              ),
            ),
            getMessageBottom(document)
          ],
        ),
      ),
    );

更新

Answer 1

您可以使用IntrinsicWidth，这是一个昂贵的小部件。

IntrinsicWidth(
   child: Column(
      children:[...]
   )
)

通过这种方式，所有的孩子都被缩放，以使它们与其中最宽的一样宽。