SwiftUI Align VStack Top Leading in ZStack

305 Views Asked by At

I have a Stack I am using to create a graph with 2 different lines, but I also want to have 2 labels on the graph. I want these labels to be in the top left of the ZStack but cannot figure out how. Here's what I've tried:

    ZStack {
        
        ZStack(alignment: .topLeading) {
            VStack {
                Text("Contributions")
                    .frame(width: 180, height: textHeight, alignment: .center)
                    .background(Color.POI.blue)
                    .cornerRadius(textHeight / 2)
                    .multilineTextAlignment(.center)

                Text("Earnings")
                    .frame(width: 150, alignment: .center)
                    .cornerRadius(dimensions.cornerRadiusLarge)
                    .multilineTextAlignment(.center)
            }
        }
    // Rest of the graph
  }
1

There are 1 best solutions below

0
On
 HStack {
        ZStack(alignment: .topLeading) {
                    VStack {
                        Text("Contributions")
                            .frame(width: 180, height: textHeight, alignment: .center)
                            .background(Color.POI.blue)
                            .cornerRadius(textHeight / 2)
                        Text("Earnings")
                            .frame(width: 150, alignment: .center)
                            .cornerRadius(dimensions.cornerRadiusLarge)
                        Spacer()
                    }
                .multilineTextAlignment(.center)
            }
        // Rest of the graph
        Spacer()
      }