Search code examples
swiftimageswiftuiuiimageview

Show only top portion of image in SwiftUI

I need to align a UIImageView in a way that only top portion of the image is shown.

Original Image:-

Screen Shot

I achieved Image from below Code:-

Screen Shot

Code:-

Image("ImageDemo")
  .resizable()
  .scaledToFill()
  .frame(height: 120, alignment: .center)
  .clipped()
  .cornerRadius(20, corners: [.topLeft, .topRight])
  .padding(.bottom)

Can someone please explain to me how to show image with top portion only, I've tried to implement by above but no results yet.

Any help would be greatly appreciated.

Thanks in advance.

Solution

  • Use alignment: .top it will fix your issue.

    struct ContentView: View {
    var body: some View {

            Image("Your Image Here!")
                .resizable()
                .scaledToFill()
                .cornerRadius(20)
                .frame(height: 120, alignment: .top) //  <<: Here
                .clipped()
                .padding()

    }
}