Flutter窗口调整时如何保持Texture组件固定250x250尺寸？

我需要让Texture组件始终保持250x250的固定尺寸，不受窗口调整影响。当前垂直调整窗口时，组件超出屏幕底部的部分会被正常裁剪，但水平缩小窗口至比组件窄时，组件会被水平压缩而非右侧裁剪。

我尝试过用水平ListView包裹内层Container（外层ListView垂直方向裁剪正常），但出现RenderBox was not laid out: RenderRepaintBoundary#51231 relayoutBoundary=up5 NEEDS-PAINT...错误；也尝试将该内层ListView放入Container/SizedBox，仍无法解决压缩问题实现裁剪。

当前组件的build方法代码如下：

@override
Widget build(BuildContext context) {
  return MaterialApp(
      home: Scaffold(
    appBar: AppBar(
      title: const Text('Title bar'),
    ),
    body: Center(
      child: SizedBox(
        width: 250,
        child: ListView(
          children: [
            const Text('Text goes here'),
            Container(
                width: 250,
                height: 250,
                color: Colors.green,
                child: Texture(textureId: textureId)), // ID of a texture that displays pixels
          ],
        ),
      ),
    ),
    floatingActionButton: FloatingActionButton(
      child: const Text('Button'),
      onPressed: () {
        noisy();
      },
    ),
  ));
}

问题核心是：窗口宽度小于250时，外层SizedBox(width:250)会被父级约束限制，无法保持固定宽度，导致内部Texture被压缩。要实现固定尺寸并裁剪超出部分，可通过OverflowBox强制子项保持固定尺寸，配合ClipRect裁剪超出屏幕的区域，具体修改如下：

@override
Widget build(BuildContext context) {
  return MaterialApp(
    home: Scaffold(
      appBar: AppBar(
        title: const Text('Title bar'),
      ),
      body: ClipRect(
        // 裁剪超出屏幕的内容
        child: Center(
          child: OverflowBox(
            // 强制子项宽度固定为250，不受父级约束限制
            minWidth: 250,
            maxWidth: 250,
            child: ListView(
              shrinkWrap: true,
              children: [
                const Text('Text goes here'),
                SizedBox(
                  width: 250,
                  height: 250,
                  child: ColoredBox(
                    color: Colors.green,
                    child: Texture(textureId: textureId),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        child: const Text('Button'),
        onPressed: noisy,
      ),
    ),
  );
}

关键修改说明： #

• OverflowBox：设置minWidth和maxWidth为250，强制内部ListView保持固定宽度，不受窗口宽度约束。
• ClipRect：包裹外层区域，裁剪掉超出屏幕范围的内容，实现和垂直方向一致的裁剪效果。
• shrinkWrap: true：让ListView根据子项高度自适应，避免生成不必要的滚动区域。

若不需要居中效果，可直接移除Center组件，让OverflowBox作为ClipRect的直接子项，同样能实现固定尺寸+裁剪的需求。

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