SwiftUI NavigationLink not behaving correctly when buttons are close together

Question

Created Jul ’20

Replies 2

Boosts 0

Views 2.3k

Participants 2

I'm trying to implement a programmable NavigationLink to go to another view, triggered by a simple button. But when that button is next to another button, instead of triggering the NavigationLink, it triggers the action of the button next to it.

Code Block struct NavLinkView: View {
		@State var showPasswordStr = true
		@State var showCheckView = false
		@State var password = "Abc"
		var body: some View {
				Form {
						VStack {
								NavigationLink(destination: CheckView(), isActive: $showCheckView ) {
										EmptyView()
								}
								Text("Password")
										.font(.system(size: 12, weight: .light, design: .default))
										.foregroundColor(.gray)
								HStack {
										
										if showPasswordStr {
												TextField("", text: $password)
														.textFieldStyle(RoundedBorderTextFieldStyle())
										} else {
												SecureField("", text: $password)
														.textFieldStyle(RoundedBorderTextFieldStyle())
										}
										Button(action: {
												showPasswordStr.toggle()
										} ) {
												Image(systemName: showPasswordStr ? "eye.slash" : "eye" )
										}
										.padding(.leading)
										Button(action: { showCheckView.toggle() } ) {
												Image(systemName: "checkmark.circle" )
										}
										.padding(.leading)
								}
						}
				}
		}
}

What am I mising? If I move the NavigationLink to be after the VStack, then both buttons trigger both the action of the first button and the NavigationLink.

Answered by quatrian in 624760022

Found out the answer. I need it to add .buttonStyle(PlainButtonStyle()) to each button as they are part of of a Form.

Boost

Answer 1

BabyJ OP

Jul ’20

I think in forms a single row can only have one button (or perform one button's action).

To work around this I would suggest having the checkmark button on the row below.

1

Answer 2

quatrian OP

Jul ’20

Accepted Answer

Found out the answer. I need it to add .buttonStyle(PlainButtonStyle()) to each button as they are part of of a Form.

1