Flutter聊天气泡开发:如何避免Column内Expanded撑大父容器宽度
解决方案
给Column外层包裹IntrinsicWidth组件即可实现需求:IntrinsicWidth会将其子组件的宽度限制为子组件的最大固有宽度,整体聊天气泡宽度最终由消息文本的实际宽度决定,不会被头部的Expanded装饰线撑到最大宽度上限,同时装饰线可以正常填充满姓名右侧的头部剩余空间。
修改后的代码如下:
return Container( color: Colors.grey.shade200, constraints: BoxConstraints(maxWidth: (MediaQuery.of(context).size.width * 0.7)), child: IntrinsicWidth( child: Column( mainAxisSize: MainAxisSize.min, children: [ Row( mainAxisSize: MainAxisSize.min, children: [ Text("Juan"), Expanded( child: Container( color: Colors.red, height: 3, ), ) ], ), Text("Text of the message"), ], ), ));
内容的提问来源于stack exchange,提问作者JMGpp
相关产品推荐
相关产品推荐

