Swift/SwiftUI中如何将Canvas绘图保存至Assets文件夹或相册

App内置的Assets.xcassets属于打包阶段生成的只读资源目录，应用安装后运行时没有该目录的写入权限，无法动态存入用户生成的绘图内容。如果是开发调试阶段需要把生成的图当内置资源用，导出图片后手动拖入Xcode的Assets目录即可；正式运行时生成的绘图只能存储到App沙盒或者系统相册。

不要用全局截图的方式，直接复用你维护的路径、描边等绘制数据，在图形上下文中重新渲染，导出的图片清晰度高、不会混入其他UI元素，也不会出现截不全的问题。

• 先统一管理绘制元素数据模型，示例：

import SwiftUI

// 单条绘制路径的存储模型
struct DrawElement {
    let path: Path
    let strokeColor: Color
    let lineWidth: CGFloat
    let isFilled: Bool // 可选，有填充绘制需求时添加
}

• 实现导出UIImage的方法（iOS端）：

func exportDrawing(elements: [DrawElement], canvasSize: CGSize) -> UIImage {
    let renderFormat = UIGraphicsImageRendererFormat()
    renderFormat.scale = UIScreen.main.scale // 匹配屏幕缩放比，导出Retina级高清图
    let renderer = UIGraphicsImageRenderer(size: canvasSize, format: renderFormat)
    
    return renderer.image { context in
        let cgContext = context.cgContext
        cgContext.setLineCap(.round)
        cgContext.setLineJoin(.round)
        
        // 逐个遍历绘制元素渲染
        for element in elements {
            cgContext.addPath(element.path.cgPath)
            cgContext.setLineWidth(element.lineWidth)
            cgContext.setStrokeColor(UIColor(element.strokeColor).cgColor)
            
            if element.isFilled {
                cgContext.setFillColor(UIColor(element.strokeColor).cgColor)
                cgContext.fillPath()
            } else {
                cgContext.strokePath()
            }
        }
    }
}

如果是macOS平台，把UIImage替换为NSImage，对应使用NSGraphicsContext实现渲染逻辑即可。

如果你不想单独维护绘制数据做重绘，可以直接对SwiftUI的Canvas视图层级做快照，实现快速截图：

import SwiftUI
import UIKit

extension View {
    func snapshot() -> UIImage {
        let hostingController = UIHostingController(rootView: self.edgesIgnoringSafeArea(.all))
        let targetSize = hostingController.view.intrinsicContentSize
        hostingController.view.bounds = CGRect(origin: .zero, size: targetSize)
        hostingController.view.backgroundColor = .clear
        
        let renderer = UIGraphicsImageRenderer(size: targetSize)
        return renderer.image { _ in
            hostingController.view.drawHierarchy(in: hostingController.view.bounds, afterScreenUpdates: true)
        }
    }
}

使用时直接在Canvas视图上调用即可：

// 调用示例
let snapshotImage = Canvas { context, size in
    // 你原本的Canvas绘制逻辑
}.snapshot()

• 先配置权限：在项目的Info.plist中添加NSPhotoLibraryAddUsageDescription字段，值为权限提示文案，比如“保存您绘制的作品到相册”，否则调用保存逻辑时App会直接崩溃。
• 导入Photos框架实现保存逻辑：

import Photos

func saveToAlbum(_ image: UIImage, completion: ((Bool, Error?) -> Void)? = nil) {
    PHPhotoLibrary.requestAuthorization(for: .addOnly) { authStatus in
        guard authStatus == .authorized || authStatus == .limited else {
            completion?(false, nil)
            return
        }
        
        PHPhotoLibrary.shared().performChanges({
            PHAssetChangeRequest.creationRequestForAsset(from: image)
        }) { success, error in
            DispatchQueue.main.async {
                completion?(success, error)
            }
        }
    }
}

注意事项 #

• 优先选择方案1导出图片，相比视图截图清晰度更高，也不会出现因为视图未加载完成导致的截空白问题
• 不要尝试在运行时写入Assets目录，会直接触发权限错误
• 保存相册的权限提示必须和功能对应，否则提交App Store审核可能被拒

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