Question

我想将Text（）放在Container（）的中心。但是当我使用“中心对齐”之类的方法时，容器将变得尽可能大。

return Container(
  constraints:BoxConstraints(
    minHeight: 100,
    minWidth: 100,
  ),
  margin: EdgeInsets.all(10),
  padding: EdgeInsets.all(10),
  color: Color(0x4d000000),
//alignment: Alignment.center,
  child: Text(
    "some message",
    style: Theme.of(context).textTheme.title,
  ),
);

容器的大小由“文本和约束”框决定。如果“文本”的大小小于最小约束，则“文本”将不在容器的中心。但设置的对齐方式将导致容器填充整个屏幕。

Answer 1

使用textAlign小部件的Text属性：

child: Text(
"some message",
style: Theme.of(context).textTheme.title,
,textAlign: TextAlign.center// this is what you should add
),

Answer 2

您可以在maxWidth中给maxHeight和BoxConstraints来控制容器的大小。

否则，您只需使用FittedBox小部件即可-缩放并在其内部放置其子项。

用FittedBox包裹容器

FittedBox(
              child: Container(
                constraints: BoxConstraints(
                  minHeight: 100,
                  minWidth: 100,
                ),
                margin: EdgeInsets.all(10),
                padding: EdgeInsets.all(10),
                color: Color(0x4d000000),
                alignment: Alignment.center,
                child: Text(
                  "some message",
                  style: Theme.of(context).textTheme.title,
                ),
              ),
            ),

如何将容器中的文本对齐，使容器尽可能小？

2 个答案: