SwiftUI：多個 LazyVGrid 奇怪的滾動

Question

我在使用下面的代碼時遇到問題，我無法解釋。 上下滾動時，它似乎工作得很好。 當您嘗試旋轉它時，它似乎會卡住並且無法使用舊的重復使用的單元格（在屏幕上留下大間隙，只能通過向上滾動來修復）

還有其他人遇到過這種行為嗎？

struct Item: Identifiable {
    let id: UUID = UUID()
    let title: String
    let description: String
    let teaser: String
}

struct BasicCell: View {

    let item: Item

    var body: some View {
        VStack(alignment: .leading, spacing: 0) {
            Color(.gray)
                .cornerRadius(4)
                .aspectRatio(CGSize(width: 361, height: 217), contentMode: .fit)
            Text(item.title)
                .padding(.top, 12)
                .foregroundColor(.red)
            Text(item.description)
                .padding(.top, 8)
            Text(item.teaser)
                .fixedSize(horizontal: false, vertical: true)
                .padding(.top, 10)
            Spacer()
        }
    }
}

struct ThreeGridLarge: View {

    let header: String
    let items: [Item]

    var columns: [GridItem] {
        [
            GridItem(.adaptive(minimum: 217), spacing: 24, alignment: .leading),
            GridItem(.adaptive(minimum: 217), spacing: 24, alignment: .leading),
            GridItem(.adaptive(minimum: 217), spacing: 24, alignment: .leading)
        ]
    }

    var body: some View {
        LazyVGrid(columns: columns, alignment: .leading, spacing: 16) {
            ForEach(items, id: \.id) { item in
                BasicCell(item: item)
            }
        }
    }
}

struct GridView: View {
    var body: some View {
        ScrollView {
            Group {
                ThreeGridLarge(header: "", items: [
                    Item(title: "GEMEENTERAADSVERKIEZINGEN", description: "Diefstal, bedreiging, geruïneerde zakenpartners: de twee gezichten van ondernemer Willem Blijdorp", teaser: "Willem Blijdorp is een mediaschuwe, maar gevierde ondernemer die geroemd wordt om zijn successen. Geruïneerde ex-zakenpartners vertellen een ander verhaal. „Ik voel me zakelijk vermoord door Blijdorp.”"),
                    Item(title: "MEDIA", description: "Rechter verbiedt uitzending EenVandaag", teaser: "De zitting vond achter gesloten deuren plaats. Zowel de orde van advocaten als EenVandaag mogen geen mededelingen doen over de inhoud van de zaak."),
                    Item(title: "ZWARE MISHANDELING", description: "Lil Kleine opnieuw vast na beroep OM tegen vrijlating", teaser: "Rapper Lil Kleine wordt verdacht van zware mishandeling. Hij kwam twee weken geleden vrij. Het OM zag voldoende „ernstige bezwaren” om hem langer vast te houden en in dat oordeel ging de rechtbank vandaag mee."),
                ])
                .padding(.top, 45)
                ThreeGridLarge(header: "", items: [
                    Item(title: "GEMEENTERAADSVERKIEZINGEN", description: "Diefstal, bedreiging, geruïneerde zakenpartners: de twee gezichten van ondernemer Willem Blijdorp", teaser: "Willem Blijdorp is een mediaschuwe, maar gevierde ondernemer die geroemd wordt om zijn successen. Geruïneerde ex-zakenpartners vertellen een ander verhaal. „Ik voel me zakelijk vermoord door Blijdorp.”"),
                    Item(title: "MEDIA", description: "Rechter verbiedt uitzending EenVandaag", teaser: "De zitting vond achter gesloten deuren plaats. Zowel de orde van advocaten als EenVandaag mogen geen mededelingen doen over de inhoud van de zaak."),
                    Item(title: "ZWARE MISHANDELING", description: "Lil Kleine opnieuw vast na beroep OM tegen vrijlating", teaser: "Rapper Lil Kleine wordt verdacht van zware mishandeling. Hij kwam twee weken geleden vrij. Het OM zag voldoende „ernstige bezwaren” om hem langer vast te houden en in dat oordeel ging de rechtbank vandaag mee."),
                ])
                .padding(.top, 45)
            }
            .padding(.horizontal, 24)
        }
    }
}

Answer 1

找不到允許我使用ScrollView交換到List的解決方案，並應用了很多修復程序以使其看起來像一個普通的滾動視圖。