FetchImage makes it easy to download images using Nuke and display them in SwiftUI apps.

Firebase Support 🔥

This fork of FetchImage extends the original interface with overloads for Firebase Storage. Read on to find out how easy it is to load images stored in your Firebase Storage bucket with Nuke and SwiftUI.

Overview

FetchImage is an observable object (ObservableObject) that allows you to manage the download of an image and observe the results of the download.

publicfinalclassFireFetchImage:ObservableObject,Identifiable{
/// Returns the fetched image.
///
/// - note: In case pipeline has `isProgressiveDecodingEnabled` option enabled
/// and the image being downloaded supports progressive decoding, the `image`
/// might be updated multiple times during the download.
@Publishedpublicprivate(set)varimage:PlatformImage?
/// Returns an error if the previous attempt to fetch the most recent attempt
/// to load the image failed with an error.
@Publishedpublicprivate(set)varerror:Error?
/// Returns `true` if the image is being loaded.
@Publishedpublicprivate(set)varisLoading:Bool=false
/// The progress of the image download.
@Publishedpublicvarprogress=Progress()}

Usage

FetchImage doesn't ship an image view because it's trivial to create one using SwiftUI and customize it precisely the way you want.

structImageView:View{leturl:URL@StateObjectprivatevarimage=FireFetchImage()varbody:someView{ZStack{Rectangle().fill(Color.gray)
image.view?.resizable().aspectRatio(contentMode:.fill).clipped()}.onAppear{ image.load(url)}.onDisappear(perform: image.reset)}}

For iOS 13, use @ObservedObject. Keep in mind that @ObservedObject does not own the instance; you need to maintain a strong reference to the FetchImage instance.

Lists

structDetailsView:View{varbody:someView{List(imageUrls, id: \.self){ImageView(url: $0).frame(height:200)}}}

If the URL changes, add .id(url) to your ImageView. This will ensure that onAppear is called when the URL changes.

Appearance

FetchImage gives you full control over how to manage the download and display the image. For example, if you want the download to continue when the view leaves the screen, change the appearance callbacks:

.onAppear {
image.priority =.normal
image.load(url)}.onDisappear{
image.priority =.low
}

Animations

structImageView:View{leturl:URL@StateObjectprivatevarimage=FireFetchImage()varbody:someView{
// ... create image view .onAppear {
// Ensure that memory cache lookup is performed without animations
withoutAnimation{
image.load(url)}}.onDisappear(perform: image.reset).animation(.default)}}privatefunc withoutAnimation(_ closure:()->Void){vartransaction=Transaction(animation:nil)
transaction.disablesAnimations =truewithTransaction(transaction, closure)

Firebase

You may also initialize a FetchImage using a Firestore StorageReference. These references can be easily created synchronously, but require an asynchronous call in order generate URLs for fetching the requested content. Unfortunately, this makes image loading in SwiftUI rather difficult. Using Nuke and Firebase together simplifies the whole process quite a bit:

@State referencedImage: StorageReference
publicvarbody:someView{ImageView(image:FireFetchImage(regularStorageRef: referencedImage)).animation(.default)}

Requirements

Nuke	Swift	Xcode	Platforms
FetchImage	Swift 5.6	Xcode 13.3	iOS 13.0 / watchOS 6.0 / macOS 10.15 / tvOS 13.0

License

FetchImage is available under the MIT license. See the LICENSE file for more info.