如何设置Flutter白色Container的右上角与左上角为圆角？

要实现你图中白色容器顶部两角圆角的效果，核心是利用BoxDecoration的BorderRadius.only属性指定对应角的圆角半径，同时注意给容器设置高度或内部内容，否则容器会因没有尺寸而无法显示圆角效果。

你的代码已经正确使用了BorderRadius.only配置圆角，但白色Container缺少高度或子组件，所以看不到效果。以下是完善后的完整代码：

return SingleChildScrollView(
  child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
    // 顶部橙色容器
    Container(
      height: MediaQuery.of(context).size.height / 2,
      color: Colors.orange,
    ),
    // 底部白色圆角容器
    Container(
      // 给容器设置高度，或者添加子组件让容器自适应尺寸
      height: MediaQuery.of(context).size.height / 2,
      decoration: const BoxDecoration(
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(40.0),
          topRight: Radius.circular(40.0),
        ),
        color: Colors.white,
      ),
      // 可以添加子内容，比如文本、其他组件
      child: const Padding(
        padding: EdgeInsets.all(16.0),
        child: Text('这是白色圆角容器的内容'),
      ),
    )
  ]),
);

关键说明： #

• BorderRadius.only(topLeft: ..., topRight: ...)：精准指定仅左上角和右上角为圆角，其他角保持直角。
• 必须给白色容器设置尺寸：可以通过height/width固定尺寸，也可以通过子组件让容器自适应大小，否则容器会收缩为0，无法展示圆角效果。
• 如果需要阴影等其他装饰效果，也可以在BoxDecoration中添加boxShadow等属性增强视觉层次。

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