How to set segmented picker style to use the full width in iOS 17?

Before iOS 17 beta, the .pickerStyle(.segmented) modifier makes the Picker take up the entire available width in a toolbar. In iOS 17, it tightly fits the width of the text.

I can use .fixedSize() modifier to make the segmented control tightly fit the content. In reverse, what is the recommended way to make it expand to fill the whole width?

In iOS 17 beta, I tried .frame(idealWidth: UIScreen.main.bounds.width) and it works, but it doesn't have effect in iOS 16 and prior. Also, it is semantically wrong to set the ideal width to an arbitrary big value.

Example:

iOS 16, fulliOS 17, tight

Replies

You could always use an arbitrary biggish value, say: .frame(idealWidth: UIScreen.main.bounds.width * 0.9)

Are there any changes in the documentation for the segmented control between iOS 16 and 17? It might be that you have to apply some other modifier to it now.

You should be able to use:

https://developer.apple.com/documentation/swiftui/view/fixedsize(horizontal:vertical:)

with the horizontal parameter set to false.

You should be able to use: https://developer.apple.com/documentation/swiftui/view/fixedsize(horizontal:vertical:) with the horizontal parameter set to false.

@Polyphonic Before I made this post, I've tried the fixedSize(horizontal:vertical:) modifier out on Xcode 15.0 beta 6 (15A5219j), and it has no effect, which was kind of unexpected. The segmented control is still tight on iOS 17 after it is applied.

Here is the snippet where I want the segmented control to behave consistently among iOS 15, 16 and 17.

.toolbar {
    ToolbarItem(placement: .principal) {
        Picker("Information Mode", selection: $informationMode) {
            ForEach(InformationMode.allCases, id: \.self) { mode in
                Text(mode.label)
            }
        }
        .pickerStyle(.segmented)
        // .fixedSize(horizontal: true, vertical: false)  // has no effect on iOS 17
    }
}