How do I navigate to my SecondView by tapping image button?-CodePudding

I'm trying out NavigationView and want to move to SecondView on clicking radio-on-button. The code works fine if I'm using text button, I need to use an icon/image though and it doesn't work in that case. What am I missing?

import SwiftUI

struct FirstView: View {
    var body: some View {
        NavigationView {
                   VStack {
                       Text("Main Content View")
                           .font(.largeTitle)
                           .fontWeight(.medium)
                  strong text         .foregroundColor(Color.blue)
                       Spacer()
                       NavigationLink(destination: SecondView(), label: {
                           Button(action: {
                               
                           }) {
                               
                               Image("radio-on-button")
                                   .renderingMode(.original)
                                   .resizable()
                                   .frame(width: 75, height: 75)
                                   .foregroundColor(.red)
                                   .padding(.horizontal)
                               
                           }
                       }) 
                 }
               }
    }
}

struct SecondView: View {
    var body: some View {
        Text("Hello, Second View!")
                    .font(.largeTitle)
                    .fontWeight(.medium)
                    .foregroundColor(Color.blue)
    }
}

CodePudding user response：

Use following code to solve. No need to use Button for NavigationLink label only use Image as a NavigationLink Label.

NavigationLink(destination: SecondView(), label: {
    Image("radio-on-button") //Remove the button and add only Image
        .renderingMode(.original)
        .resizable()
        .frame(width: 75, height: 75)
        .foregroundColor(.red)
        .padding(.horizontal)
})

CodePudding user response：

When you want to navigate, you simply use NavigationLink without a Button:

NavigationLink(destination: SecondView(), label: {
    Image("radio-on-button")
        .renderingMode(.original)
        .resizable()
        .frame(width: 75, height: 75)
        .foregroundColor(.red)
        .padding(.horizontal)
})

Button is used to execute some action.

CodePudding user response：

In order to fix issue you need to bind and manage tag with NavigationLink, So create one state variable inside you view as follow, just add above body.

   @State var selection: Int? = nil

Then update your button code as follow to add NavigationLink

NavigationLink(destination: SecondView(), label: {
  Button(action: {
      print("Radio button tapped")
      self.selection = 1                     
  }) {
      Image("radio-on-button")
      .renderingMode(.original)
      .resizable()
      .frame(width: 75, height: 75)
      .foregroundColor(.red)
      .padding(.horizontal)
                           
  }
})

I hope this will solve your problem. If not feel free to discuss. Thanks