Toggle in List collapses

Has anyone else seen a Toggle collapse in a List when it scrolls? iOS 13.2.3 and XCode 11.2.1. This UI makes it impossible for a user to turn on or off the Toggle.


Here's what it looks like after scrolling:

Here is the code:


import SwiftUI

struct ContentView: View {
    
    @State private var TestListData = ["Item-1", "Item-2", "Item-3", "Item-4", "Item-5", "Item-6", "Item-7", "Item-8", "Item-9", "Item-10", "Item-11", "Item-12", "Item-13", "Item-14", "Item-15", "Item-16", "Item-17", "Item-18", "Item-19", "Item-20", "Item-21", "Item-22", "Item-23", "Item-24", "Item-25", "Item-26"]
    
    var body: some View {
        List(self.TestListData, id: (\.self)) { item in
            RowView(itemName: item)
        }
        .padding()
    }
}

struct RowView: View {
    
    @State private var isSelected = false
    let itemName: String
    
    var body: some View {
        Toggle(isOn: $isSelected) {
            Text(itemName)
        }
    }
    
}

Am I doing something wrong or should I send Apple a bug?


Thanks.

Replies

Oh dear, that doesn't look good. For the record, I'm seeing the toggle buttons suddenly become left aligned after scrolled offscreen and back on, such that it overlaps the titles. This doesn't happen for everything, but happens in the majority of cases. The toggle buttons that are misplaced are also top-aligned, which suggests they're being laid out inside a row that has zero bounds.


Definitely file a bug on this one.

I cannot test it because Xcode 11.2.1 stays stuck endlessly on Preparing debugger support for my iPhone SE with iOS 13.2.3. The same Xcode version does not have any problems on my iPad Air 2 with iPadOS 13.2.3.