Using ImagePicker in SwiftUI

Question

I am new to SwiftUI. I want to make an app that has an image picker.

I found this article: https://ishtiz.com/swiftui/image-picker-in-swiftui

It says:

To implement an image picker in SwiftUI, you can use the ImagePicker struct provided by the SwiftUI framework. This struct has a pickImage() method that presents the image picker to the user and returns the selected image as a UIImage object.

Providing this example code:

struct ContentView: View {
  @State private var image: UIImage?
  var body: some View {
    VStack {
      if image != nil {
        Image(uiImage: image!)
          .resizable()
          .scaledToFit()
      }
      Button("Select Image") {
        self.image = ImagePicker.pickImage()
      }
    }
  }
}

I added the code to my project but it doesn’t build:

Cannot find 'ImagePicker' in scope

Do I need to import something?

Answer 1

import PhotosUI

For iOS 16.0 + you can use PhotoPicker, to select multiple photos.

  @available(iOS 16.0, *)
    struct MultiplePhotoPickerView<Content: View>: View {
        @Binding var imagesData: [Data]
        let content: () -> Content
        @State private var selectedItems: [PhotosPickerItem] = []
        
        var body: some View {
            PhotosPicker(selection: $selectedItems,
                         matching: .images) {
                content()
            }.onChange(of: selectedItems) { selectedItems in
                Task {
                    imagesData.removeAll()
                    for item in selectedItems {
                        if let imageData = try? await item.loadTransferable(type: Data.self) {
                            self.imagesData.append(imageData)
                        }
                    }
                }
            }
        }
    }

Use it anywhere in app

@State private var selectedImagesData: [Data] = []
    
MultiplePhotoPickerView(imagesData: $selectedImagesData) {
                        Label("Library", systemImage: SystemIcon.libraryIcon.rawValue)
                   }.onChange(of: selectedImagesData) { value in
                value.forEach() { image in
                    // do whatever need to be done with selected images
                   //convert image data to Image
                }
                selectedImagesData.removeAll()
            }