为什么SizedBox不限制Text小部件的宽度？

由 Dulle发布于 2020-05-09 08:05:29

因此，我正在制作一个简单的消息传递应用程序，并遇到了以下问题：

我将SizedBox的宽度设置为100，但是当子级是Text小部件时，它将覆盖SizedBox的宽度。

从另一个文件中的ListView.builder调用此窗口小部件。

我是否应该为此使用其他小部件而不是sizebox？

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: SizedBox(
        width: 100,
        child: Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.all(Radius.circular(14.0)),
            color: currentUserIsSender ? Styles.accentColor30 : Colors.grey.shade200,
          ),
          padding: EdgeInsets.all(8.0),
          child: Text(
            message,
            softWrap: true,
          ),
        ),
      ),
    );
  }

谢谢

Picture of app problem

Beck

2020-05-09 08:05:29

The problem is, SizedBox can set widget size only within the constrains set by the parent. Many widgets, like Padding, want their child to occupy 100% of the space available to them. This makes sense, because if the child is smaller they wouldn't know where to put it.

If you want the child to be smaller than the parent you could use Center or Align, e.g. replace

Padding(
  child: SizedBox(
    width: 100,
    child: ...
    ),
  ),
);

与

Padding(
  child: Center(
    child: SizedBox(
      width: 100,
      child: ...
      ),
    ),
  ),
);

(for a chat app you might want to use Align rather than Center)

Dulle

这家伙很懒，什么都没留下

积分
0
话题
0
评论
3229
注册排名
2751