SwiftUI中如何从相册选图？自定义UIViewRepresentable组件遇阻

你的代码没法正常工作的核心原因是用错了协议——UIImagePickerController是一个视图控制器（UIViewController），不是普通的UIView，所以不能用UIViewRepresentable，得换成UIViewControllerRepresentable。另外还有几处小细节需要调整，我帮你把代码修正好了，顺便解释下问题点：

原代码的问题汇总 #

• 协议选择错误：应该用UIViewControllerRepresentable而非UIViewRepresentable
• Coordinator的绑定初始化写法错误：正确的绑定存储逻辑有误
• 没有处理图片选择完成/取消后的控制器关闭操作
• 错误地返回了UIImageView，这和图片选择器的功能完全不匹配

修正后的完整代码 #

import SwiftUI
import UIKit

struct ImagePicker: UIViewControllerRepresentable {
    @Binding var image: UIImage?
    @Environment(\.dismiss) private var dismiss
    
    // Coordinator负责处理图片选择器的代理回调
    class Coordinator: NSObject, UIImagePickerControllerDelegate, UINavigationControllerDelegate {
        let parent: ImagePicker
        
        init(parent: ImagePicker) {
            self.parent = parent
        }
        
        func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [UIImagePickerController.InfoKey : Any]) {
            // 优先取编辑后的图片，没有的话取原图
            if let editedImage = info[.editedImage] as? UIImage {
                parent.image = editedImage
            } else if let originalImage = info[.originalImage] as? UIImage {
                parent.image = originalImage
            }
            // 选择完成后关闭选择器
            parent.dismiss()
        }
        
        func imagePickerControllerDidCancel(_ picker: UIImagePickerController) {
            // 取消选择时也关闭选择器
            parent.dismiss()
        }
    }
    
    func makeCoordinator() -> Coordinator {
        Coordinator(parent: self)
    }
    
    func makeUIViewController(context: Context) -> UIImagePickerController {
        let picker = UIImagePickerController()
        picker.delegate = context.coordinator
        // 允许编辑图片（可选，可根据需求关闭）
        picker.allowsEditing = true
        // 如果需要指定来源（比如相机/相册），可以在这里设置
        // picker.sourceType = .camera
        return picker
    }
    
    func updateUIViewController(_ uiViewController: UIImagePickerController, context: Context) {
        // 图片选择器的状态不需要随绑定更新，这里无需额外操作
    }
}

怎么在SwiftUI里使用这个ImagePicker #

你可以通过sheet组件来展示这个图片选择器，示例代码如下：

struct ContentView: View {
    @State private var selectedImage: UIImage?
    @State private var showImagePicker = false
    
    var body: some View {
        VStack(spacing: 20) {
            // 展示选中的图片
            if let image = selectedImage {
                Image(uiImage: image)
                    .resizable()
                    .scaledToFit()
                    .frame(width: 200, height: 200)
                    .cornerRadius(10)
            } else {
                Text("No image selected")
                    .font(.headline)
                    .foregroundColor(.gray)
            }
            
            // 触发图片选择器的按钮
            Button("Select Image") {
                showImagePicker = true
            }
            .buttonStyle(.borderedProminent)
        }
        .padding()
        .sheet(isPresented: $showImagePicker) {
            ImagePicker(image: $selectedImage)
        }
    }
}

补充说明 #

• 我把image绑定改成了可选类型UIImage?，更符合实际场景（用户可能没有选择图片）
• 使用了SwiftUI的@Environment(\.dismiss)来处理控制器关闭，比手动调用picker.dismiss()更贴合SwiftUI的设计风格
• 补充了取消选择的代理方法，保证用户取消操作时也能正常关闭选择器

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