Zia
Zia

Reputation: 14722

Image inside NavigationLink does not render

Image inside a Navigation link just shows as blue. Tapping the image does navigate us to the destination correctly.

Code:

public var body: some View {
    NavigationView {
        Image("1")
        .resizable()
        .scaledToFit()
    }
}

Output:

enter image description here

Code:

public var body: some View {
    NavigationView {
        NavigationLink(destination: Image("2")) {
            Image("1")
            .resizable()
            .scaledToFit()
        }
    }
}

Output: enter image description here

Upvotes: 1

Views: 137

Answers (1)

Zia
Zia

Reputation: 14722

While writing up the question, I realized I need to set the rendering mode correctly. The following fixes this issue:

public var body: some View {
    NavigationView {
        NavigationLink(destination: Image("2")) {
            Image("1")
            .renderingMode(.original)
            .resizable()
            .scaledToFit()
        }
    }
}

Upvotes: 3

Related Questions