swiftalignmentvertical-alignmentswiftui

SwiftUI HStack vetrical Alignment doesn't work?


I have the following code:

HStack(alignment: VerticalAlignment.top) {
    Button("x"){
        self.errorText = ""
    }
    //Spacer()
}

I need to locate button on the top. But button is still on the center of HStack view.

enter image description here

What I did wrong?

PS: Using Spacer() in this place is not solution for me. I need exactly alignment.


NOT NECESSARY PART:

@State var errorText: String = "Some long error text long long long long long long long long long long long long long long long long long long long long"

        VStack{
            Spacer()
            HStack{
                Text("Error: \(errorText)")
                Spacer()
                HStack(alignment: VerticalAlignment.top) {
                    Button("x"){
                        self.errorText = ""
                    }
                    //Spacer()
                }
            }
            .frame(minHeight:10)
            .padding(.all, 5)
        }

I don't know height of the VStack (HStack parent), because of I don't know size of the error text;

Spacer() is not solution because of it's makes VStack height to the window height.


Solution

  • You should align the outer HStack instead. Also the inner one is useless. So you can get rid of it.

    VStack{
        Spacer()
        HStack(alignment: .top) {
            Text("Error: \(errorText)")
            Spacer()
            Button("x"){ self.errorText = "" }
        }
        .frame(minHeight:10)
        .padding(.all, 5)
    }