Tile an Image in SwiftUI

Introduction

Do you remember those early days of setting an image to repeat across the screen in the world of web development? Well, it’s now possible to do this in SwiftUI, and it makes sense if you want to create a background from a small image.

Getting Started

Go ahead and create a brand new Image object in SwiftUI

var body: some View {
    VStack {
        Image(systemName: "pencil")
            .foregroundColor(.green)
    }
}

In your example, you’re creating a new Image object using a system icon of a ‘Pencil’.

Tile the Image

You might be wondering how we can set this image to repeat as a tile on the screen.

.resizable(resizingMode: .tile)

You simply need to use the .resizable modifier with the parameter: .tile

This will repeat the image on the screen as cool background wallpaper.