How to make a view between Spacers always at the center in an HStack?

Question

What I would like to achieve. regardless the width of text width at both side the button should always at the center of the HStack.

HStack {
    Text("Foooooooo")
    Spacer(minLength: 5)
    Button(action: { }) {
        Text("Bar")
    }
    Spacer()
    Text("Baz")
}
.font(.system(size: 16, weight: .heavy, design: .rounded))
.padding()

I also tried to use GeometryReader and set frame size for each Text and Button in the view however there are two problems,

1. The view returned by GeometryReader would occupies the entire view the parent offers to it instead of the actual intrinsic content size, the space only enough for Text, Spacer and Button
2. String inside the first Text could not be left align so does the string inside the last Text couldn't be right aligned

Answer 1

Here is possible approach for your case. Demo prepared & tested with Xcode 12 / iOS 14

    HStack {
        Spacer()
            .overlay(Text("Foooooooo"), alignment: .leading)

        Button(action: { }) {
            Text("Bar")
        }

        Spacer()
            .overlay(Text("Baz"), alignment: .trailing)
    }
    .font(.system(size: 16, weight: .heavy, design: .rounded))
    .padding()

backup