Search code examples
iosswiftuibehaviorautosizeapple-documentation

Why controlSize property is not working in SwiftUI?

https://developer.apple.com/documentation/swiftui/view/controlsize(_:)

Even the code on apple's official document site is not working

struct ControlSize: View {
    var body: some View {
        VStack {
            MyControls(label: "Mini")
                .controlSize(.mini)
            MyControls(label: "Small")
                .controlSize(.small)
            MyControls(label: "Regular")
                .controlSize(.regular)
        }
        .padding()
        .frame(width: 450)
        .border(Color.gray)
    }
}


struct MyControls: View {
    var label: String
    @State private var value = 3.0
    @State private var selected = 1
    var body: some View {
        HStack {
            Text(label + ":")
            Picker("Selection", selection: $selected) {
                Text("option 1").tag(1)
                Text("option 2").tag(2)
                Text("option 3").tag(3)
            }
            Slider(value: $value, in: 1...10)
            Button("OK") { }
        }
    }
}

See, the output should look like this, mini, small and regular sizes are reflecting in their document's screenshot, but it's not actually working.

This image tells us how the preview should look like

Please tell me, is this a bug or am i missing something, please don't provide workaround i want to know the actual solution if it's not a bug by apple.

Devices checked:

  1. iOS (16+) iPhoneX, real device.
  2. iOS (17+) iPhone 15, simulator.
  3. iOS (17+) iPad (10th generation), simulator.

Xcode Version:

  • Version 15.3
Solution

  • Not all controls respond to controlSize the same way - some controls may ignore it completely. Nothing is guaranteed to be affected by controlSize. When the documentation says "iOS 15+", it just means that your code using that API will compile when targeting those versions. It doesn't promise anything about what it does, which can very well change between versions.

    This is also platform-dependent. The screenshot in the documentation is clearly running on macOS, and I can indeed reproduce that behaviour.

    On iOS and Mac Catalyst, only buttons are affected.

    iOS:

    enter image description here

    Mac Catalyst:

    enter image description here

    The buttons are slightly smaller with the .mini and .small sizes, compared to .regular.

    Side note: you can make your own views respond to controlSize by reading the controlSize environment value:

    @Environment(\.controlSize) var controlSize