EDIT: Apologies for the incredibly large images 😅

Hi there!

I am trying to get two HStacks to be the same size where one of them dictates the size. This works, initially, but there's a bug that I just can't seem to find a solution to. It's easier to demonstrate this using the design of what I'm trying to achieve:

Then when you swipe, depending on left or right, this is what will show up:

In order to get that to work I have a VStack with a List view that renders out this card view:

@State private var cardDimension = CGSize.zero

var body: some View {
    ZStack {

        // This HStack is for the swipe action markers
        HStack {...}
          .frame(width: cardDimension.width, height: cardDimension.height)

        // This HStack has the content and dictates the size
        HStack {...}
          .background(
              GeometryReader { geo in
                  Text("")
                      .onAppear(perform: {
                          self.cardDimension = geo.size
                  })
              }
          )
    }
}

This works and has the desired result, as you could see in the first image. However, here's where things get interesting. When I add a new view to the parent view of the VStack that has the card views, this is what happens:

NavigationView {
    ZStack {
        Color("backgroundPrimary")
            .ignoresSafeArea(.all)

        // This VStack has the List view with all the Card views
        VStack {...}

        // Adding this VStack causes the geometryreader for the background of the first card in the previous VStack to go crazy.
        VStack {...}
    }
    .navigationTitle(Text("My wishlist"))
}

Without the second VStack, which contains the button, everything works as expected. When adding the button, suddenly the HStack no longer calculates it's width and height properly.

The strangest thing about this all is that it's only the first Card view where this happens. Everything after the first renders out as expected.

I've tried using PreferenceKeys instead, no luck there. I'm a bit lost now and I can't seem to figure this out. Any help would be much appreciated!

After weeks of trial and error I ended up finding a solution myself! The onAppear() runs, obviously, as soon as the view appears. This is, however, too fast. Adding a 0.01s delay using DispatchQueue like so:

DispatchQueue.main.asyncAfter(deadline: .now() + 0.01) {...}

There's probably better solutions out there, but this definitely works!