How To Resize Image In SwiftUI

There are two possible options to scale image, size to fit, and size to fill.

The first one, size to fit, tries to scale the image to the possible area and it keeps its aspect ratio. Such an image won’t be beyond the available area.

The seconds one is size to fill, it takes all possible area and spreads the image also keeps its aspect ratio. However, the image can be beyond the available area and it can be cut.

Here, it’s a view of the mountains. It’s taken vertically. In the project, it’s called mountains.

Let’s create a simple image view inside the code.

var body: some View {
    Image(“mountains”)
}

The result doesn’t look well.

Let’s resize it and use a scale to fit at first.

var body: some View {
    Image(“mountains”)
        .resizable()
        .scaledToFit()
}

Now it looks much better.

Notice that there is white space because the image is taken vertically and the screen is horizontal.

Not use size to fill.

var body: some View {
    Image(“mountains”)
        .resizable()
        .scaledToFill()
}

Some part of the image is beyond the screen but it looks better than the default without any scale.

If you click on the image inside Preview you’ll see how big is the image. That blue lines are the border of image.