Displaying Images in SwiftUI | Tech Wiki Online

Displaying Images in SwiftUI

In SwiftUI, you can easily display images in your views using the Image view. To get started, you’ll need to add the image to a new image set in your Assets.xcassets file in Xcode.

Once you have added the image to your assets, you can use the Image view in your ContentView like this:

import SwiftUI

struct ContentView: View {
    var body: some View {
        Image("Avatar")
    }
}

You can also use the Image view to display system images by using the Image(systemName:) initializer:

struct ContentView: View {
    var body: some View {
        Image(systemName: "house")
    }
}

The Image view provides a set of modifiers that you can use to customize the appearance of the image, such as:

• .resizable() to make the image resizable and adjust to the .frame() dimensions
• .frame() to set the width and height of the image
• .clipShape() to apply a clipping shape to the image
• .border() to set the color of the border around the image
• .overlay() to add another view on top of the image
• .aspectRatio() to set the aspect ratio of the image
• .clipped() to clip the image to fit within the frame

Here’s an example that demonstrates some of these modifiers in action:

Tags: SwiftUI, Images, Xcode, View, Modifiers