SwiftUI ImageView: AspectRatio

SwiftUI ImageView: Aspect Ratio

We can set aspectRatio for image using .aspectRatio modifier. Aspect ratio is a decimal value representing width/height. Value of aspectRatio is optional and if not provided, image assumes aspect ratio of the view.

struct ImageExample: View {
    var body: some View {
        Image("dt")
            .resizable()
            .aspectRatio(1, contentMode: .fit)
    }
}

Change value of aspectRatio to see the difference:

struct ImageExample: View {
    var body: some View {
        Image("dt")
            .resizable()
            .aspectRatio(3.8, contentMode: .fit)
    }
}

You can animate value of aspectRatio to see the effect it has on image:

struct ImageExample: View {
    @State private var aspectR: CGFloat = 0.0
    
    var body: some View {
        Image("dt")
            .resizable()
            .aspectRatio(aspectR, contentMode: .fit)
            .onAppear {
                withAnimation(Animation.easeInOut(duration: 2).repeatForever(autoreverses: true)) {
                    aspectR = 2.8
                }
            }
    }
}