Image in swiftUI

Resizing, Shadows, and Backgrounds

1. Add image on view

Image("avocado") // Displays an image named “avocado”. 

2. Makes the image resizable

.resizable() // Makes the image resizable to fit the specified dimensions.

3. Aspect ratio of the image

contentMode: .fill

.aspectRatio(contentMode: .fill) // Ensures the image fills the frame, potentially cropping parts of it

contentMode: .fit

.aspectRatio(contentMode: .fit) // Maintains the aspect ratio of the image while fitting it within its frame.

4. Set size of the image

.frame(width: 200, height: 200, alignment: .center) // Sets the width and height of the image to 200, centering it within the frame.

5. Add shadow on image:

.shadow(color: .black.opacity(0.2), radius: 10, x: 0, y: 5)

6. Add background colour for image:

.background(Color.green.opacity(0.5))

7. Add corner radius for image:

.cornerRadius(50)

Complete code:

import SwiftUI

struct AvacadoView: View {

var body: some View {
 Image("avocado")
.resizable()
.aspectRatio(contentMode: .fit)
.background(Color.green.opacity(0.5))
.cornerRadius(50)
 }
}

#Preview {
    AvacadoView()
}

Thanks, Happy coding :)