tvOS Button inside NavigationLink is not Working

Question

I have built an iOS app using swift and swiftui and now I am working on the tvOS version of the app. However, I have a couple of issues. One of the issues is still unresolved: tvOS Textfield Transparent Background I was creating a login page and I realized that the button inside the NavigationLink was not doing anything. Then to test and identify the issue I created a simple button as follows:

Button(action: {
    print("Login pressed")
}) {
    Text("Login")
        .frame(width:300, height: 35)
}
.background(Color.blue)
.foregroundColor(Color.white)

Output when clicked on:

Login pressed

And it looks like this:

And it looks like this when focused:

But when I insert that button inside a NavigationLink, Navigation like acts like a button and this button does nothing.

The code is like that:

NavigationLink(destination: mainScene(), tag:1, selection: $selection) {

    Button(action: {
        print("Login pressed")
        self.selection = 1
    }) {
        Text("Login")
            .frame(width:300, height: 35)
    }
    .background(Color.blue)
    .foregroundColor(Color.white)
}

In the iOS, I have a similar code, and it does not navigate until everything in the button action is executed and selection is equal to 1. But in this, it does not execute anything and it just directly navigates to the next page. The button looks like this when I embed it in the NavigationLink:

As you can see there is white space around the original login button and the focus is on that white space. And when clicked on it navigates. It looks like the NavigationLink acts like a button but it also prevents the button action to be executed. I am having these kind of problems that are mainly caused by the focus. For Example in the images above, as you can see the shape and the color of the button changes when the focus is on but I want to control it. However, I don't know how I can play with on focus design of the items.

Answer 1

Try the following

Button(action: {
    print("Login pressed")
    self.selection = 1
}) {
    Text("Login")
        .frame(width:300, height: 35)
}
.background(Color.blue)
.foregroundColor(Color.white)
.background(NavigationLink(destination: mainScene(), tag:1, 
     selection: $selection) { EmptyView() })

Answer 2

Try This:

NavigationLink(destination: mainScene(), tag:1, selection: $selection) {
    Button(action: {
        print("Login pressed")
        self.selection = 1
    }) {
        Text("Login")
            .frame(width:300, height: 35)
    }
    .background(Color.blue)
    .foregroundColor(Color.white)
}.buttonStyle(PlainButtonStyle())