Add NavigationLink to Custom designed button in Swift UI - ios

Question

I am trying to add NavigationLink inside NavigationView in which there is a custom designed button.
I want to navigate on that button tap but NavigationLink code gives compilation error. it requires localisedTitle which I don't want to display and also tried to give Custom button in place of label but not working. Any help would be appreciated
Here is my code! I am using Xcode 13.3.1
#State private var isShowingSignupView = false
var body: some View {
NavigationView {
VStack {
Spacer()
VStack(alignment: .center, spacing: 12) {
AppTextField(Constants.Email, text: $email)
AppTextField(Constants.Password, text: $password, isSecure: $isSecure, leftImage: "lock",rightImage: Image(systemName: "eye.fill"), rightSelectedImage: Image(systemName: "eye.slash.fill"))
AppButtonText(title: Constants.ForgotPassword) {
debugPrint("Forgot Password tapped")
}
.frame(maxWidth: .infinity, maxHeight: 20, alignment: .trailing)
AppButton(title: Constants.Login) {
}
}
Spacer()
NavigationLink($isShowingSignupView, destination: Signup) {
AppButtonText(title: Constants.SignUp) {
isShowingSignupView = true
}
}
}
.padding()
}
.navigationTitle("Login")
}
**ERROR:-
Cannot convert value of type 'Signup.Type' to expected argument type '() -> Destination'
Generic parameter 'Destination' could not be inferred**
**I have also tried after replacing this **
NavigationLink(destination: Signup()) {
AppButtonText(title: Constants.SignUp) {
isShowingSignupView = true
}
}
Which just removed error but does not navigate on new screen

Answer 1

Hey there!
I got the issue and sollution to it.
Actually above code was almost correct but the problem was in Custom Button view action which was not getting triggered due to simultaneousGesture added in it for functionality
struct AppButtonText: View {
var title: String
#State var action: () -> ()
#State private var isPressed = false
var body: some View {
Text(title)
.foregroundColor(isPressed ? Color.red.opacity(0.5) : Color.red)
.background(Color.clear)
.padding(.vertical, 0)
.font(.body)
.simultaneousGesture(
DragGesture(minimumDistance: 0)
.onChanged({ _ in
isPressed = true
})
.onEnded({ _ in
isPressed = false
action() `THIS LINE WAS NOT ADDED BEFORE`
})
)
}
}
And this below line was having no issue
NavigationLink($isShowingSignupView, destination: Signup) {
AppButtonText(title: Constants.SignUp) {
isShowingSignupView = true
}
}
THANKS ALL FOR YOUR VALUABLE REPLIES

Answer 2

You need to use NavigationLink(destination: { Signup() })
Also since you are using custom Button instead of NavigationLink it's better use isActive property:
NavigationLink("Signup", isActive: $isShowingSignupView) {
Signup()
}
AppButtonText(title: Constants.SignUp) {
isShowingSignupView = true
}

Answer 3

You can just do it like this. Note that you need to initialize when using a view struct, like Signup().
#State private var isShowingSignupView = false
struct Signup: View {
var body: some View {
Text("Your view contents here")
}
}
var signup: some View {
Text("Your view contents here")
}
var body: some View {
NavigationView {
VStack {
// Using a view
NavigationLink(isActive: $isShowingSignupView) {
signup
} label: {
AppButtonText(title: Constants.SignUp) {
isShowingSignupView = true
}
}
// Using a view struct
NavigationLink(isActive: $isShowingSignupView) {
Signup()
} label: {
AppButtonText(title: Constants.SignUp) {
isShowingSignupView = true
}
}
}
}
}