将pencilkit canvas设置为输入图像的大小，并防止在该区域之外绘制

Question

如何防止在缩放宽高比图像背景外绘制?

我需要在图像上绘制，类似于标记，并且根据我所看到的，您必须将图像添加到PKCanvasView的背景中。

在下面的SO中，我或多或少做了同样的事情。但是，我的设备和图像大小不相同。

铅笔套件代码类似于这个

struct MyCanvas: UIViewRepresentable {
var canvasView: PKCanvasView
let picker = PKToolPicker.init()

func makeUIView(context: Context) -> PKCanvasView {
self.canvasView.tool = PKInkingTool(.pen, color: .black, width: 15)
self.canvasView.isOpaque = false
self.canvasView.backgroundColor = UIColor.clear
self.canvasView.becomeFirstResponder()
let imageView = Image("badmintoncourt")
imageView.contentMode = .scaleAspectFit
imageView.clipsToBounds = true
let subView = self.canvasView.subviews[0]
subView.addSubview(imageView)
subView.sendSubviewToBack(imageView)
return canvasView
}

func updateUIView(_ uiView: PKCanvasView, context: Context) {
picker.addObserver(canvasView)
picker.setVisible(true, forFirstResponder: uiView)
}
}

我的屏幕尺寸为:(1194.0,790.0)，而图像尺寸为(1668.0,2348.0)。尽管图像视图具有宽高比匹配，但它不会自动缩放。

为了解决这个问题，我使用了几何阅读器并传入屏幕宽度/高度，然后设置ImageView的框架，现在相应地缩放图像。

问题是我可以在图像边界外绘制，用垂直图像，水平观看，图像的左侧和右侧有足够的空白。我不想在那里画画。

是否有将可绘制的画布设置为与缩放图像相同的方式?

另一个问题是，当我改变设备方向时，图形不会像使用苹果的"标记"那样粘在图像上。所做的事。我读了一点，似乎锚可能有用?不知道怎么用

Answer 1

对我来说有效的是将PKCanvasView放入另一个UIView中，然后将PKCanvasView帧设置为缩放后的图像尺寸，本质上是剪切视图。

Answer 2

我知道这个问题很老了，但无论如何我是这样做的

Image("My Image")
.resizable()
.scaledToFit()
.clipped()
.overlay {
CanvasView(canvasView: $canvasView, onSaved: saveDrawing)
}
.padding(20.0)