ios – Cant change zIndex of LazyVGrid component to convey it to the entrance with animation

I’ve the next instance view with no zIndex modifications. At the moment, when choosing a grid merchandise, it should animate to the middle of the display screen. Nonetheless, this doesn’t change zIndex and gadgets will keep under others.

I attempted including ZStacks to numerous elements of the code, with a .zIndex() on the Rectangle, none of which labored.

The closest i received to a repair:
including .id() of the chosen merchandise to the LazyVGrid, with a .zindex conditionally setting it on the GeometryReader. Whereas this units hierarchy correctly, every time an merchandise is chosen, your complete grid flashes and there’s no animating the merchandise from its grid place to the middle.

struct SwiftUIView: View {
    let colours: [Color] = [.red, .blue, .green, .yellow, .purple, .orange]
    let columns = [GridItem(.flexible()), GridItem(.flexible())]
    
    @State non-public var selectedItem: Int? = nil
    @State non-public var selectedItemPosition: CGRect? = nil

    var physique: some View {
        GeometryReader { screenGeometry in
            LazyVGrid(columns: columns, spacing: 20) {
                ForEach(colours.indices, id: .self) { index in
                    GeometryReader { geometry in
                        let isSelected = selectedItem == index
                        
                        Rectangle()
                            .fill(colours[index])
                            .cornerRadius(12)
                            .body(width: 150, top: 200)
                            .shadow(radius: isSelected ? 10 : 0)
                            .onTapGesture {
                                withAnimation(.spring(response: 0.5, dampingFraction: 0.7)) {
                                    if isSelected {
                                        selectedItem = nil
                                        selectedItemPosition = nil
                                    } else {
                                        selectedItem = index
                                        selectedItemPosition = geometry.body(in: .international)
                                    }
                                }
                            }
                            .offset(
                                x: isSelected ? (screenGeometry.dimension.width / 2 - geometry.body(in: .international).midX) : 0,
                                y: isSelected ? (screenGeometry.dimension.top / 2 - geometry.body(in: .international).midY) : 0
                            )
                    }
                    .body(top: 200) // Wanted to make sure GeometryReader doesn't shrink
                }
            }
            .padding()
        }
    }
}