swiftswiftuinavigationlink

SwiftUI NavigationView not see Image

I have a code and make NavigationLink Button, I write Text and Image, But my Image not a see. Pls help me.

VStack{
        Image("Coachs")
            .resizable()
            .aspectRatio(contentMode: .fill)
            .frame(width: 370, height: 200)
            //.clipped()
            .cornerRadius(20.0)
        NavigationLink(destination: Text("Detail view here")){
            ZStack{
                Text("Press on me")
                    .foregroundColor(.white)
                    .font(.largeTitle)
                Image("Coachs")
                    .resizable()
                    .aspectRatio(contentMode: .fill)
                    .frame(width: 370, height: 200)
                    //.clipped()
                    .cornerRadius(20.0)

            }


        }}

I make screen if you can't understand enter image description here

Solution

  • This looks like SwiftUI bug of handling raster images. Please find below approach for workaround. Tested with Xcode 11.4 / iOS 13.4

    demo

    This is an example of cell to be used for your goal. Of course in real case the image name and navigation link destination, etc., can be injected via constructor parameters for reuse purpose.

    struct TestImageCell: View {
    @State private var isActive = false

    var body: some View {
        Image("large_image")    // raster !! image
            .resizable()
            .aspectRatio(contentMode: .fill)
            .frame(width: 370, height: 200)
            .cornerRadius(20.0)
            .overlay(
                Text("Press on me")              // text is over
                    .foregroundColor(.white)
                    .font(.largeTitle)
            )
            .onTapGesture { self.isActive.toggle() } // activate link on image tap
            .background(NavigationLink(destination:  // link in background
                Text("Detail view here"), isActive: $isActive) { EmptyView() })
    }
}