I have a ZStack that contains a VStack with 2 views (view1 and view2) and a third view (view3). So, is either that view1 and View1 are visible, or view3 is visible. This is the relevant code: ZStack { VStack { view1() View2() } if showView3 View3() } view1 and view2 are 400px in width and 200px in height, while view3 is 400 x 400 px, so that it completely overwrite view1/view2 when visible.
The problem I'm trying to solve is that the border of a TextField placed in view1 is visible when showView3 is true, what should not be happening (possible glitch in swift?). To show the problem, I prepared a code sample, which shows that when view3 is active, it completely overwrites view1/view2, but still, the border of the TextField remains visible. (See screenshot below)
struct TestZStackView: View { @State private var showView3 = false var body: some View { ZStack { VStack { Toggle("view3", isOn: $showView3) View1() .frame(width: 400, height: 200) .background(Color.red) .zIndex(1) View2() .frame(width: 400, height: 200) .background(Color.green) .zIndex(1) }
if showView3 {
View3()
.frame(width: 400, height: 400)
.background(Color.blue)
.zIndex(2)
}
}
}
}
struct View1: View { var body: some View { TextField("Enter text", text: .constant("")) .padding() .cornerRadius(5) .textFieldStyle(RoundedBorderTextFieldStyle()) .zIndex(1) } }
struct View2: View { var body: some View { Color.clear } }
struct View3: View { var body: some View { Color.black // (Ensure no transparency) } }
zIndex() are not required, I just placed them to see if the problem get solved, but it may no difference.
BTW, in the code above, the visible border disappears if the view is minimized, but that is not the case in the real app I'm working on.
In the screenshots attached, it can be seen how the TextField border remains visible when view3 is active ("
" "title=Screenshot 2024-05-24 at 10.06.03 PM.png;width=800;height=632")