繁体   English   中英

Flutter 如何使具有灵活约束的容器的子项居中

[英]Flutter how to center the child of a Container which has flexible constraints

我正在尝试构建一个类似于信使应用程序中使用的消息框(例如:Whatsapp)。

无需尝试集中文本:

图片

容器必须根据其包含的消息(字符串)的长度在高度和宽度灵活

这是我的代码

Container(
         constraints: BoxConstraints(minHeight: 40,maxHeight: 200,maxWidth: 300,minWidth: 40),
         decoration: BoxDecoration(
           borderRadius:  BorderRadius.circular(40),
         ),
         child: Padding(
           padding: const EdgeInsets.fromLTRB(15,0,15,0),
           child: new Text(msg,maxLines: null,),
         ),
    )

但是,每当我尝试将文本(包括填充)小部件居中时,Container 都会被强制使用它的最大约束。 这些是我尝试过的一些方法

  • 使用 e中心小部件
  • 使用容器的对齐属性
  • Column包裹孩子并使用 mainAxisAlignment.center

所有这些方法的结果都是一样的:

图片

有什么方法可以使 Text 小部件居中并且不操作框约束吗?

尝试这个:

Container(
  constraints: BoxConstraints(minHeight: 40, maxHeight: 200, maxWidth: 360, minWidth: 40),
  decoration: BoxDecoration(color: Colors.grey, borderRadius: BorderRadius.circular(40)),
  padding: const EdgeInsets.fromLTRB(15, 0, 15, 0),
  child: Column(
    mainAxisSize: MainAxisSize.min,
    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
      Text("Very long message"),
    ],
  ),
);

在此处输入图片说明

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM