ScrollView 中的 SwiftUI 列表

Question

我想將我的 List 放在 ScrollView 中，以便我可以一起滾動 List 行和標題。 但是我發現 ScrollView 中的 List 不起作用。 它什么也沒顯示。 任何人都知道為什么會發生這種情況和（或）如何解決？

我應該同時使用它們。

• 我應該使用 ScrollView 以便在滾動行時也可以滾動標題（圖像或文本）。
• 我應該使用 List 來使用 .ondelete() 方法。

我的示例代碼如下。

@State private var numbers = [1,2,3,4,5,6,7,8,9]

var body: some View {
    ScrollView {
        Text("header")
        List {
            ForEach(numbers, id: \.self) {
                Text("\($0)")
            }
            .onDelete { index in
                // delete item
            }
        }
    }
}

Answer 1

當列表使用全屏時，這是可能的但不是。

在代碼示例中，我使用 GeometryReader 使列表盡可能大。 但是您也可以刪除 GeometryReader 並將固定尺寸插入 .frame()

 struct ContentView: View {
    
    @State private var numbers = [1,2,3,4,5,6,7,8,9]
    
    var body: some View {
        GeometryReader { g in
            ScrollView {
                Text("header")
                List {
                    ForEach(self.numbers, id: \.self) {
                        Text("\($0)")
                    }
                    .onDelete { index in
                        // delete item
                    }
                }.frame(width: g.size.width - 5, height: g.size.height - 50, alignment: .center)
            }
        }
    }
}

Answer 2

不需要兩個滾動對象，您也可以為此使用部分

    @State private var numbers = [1,2,3,4,5,6,7,8,9]

    var body: some View {
        List {
            Section.init {
                Text("Header")
            }
            ForEach(numbers, id: \.self) {
                Text("\($0)")
            }
            .onDelete { index in
                // delete item
            }
        }
    }

Answer 3

只需將標題放在列表中，例如

var body: some View {
    List {
        Text("Header").font(.title)
        ForEach(numbers, id: \.self) {
            Text("\($0)")
        }
        .onDelete { index in
            // delete item
        }
    }
}