Reputation: 33
So I am having trouble with the view TopBar in a VStack -- it keeps overlapping with the Image I have beneath it and messing up the ret of the formatting for that view. I've looked through similar threads and actually fixed an issue I was having with the image but I haven't seen something similar with the combining views. (Also I am in High School so I am sure things are messy and convoluted)
Content view:
ScrollView {
VStack{
Text("Sample Text")
.padding(.top, 50)
TopBar()
Image("Divider")
.resizable()
.scaledToFill()
.frame(width: geometry.size.width * 0.8,
}
}
TopBar:
VStack{
Spacer()
Menu("Menu") {
Button("A", action: {print("test")})
Button("B", action: {print("test")})
Button("C", action: action: {print("test")})
}
.frame(width: geometry.size.width * 0.8, alignment: .leading)
Menu("Menu 2") {
Button("E", action: {print("test")})
Button("F", action: {print("test")})
Button("G", action: {print("test")})
}
.frame(maxWidth: .infinity, minHeight: 50)
Spacer()
}
}
}
Upvotes: 0
Views: 1097
Reputation: 33
I am answering my own question in case someone stumbles on this. I just needed to embed each menu in an individual VStack for some reason. Although, you should avoid the geometryreader since that was the source of the issue.
Upvotes: 1