How to set specific Height for Image in SwiftUI?

SwiftUI Image – Height

To set specific height for an Image, add frame() modifier to the Image. You may specify width, height and alignment for Image through frame() modifier.

In this tutorial, we will set a specific height for an Image and our focus is only on the height parameter to frame() modifier.

Example

In this example, we shall display an image from assets in three Image views with different height values. The first Image shall have a height of 100, the second Image shall have a height of 150, and the third image shall have a height of 200.

We have set the resizable() and aspectRatio() modifiers such that the aspect ratio of the image is preserved. So, when a specific height is set, the width is implicitly set using the original aspect ratio of the image.

ContentView.swift

import SwiftUI

struct ContentView: View {
    var body: some View {
        Image("sunrise")
            .resizable()
            .aspectRatio(contentMode: .fit)
            .frame(height: 100)
        Image("sunrise")
            .resizable()
            .aspectRatio(contentMode: .fit)
            .frame(height: 150)
        Image("sunrise")
            .resizable()
            .aspectRatio(contentMode: .fit)
            .frame(height: 200)
    }
}

Screenshot

Summary

Summarising this SwiftUI Tutorial, we learned how to set height for an Image in SwiftUI.