SwiftUI Tutorial: Working with Images

Figure 1

This tutorial is part of my SwiftUI Tutorial series.

Just like text, working with images is another basic that you’ll be dealing with in app development. In this tutorial, you will learn how to display an image in SwiftUI and some useful modifiers for changing the size.

Before we proceed, let’s create a new project. Either use an existing one for practice, or you may follow the step-by-step process in this link if you’re having trouble creating one.

Importing images

Note: Feel free to use your own image in this tutorial. In case you don’t have one for practice, you can use an image from unsplash.com and make sure to rename the file to “image1.jpg”. If you wanted to use the one in this article, here’s the link of the image that I used for this project.

Figure 2. Photo by: Ian Keefe on unsplash.com

Before an image can be used on a project, the initial step is to import the images into the asset directory. Assuming you already have the image and already renamed it to “image1.jpg”, drag and drop it to Xcode’s asset directory. You may refer to figure 3 below on how it looks like.