SwiftUI 列表中某些行的布局問題

Question

我試圖找到以前問過的類似問題，但失敗了。

我有一個簡單的列表視圖。 我正在使用 ForEach 顯示某個列表項的 10 次迭代以創建布局，然后再將實際數據添加到此列表中。 我有最后 2 行無法正確呈現的問題。 但有時它是另一排。 我也在 iPhone 上測試過，有時是一排，有時是另一排。 帶有列表的視圖的代碼是這樣的：

import SwiftUI

struct LocksView: View {

    @State private var locksPaid = 0

    var body: some View {
        NavigationView {
            List {
                DateView()
                    .listRowInsets(EdgeInsets())

                Picker(selection: $locksPaid, label: Text("Picker")) {
                    Text("All").tag(0)
                    Text("Not paid (2)").tag(1)
                }
                .pickerStyle(SegmentedPickerStyle())
                .padding(10)

                ForEach(0 ..< 10) {item in
                    LocksItemView()
                }

            }
            .navigationBarTitle(Text("Locks"))
            .navigationBarItems(trailing: EditButton())
        }
    }
}

列表項的代碼是這樣的：

import SwiftUI

struct LocksItemView: View {

    @State private var paid : Bool = false

    var body: some View {
        HStack {

            Text("L15")
                .font(.title)
                .fontWeight(.heavy)
                .multilineTextAlignment(.center)
                .frame(width: 80)

            VStack(alignment: .leading) {
                Text("nickname")
                    .fontWeight(.bold)
                Text("category")
                Text("4 000 THB")
                    .fontWeight(.bold)
            }

            Spacer()

            Toggle(isOn: self.$paid) {
                Text("Paid")
            }
            .labelsHidden()
        }
    }
}

為什么切換在我的列表中的某些行中斷開？ 為什么會向左移動？

Answer 1

這不是最后的項目。 如果您將ForEach設置為 20 而不是 10 並上下滾動，您會看到更有趣的問題。

我假設原因，實際上是List錯誤，與本主題中的相同。

解決方法如果它對您不重要，則使用ScrollView而不是List ，經測試，它沒有錯誤。 否則，提交雷達並等待修復。

Answer 2

我首先在模擬器上嘗試了你的代碼，也遇到了同樣的問題。 但后來我記得，13.2 iOS 存在一些問題，並嘗試在我的設備上運行它（iPhone 7，iOS 13.1.1），一切正常。 我認為這是 13,2 iOS 中的問題。 不在列表中，有示例：我如何更改代碼以證明一切正常：

import SwiftUI

struct LocksView: View {
    
    @State private var locksPaid = 0

    var body: some View {
        NavigationView {
            List {
                Picker(selection: $locksPaid, label: Text("Picker")) {
                    Text("All").tag(0)
                    Text("Not paid (2)").tag(1)
                }
                .pickerStyle(SegmentedPickerStyle())
                .padding(10)

                ForEach(0 ..< 200) {item in
                    LocksItemView(number: item)
                }

            }
            .navigationBarTitle(Text("Locks"))
            .navigationBarItems(trailing: EditButton())
        }
    }
}

struct LocksItemView: View {

    @State private var paid : Bool = false
    var number: Int

    var body: some View {
        HStack {

            Text("L\(self.number)")
                .font(.title)
                .fontWeight(.heavy)
                .multilineTextAlignment(.center)
                .frame(width: 80)

            VStack(alignment: .leading) {
                Text("nickname")
                    .fontWeight(.bold)
                Text("category")
                Text("4 000 THB")
                    .fontWeight(.bold)
            }

            Spacer()

            Toggle(isOn: self.$paid) {
                Text("Paid")
            }
            .labelsHidden()
        }
    }
}

在我的手機上，結果是：

所以在 13.2 版本中存在錯誤，我希望 Apple 將它們全部修復