Flutter中Bottom Sheet宽度仅为屏幕一半的问题求助

以下是几种可行的解决方案，针对平板端Bottom Sheet默认带侧边距的情况：

• 通过showModalBottomSheet参数强制铺满
  平板端Material Design规范默认给Bottom Sheet添加侧边内边距，你可以通过设置shape清除侧边圆角，并结合constraints强制宽度匹配屏幕：

  showModalBottomSheet(
    context: context,
    isScrollControlled: true,
    shape: const RoundedRectangleBorder(
      borderRadius: BorderRadius.vertical(top: Radius.circular(16)),
    ),
    constraints: BoxConstraints(maxWidth: MediaQuery.of(context).size.width),
    builder: (_) {
      return Container(
        height: 300,
        color: Colors.white,
        child: const Center(child: Text("铺满宽度的Bottom Sheet")),
      );
    },
  );
  

• 移除默认背景和阴影，自定义容器宽度
  若上述方法无效，可通过透明背景绕过默认容器约束，直接在builder里定义全屏宽度的容器：

  showModalBottomSheet(
    context: context,
    backgroundColor: Colors.transparent,
    elevation: 0,
    builder: (_) {
      return Container(
        width: MediaQuery.of(context).size.width,
        decoration: const BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.vertical(top: Radius.circular(16)),
        ),
        height: 300,
        child: const Center(child: Text("自定义宽度的Bottom Sheet")),
      );
    },
  );
  

• 排查内部Widget的宽度限制
  检查Bottom Sheet内部的组件是否被Padding、SizedBox、ConstrainedBox等限制了宽度，移除不必要的约束，让容器自动填充可用宽度。

等你附上代码后，可以更精准地定位问题（比如是否使用了Scaffold的bottomSheet属性而非弹窗式Bottom Sheet）。

内容的提问来源于stack exchange，提问作者Hüseyin Sezen