SwiftUI将View保存为图片到相册时生成图片位置偏移如何解决

问题原因 #

• 原快照扩展未忽略UIHostingController的默认安全区，给Canvas视图额外增加了安全区内边距，导致绘制位置偏移
• 仅设置了视图的bounds没有同步设置frame，也没有主动触发布局计算，自定义绘制的Canvas元素位置没有对齐到原点

修复方案 #

替换原有View扩展为以下代码即可：

extension View {
    func snapshot() -> UIImage {
        // 根视图主动忽略安全区，避免额外内边距
        let controller = UIHostingController(rootView: self.ignoresSafeArea())
        guard let view = controller.view else { return UIImage() }

        let targetSize = view.intrinsicContentSize
        // 同步设置frame和bounds，保证布局原点正确
        view.frame = CGRect(origin: .zero, size: targetSize)
        view.bounds = CGRect(origin: .zero, size: targetSize)
        view.backgroundColor = .clear
        
        // 强制触发布局，确保所有元素位置计算完成
        view.layoutIfNeeded()

        let renderer = UIGraphicsImageRenderer(size: targetSize)
        return renderer.image { _ in
            view.drawHierarchy(in: view.bounds, afterScreenUpdates: true)
        }
    }
}

如果你的Canvas在界面上有固定尺寸，调用时可以显式指定尺寸，保证生成的图片和界面显示完全一致：

// 宽高替换为你Canvas实际的展示尺寸
let image = canvas.frame(width: 200, height: 300).snapshot()
UIImageWriteToSavedPhotosAlbum(image, nil, nil, nil)

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