I have created a @StateObject from where a Login page is presented:
@StateObject var loginViewModel = //LoginViewModel Name
and There is a Button inside Vstack like this
VStack{
Button(action : {loginViewModel.show.toggle()} )
{
HStack{
Text("Button")
}
}. sheet (isPresented : $loginViewModel.show){
//View (passing viewModel)
}
}
The problem is tappable area is now spread to the entire screen. That is I am getting the login view when tapping on all other elements (pretty much everywhere in the screen) in the screen instead of that button area.
Any solution for this and to confine that button action around that button only?
What I did to solve this issue was to Remove the Entire button and add an onTapGesture instead of that.
The reason I found for this was when there are multiple ZStacks in a view, touch event registering in one of them will be passed to all others which are currently in the view. Adjusting ZIndex was not helping. Also, I couldn't restrict touch on other areas because there were buttons on them too.
Eg:
HStack {
//Button Label Code
} .onTapGesture{
}//Button Action