嵌套在Column与Row中的AutosizeText无法自适应及布局报错问题

问题根源 #

AutosizeText需要明确的宽度约束才能计算并调整字体大小，避免内容溢出。当嵌套在无约束的Row/Column中时：

• 直接使用AutosizeText，父组件不会限制其宽度，文本过长时会直接溢出；
• 盲目包裹Expanded，若外层Row/Column本身没有宽度约束（比如示例中最外层Row未放在有约束的父组件内），会导致布局系统无法确定组件尺寸，触发RenderBox was not laid out报错。

解决方案 #

方法1：给外层组件添加宽度约束+Expanded包裹AutosizeText #

确保最外层的Row处于有明确宽度约束的父组件中（如Scaffold的body、ConstrainedBox等），同时用Expanded让AutosizeText获取父Row的可用宽度。

修改后的示例代码：

class Example extends StatelessWidget {
  const Example({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Row(
        children: [
          Column(
            children: [
              Row(
                children: const [
                  Expanded(
                    child: AutoSizeText(
                      '这是一段超长测试文本，验证自适应字体是否正常工作',
                      maxLines: 1,
                      minFontSize: 16,
                      overflowReplacement: Text('subject'),
                    ),
                  ),
                ],
              ),
            ],
          ),
        ],
      ),
    );
  }
}

方法2：直接给AutosizeText设置固定宽度（适合固定布局场景） #

如果不需要动态适配宽度，也可以用SizedBox给AutosizeText指定固定宽度：

SizedBox(
  width: 200,
  child: AutoSizeText(
    '超长测试文本',
    maxLines: 1,
    minFontSize: 16,
    overflowReplacement: Text('subject'),
  ),
)

关键说明 #

• Scaffold的body会自动继承屏幕的宽度约束，让内层Row有明确的尺寸边界；
• Expanded的作用是让AutosizeText占据Row的剩余可用宽度，为文本自适应提供计算依据；
• 若仅使用短文本（如示例中的'subject'），问题可能不明显，但长文本场景下必须保证AutosizeText有明确的宽度约束。

内容的提问来源于stack exchange，提问作者Pascal Gehring