列表上下文中 SwiftUI 按钮的样式差异：iOS 15 与更早版本

Question

With this example:

struct ContentView: View {
    let items = ["Hello, world!"]
    var body: some View {
        List {
            Button(action: {
            }, label: {
                Text("Hello, world!")
            })
            .listRowBackground(Color.gray)
        }
    }
}

on iOS 14, this looks like:

on iOS 15, it now looks like:

It is rather surprising the number of styling differences:

1. The corner rounding: In iOS 15, but not earlier
2. The text color: In iOS 15, blue and white earlier.
3. The width of the view-- considerably narrower in iOS 15

Is this just an expected change with iOS 15?

Is there a standard way to not have these changes occur? Ie, to retain the earlier styling?

Answer 1

Yes, Apple has changed its default UI elements states. This can also be seen in Safari where webpages have no CSS for forms.

Answer 2

The specific answer that helped me was the use of .listStyle . In my original code, I didn't use .listStyle , and apparently the default has changed. So, if I do:

struct ContentView: View {
    let items = ["Hello, world!"]
    var body: some View {
        List {
            Button(action: {
            }, label: {
                Text("Hello, world!")
            })
            .listRowBackground(Color.gray)
        }
        .listStyle(PlainListStyle())
    }
}

I get a result closer to what I want.

Apparently the .listStyle default is now insetGrouped , which is not what I wanted.