RemoteAsyncImage on SwiftUI

RemoteAsyncImage is a view that asynchronously loads and displays an image.

However, native AsyncImage is available from iOS 15 and don't have a cache.

Requirements

iOS 13.0

Installation

Swift Package Manager

To integrate RemoteAsyncImage into your project using SwiftPM add the following to your Package.swift:

dependencies: [
    .package(url: "https://github.com/c-villain/RemoteAsyncImage", from: "0.1.0"),
],

or via XcodeGen insert into your project.yml:

name: YourProjectName
options:
  deploymentTarget:
    iOS: 13.0
packages:
  RemoteAsyncImage:
    url: https://github.com/c-villain/RemoteAsyncImage
    from: 0.1.0
targets:
  YourTarget:
    type: application
    ...
    dependencies:
       - package: RemoteAsyncImage

Usage

import RemoteAsyncImage

struct YourView: View {

    @Environment(\.imageCache) var cache: ImageCache

    var body: some View {
        let url = URL(
            string: "https://experience-ireland.s3.amazonaws.com/thumbs2/d07258d8-4274-11e9-9c68-02b782d69cda.800x600.jpg"
        )
        
        return VStack {
            RemoteAsyncImage(
                url: url,
                cache: self.cache
            )
            .placeholder {
                Text("Loading ...")
            }
            .resizable()
            .scaledToFill()
            .frame(width: 104, height: 144)
            .clipped()
            
            RemoteAsyncImage(
                url: url
            )
            .placeholder {
                Text("Loading ...")
            }
            .resizable()
            .scaledToFill()
            .frame(width: 104, height: 144)
            .clipped()
            
            
            RemoteAsyncImage(
                url: url,
                placeholder: {
                    Text("Loading ...")
                }
            )
            .resizable()
            .scaledToFill()
            .frame(width: 104, height: 144)
            .clipped()
            
            RemoteAsyncImage(url: urlPig) {
                Text("Loading ...")
            }
            .resizable()
            .scaledToFill()
            .frame(width: 104, height: 144)
            .clipped()
            
        }
    }
}