裁剪为形状的 SwiftUI 图像在上下文菜单中具有透明填充

Question

在我的 SwiftUI 应用程序中，我的资产目录中有一个长宽比为 1:1 的图像。在我的代码中，我有一个Image具有不同纵横比的视图，可以将图像裁剪为新尺寸：

Image("My Image")
    .resizable()
    .aspectRatio(contentMode: .fill)
    .frame(width: 300, height: 250)
    .clipped()

但是当我将上下文菜单附加到该图像（使用contextMenu修饰符）时，原始纵横比仍然存在，但具有透明填充：

如何将图像剪裁到上下文菜单内的新框架，以便没有填充？

Answer 1

我相信适用于所有场景的正确解决方案是在 contentShape 中设置第一个参数（种类）：

func contentShape<S>(_ kind: ContentShapeKinds, _ shape: S)

将其设置为 .contextMenuPreview 这将适用于所有形状：

Image("leaf")
    .resizable()
    .aspectRatio(contentMode: .fill)
    .frame(width: 300, height: 300)
    .clipShape(Circle())
    .contentShape(ContentShapeKinds.contextMenuPreview, Circle())
    .contextMenu {
        Text("Menu Item")
    }

Answer 2

我能够通过向.contentShape(Rectangle())图像添加修饰符来解决这个问题：

Image("My Image")
    .resizable()
    .aspectRatio(contentMode: .fill)
    .frame(width: 300, height: 250)
    .clipped()
    .contentShape(Rectangle())
    .contextMenu {
        Text("Menu Item")
    }