SwiftUI将堆栈元素置于前台

Question

我想在我的应用程序中使用一个拖放功能，但是仍然有一个问题，那就是我不知道如何将第一个VStack元素带到前台。感谢每一个帮助。

import SwiftUI

struct GameView: View {
@State private var text = "Element to be in foreground"
@State private var offset = CGSize.zero

var body: some View {
    HStack(){
        VStack(){
            Text(text)
        }
        .frame(maxWidth: 100)
        .frame(height: 100)
        .background(LinearGradient(gradient: Gradient(colors: [Color(#colorLiteral(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0)), Color(#colorLiteral(red: 0.2392156869, green: 0.6745098233, blue: 0.9686274529, alpha: 1))]), startPoint: .top, endPoint: .bottom))
        .clipShape(RoundedRectangle(cornerRadius: 30, style: .continuous))
        .shadow(color: Color.black.opacity(0.2), radius: 20, x: 0, y: 20)
        .contentShape(Rectangle())
        .offset(y: offset.height)
        .offset(x: offset.width)
        .gesture(DragGesture()
                .onChanged { val in
                    self.offset = val.translation
                }
                .onEnded { val in
                    self.offset = .zero
                }
        )
        VStack(){
            Text("Text which is currently in foreground")
        }
    }
}
}

struct GameView_Previews: PreviewProvider {
    static var previews: some View {
        GameView()
        }
 }

Answer 1

一个容器中视图的顺序可以通过 （默认情况下为零）来更改，如

var body: some View {
    HStack(){
        VStack(){
            Text(text)
        }
        .frame(maxWidth: 100)
        .frame(height: 100)
        .background(LinearGradient(gradient: Gradient(colors: [Color(#colorLiteral(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0)), Color(#colorLiteral(red: 0.2392156869, green: 0.6745098233, blue: 0.9686274529, alpha: 1))]), startPoint: .top, endPoint: .bottom))
        .clipShape(RoundedRectangle(cornerRadius: 30, style: .continuous))
        .shadow(color: Color.black.opacity(0.2), radius: 20, x: 0, y: 20)
        .contentShape(Rectangle())
        .offset(y: offset.height)
        .offset(x: offset.width)
        .gesture(DragGesture()
                .onChanged { val in
                    self.offset = val.translation
                }
                .onEnded { val in
                    self.offset = .zero
                }
        )
        .zIndex(1)         // << here !!

        VStack(){
            Text("Text which is currently in foreground")
        }
    }
}