Skip to content
Asynchronous image loading in SwiftUI. SwiftUI Image view that displays an image downloaded from provided URL
Branch: master
Clone or download
Latest commit 24f9484 Aug 10, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.
Sources/URLImage New local cache Aug 10, 2019
Tests New local cache Aug 10, 2019
.gitignore Ignoring .swiftpm Jul 30, 2019
LICENSE Create LICENSE Jun 10, 2019
Package.swift Initial Commit Jun 8, 2019 Update Jul 19, 2019


URLImage is a SwiftUI view that displays an image downloaded from provided URL. URLImage manages downloading remote image and caching it locally, both in memory and on disk, for you.

Creating URLImage view is described in my blog post URL Image view in SwiftUI.

There's also a demo app URLImageApp.


URLImage is a Swift Package and you can install it with Xcode 11:

  • Copy SSH or HTTPS URL from github;
  • Open File/Swift Packages/Add Package Dependency... in Xcode 11;
  • Paste the URL and follow steps.


URLImage must be initialized with a URL and optional placeholder image.

let url: URL = // ...


URLImage(url, placeholder: Image(systemName: "photo"))

Using in a view:

import SwiftUI
import URLImage

struct MyView : View {

    let url: URL

    var body: some View {
            .aspectRatio(contentMode: .fit)

Using in a list:

import SwiftUI
import URLImage

struct MyListView : View {

    let urls: [URL]

    var body: some View {
        List(urls, id: \.self) { url in
            HStack {
                URLImage(url, delay: 0.25)
                    .frame(width: 100.0, height: 100.0)


URLImage allows you to configure its parameters using initializer:

init(_ url: URL, placeholder: Image, session: URLSession?, delay: Double, animated: Bool)`


The view displayed while the remote image is downloading or if it failed to download. Default is Image(systemName: "photo").

Placeholder is a closure that returns a View object. This allows you to customize it. For instance, this sample code replaces default placeholder with a circle in a 150x150 bounding box.

URLImage(url, placeholder: {
    Image(systemName: "circle")
        .frame(width: 150.0, height: 150.0)


Optional URLSession used to download the image. Default session is created with URLSessionConfiguration.default and httpMaximumConnectionsPerHost = 1.


Delay before URLImage fetches the image from cache or starts to download it. This is useful to optimize scrolling when displaying URLImage in a List view. Default is 0.0.

Styling Images


Returns resizable URLImage object. This function matches the resizable(capInsets:resizingMode:) function of the Image object. Resizable is only applied to the remote image. The placeholder is not affected.


Returns URLImage object with applied rendering mode. This function matches the renderingMode(_:) function of the Image object. Rendering mode is only applied to the remote image. The placeholder is not affected.

You can’t perform that action at this time.