SwiftUI stop Divider from expanding vertically in HStack
Putting a fixedSize()
modifier on the HStack
instead of the Divider
fixies the problem.
var body : some View {
VStack(spacing: 0) {
// Some text ...
Text("gsfdsfkajflkasdjflkas,jdflaskjf")
HStack(spacing:0) {
Button(action: {print("hi")}) { Text("Cancel") }
.padding().inExpandingRectangle().fixedSize(horizontal: true, vertical: true)
// This divider is the problem
Divider()
Button(action: {print("hello")}) { Text("Delete") }
.padding().inExpandingRectangle().fixedSize(horizontal: true, vertical: true)
}.fixedSize() <------- Insert this
}.frame(minHeight: 0)
}
Result:
Here is a demo of possible simplified alternate, without that artificial extension. Tested with Xcode 11.4 / iOS 13.4.
Divider() // or Rectangle().fill(Color.gray).frame(height: 1)
HStack {
Button(action: {}) { Text("Cancel").fixedSize() }
.padding().frame(maxWidth: .infinity)
Divider() // or Rectangle().fill(Color.gray).frame(width: 1)
Button(action: {}) { Text("Delete").fixedSize() }
.padding().frame(maxWidth: .infinity)
}.fixedSize(horizontal: false, vertical: true)
Note: It worth also to consider custom divider, like
Rectangle().fill(Color.gray).frame(width: 1) // or any other color
than might give much appropriate visual feedback, like