SwiftUI ZStack 第一個元素不顯示

Question

我是 SwiftUI 的新手，我有一個帶有 ZStack 的簡單應用程序：

struct ContentView: View {
    @State var num : Int = 1
    
    var body: some View {
        NavigationView{
            ZStack{
                Text("asd")
                    .foregroundColor(.blue)
                    .frame(width: 400, height: 400, alignment: .center)
                    .background(.blue)
                VStack{
                    List{
                        ListItem()
                        ListItem()
                    }
                }
                .toolbar{
                    Button{
                        num+=1
                    } label: {
                        Label("Add", systemImage: "plus")
                    }
                }
            }
        }
    }
}

問題是沒有顯示帶有文本的藍框：

為什么會這樣？

Answer 1

您正在使用 ZStack 來總結所有內容。

解決方案：從 ZStack 更改為 VStack。

NavigationView{
        VStack{ //this part

Answer 2

這是因為Text View在ZStack中的List下面。

如果將文本移動到列表之后，它將顯示在頂部。

ZStack {
    VStack{
        List {
            ListItem()
            ListItem()
        }
        .listStyle(.insetGrouped)
    }
    .toolbar{
        Button{
            num+=1
        } label: {
            Label("Add", systemImage: "plus")
        }
    }
    
    Text("asd")
        .foregroundColor(.blue)
        .frame(width: 400, height: 400, alignment: .center)
        .background(.blue)
}