No extra utilizing UIViewControllerRepresentable and PHPickerViewController
On this yr’s WWDC, Apple brings in tons of enhancements to SwiftUI, one explicit that catches my consideration is the
PhotosPicker view. Sure, you’re proper! SwiftUI is lastly getting its personal native picture picker view in iOS 16.
PhotosPicker view helps all of the frequent functionalities that
PHPickerViewController has. Functionalities similar to single and a number of picks, asset kind filtering, and album switching are all included.
The way in which of utilizing the
PhotosPicker view is definitely fairly simple. Let me present you the way.
First issues first, let’s first import the
PhotosUI module. After that, outline a state named
selectedItem of kind
For higher reminiscence effectivity, the asset chosen by the person can be given to us within the type of
PhotosPickerItem. We’ll use it to retrieve the underlying asset in a while.
With that in thoughts, we are able to add the
PhotosPicker view to the content material view’s physique like so:
For simplicity’s sake, I’ve configured the
PhotosPicker view to point out a single choice images picker that solely shows pictures. Be at liberty to take a look at the official documentation for extra configuration choices.
Primarily based on my private expertise, I discover that it’s necessary to set
.shared() when initializing the
PhotosPicker view. If we omit it, the binding of
$selectedItem is not going to work. I’m not positive why is it so, possibly it’s a bug within the beta launch that can be fastened within the close to future. If anybody is aware of the rationale behind it, do hit me up on Twitter.
Now, in case you go forward and run the pattern code, you will note the
PhotosPicker view labeled as “Choose a photograph” on the heart of the display. Tapping on it can carry up the iOS native images picker.
We’re going to retrieve the user-selected asset within the type of
Information. Thus let’s go forward and outline the state for that:
@State personal var selectedImageData: Information? = nil
The way in which to deal with asset choice is fairly simple. The idea is to make use of the
onChange() modifier to detect the change of
selectedItem. After that, we are going to use the
loadTransferable()technique to get the underlying asset.
Lastly, let’s present the chosen picture proper under the
That’s it for dealing with asset choice. Run the pattern code once more to see all the pieces in motion.
Right here’s the total pattern code:
When you have watched the WWDC session about the
PhotosPicker view, you’ll discover that the way in which we retrieve the chosen picture is slightly bit totally different from what we noticed within the video. As an alternative of loading it within the type of
Picture, we’re loading it within the type of
As defined on this forum post, the
Picture kind solely helps
public.png as its content material kind. If the images picker incorporates property of kind aside from
png, similar to
heic, we won’t be able to retrieve it. Till Apple provides extra content material kind help to
Picture, it’s nonetheless advisable to make use of
Information when retrieving pictures from the images picker.
All through this text, I’ve been operating the pattern code on iOS, however in actual fact, the pattern code will run completely tremendous on macOS, iPadOS, and watchOS.
Based on Apple, the images picker will mechanically select the perfect format relying on the platform and the obtainable display area. This can positively come out fairly useful for many who have to help a number of platforms.