如何在深层导航页面中正确将SwiftUI View渲染为UIImage？

错误提示明确指出：在CoreAnimation提交周期内，使用afterScreenUpdates:YES进行视图快照是不被支持的。这是因为SubContentView的初始化是在NavigationLink触发的页面过渡动画过程中执行的，此时正处于CoreAnimation的提交阶段，直接调用带afterScreenUpdates: true的drawHierarchy会被系统拦截，导致生成空白图片。

1. 调整快照逻辑，避开CoreAnimation提交周期 #

不要在SubContentView的init方法中生成图片，改用onAppear结合异步调度，让快照操作延迟到页面动画完成后执行：

struct SubContentView: View {
    @State private var image: UIImage?
    
    var body: some View {
        VStack {
            Text("SubContentView")
            if let image = image {
                Image(uiImage: image)
            } else {
                ProgressView() // 加载占位符
            }
        }
        .onAppear {
            // 异步执行，避开动画的CoreAnimation提交周期
            DispatchQueue.main.async {
                self.image = SampleView().getImage()
            }
        }
    }
}

2. 修改SampleView的快照方法，确保视图提前布局并安全渲染 #

将afterScreenUpdates改为false，同时提前强制视图完成布局，避免依赖系统的更新触发：

struct SampleView: View {
    var body: some View {
        Image(systemName: "globe").ignoresSafeArea()
    }
    
    func getImage() -> UIImage {
        let controller = UIHostingController(rootView: self)
        controller.view.bounds = CGRect(origin: .zero, size: CGSize(width: 100, height: 100))
        // 强制视图完成布局
        controller.view.layoutIfNeeded()
        
        let format = UIGraphicsImageRendererFormat()
        format.scale = UIScreen.main.scale // 使用屏幕原生比例保证清晰度
        return UIGraphicsImageRenderer(size: controller.view.bounds.size, format: format).image { context in
            controller.view.drawHierarchy(in: controller.view.bounds, afterScreenUpdates: false)
        }
    }
}

备选方案：使用UIView.snapshotView替代drawHierarchy（iOS 11+） #

如果上述方法仍有问题，可以改用系统提供的快照视图API，再转成UIImage：

func getImage() -> UIImage {
    let controller = UIHostingController(rootView: self)
    controller.view.bounds = CGRect(origin: .zero, size: CGSize(width: 100, height: 100))
    controller.view.layoutIfNeeded()
    
    guard let snapshotView = controller.view.snapshotView(afterScreenUpdates: false) else {
        return UIImage()
    }
    
    let format = UIGraphicsImageRendererFormat()
    format.scale = UIScreen.main.scale
    return UIGraphicsImageRenderer(size: snapshotView.bounds.size, format: format).image { _ in
        snapshotView.drawHierarchy(in: snapshotView.bounds, afterScreenUpdates: false)
    }
}

• 禁止在视图初始化方法中执行UI渲染操作，尤其是导航跳转的目标视图，此时处于动画周期内，系统会限制部分UI操作。
• 调用layoutIfNeeded()是确保视图完成布局的关键，否则快照可能捕获到未布局的空白视图。
• 使用UIScreen.main.scale替代固定的scale=1，保证生成的图片清晰度与设备屏幕一致。

内容的提问来源于stack exchange，提问作者revati.at