SwiftUI 为clipShape自定义气泡添加contextMenu出现多余内边距与裁剪问题

问题原因 #

SwiftUI 系统默认的 contextMenu 会强制给目标视图添加统一内边距和圆角裁剪，会忽略自定义的clipShape不规则形态，你设置的contentShape仅控制点击响应区域，不影响预览渲染逻辑，所以无效。

适配方案（分场景实现苹果信息App效果） #

方案1：自定义contextMenu预览（iOS 16+ 推荐） #

系统从iOS 16开始支持contextMenu自定义预览视图，直接在预览块里实现你需要的效果即可：

文本消息场景（保留气泡形状无内边距）

Text("消息内容")
    .padding(12)
    .background(.blue)
    .foregroundColor(.white)
    .clipShape(Bubble(location: .rightBottom))
    .contextMenu {
        // 你的菜单按钮逻辑
        Button("复制") {
            // 复制操作
        }
    } preview: {
        // 预览块直接返回和原视图完全一致的裁剪后气泡，设透明背景去掉默认内边距
        Text("消息内容")
            .padding(12)
            .background(.blue)
            .foregroundColor(.white)
            .clipShape(Bubble(location: .rightBottom))
            .background(.clear)
    }

图片消息场景（移除裁剪按原比例展示）

Image("leaf")
    .resizable()
    .aspectRatio(contentMode: .fill)
    .frame(width: 264, height: 361)
    .clipShape(Bubble(location: .rightBottom))
    .contextMenu {
        Button {
            // 保存逻辑
        } label: {
            HStack {
                Text("Save")
                Image(systemName: "arrow.down.to.line")
            }
        }
    } preview: {
        // 预览块不加clipShape，按原比例展示图片即可
        Image("leaf")
            .resizable()
            .aspectRatio(contentMode: .fit)
            .background(.clear)
    }

方案2：UIKit桥接兼容低版本 #

如果需要兼容iOS 15及更低版本，可以用UIViewRepresentable包裹你的视图，实现UIContextMenuConfiguration代理，自定义预览的UIPreviewParameters，将backgroundColor设为透明，同时设置previewPath为你的气泡贝塞尔路径即可实现相同效果。

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