Picker (wheel style) value selection point (drag area) is offset from the frame.

I am experiencing a problem with Xcode 13 Beta 5 iOS 15 for the value Picker using the Wheel Style. The WheelPicker is in a frame displaying the current value, however the drag area to select a new value is offset from the area on the displayed values.

In fact I have 3 WheelPickers to select 3 values. The left-most picker has the drag area offset to the left of it, and the right-most picker has the drag area offset to the right of it. The middle-picker cannot even select a value. To me it suggests overlapping drag-areas, where the overlapped areas prevent the selection of a value. In addition I am seeing a '[SwiftUI] Invalid frame dimension (negative or non-finite).' error in the console.

Has anyone else experienced this, and therefore may know what to do?

As a note this does not happen with Xcode 12.5.1 iOS 14.5. It works fine in that case.

Further in Xcode13 beta 5 I tried setting breakpoints to catch the code calls, but they are also not working - but that is another problem.

Answered by Greenamberred in 689550022

Having contacted technical support, they have confirmed that it appears to be a regression / bug in iOS 15. I look forward to the Apple bug-fix soon, and in the meantime there is a workaround.

The workaround is, as mentioned in similar questions on this forum, to add a view modifier, in my case to the Hstacks that contained my pickers.

 .compositingGroup()

As my pickers were also part of a '.popover' view, I in addition had to add the view modifier to the frame used in the popover view. So in my case it needed adding to both views (Hstack and popover).

I noticed the same behavior and furthermore since iOS13 beta 5 my App crashes when I display two pickers in one list and try to select value from the second one. Any idea why?

View to reproduce:

struct ContentView: View {

    @State private var selected1 = 0

    @State private var selected2 = 0

    

    @State private var showPicker1 = false

    @State private var showPicker2 = false

    

    var body: some View {

        NavigationView {

            List {

                HStack {

                Text("Picker 1")

                Spacer()

                    Text("\(selected1)").foregroundColor(.secondary)

                }

                .onTapGesture {

                    withAnimation {

                    self.showPicker1.toggle()

                    }

                }

                

                if showPicker1 {

                Picker("", selection: $selected1) {

                    ForEach(1..<5) { idx in

                        Text("\(idx)").tag(idx)

                    }

                }

                .pickerStyle(.wheel)

                .clipped()

                }

                

                

                HStack {

                Text("Picker 2")

                Spacer()

                    Text("\(selected2)").foregroundColor(.secondary)

                }

                .onTapGesture {

                    withAnimation {

                    self.showPicker2.toggle()

                    }

                }

                

                if showPicker2 {

                Picker("", selection: $selected2) {

                    ForEach(1..<15) { idx in

                        Text("\(idx)").tag(idx)

                    }

                    

                }

                .pickerStyle(.wheel)

                .clipped()

                }

            }

            .listStyle(.inset)

            .navigationTitle("Picker")

        }

        

    }

}

Update : This also happens with the release version of Xcode 13.

Should have said it was SwiftUI. Could you also show your full code ? Maybe you have unproperly used some modifiers.

Accepted Answer

Having contacted technical support, they have confirmed that it appears to be a regression / bug in iOS 15. I look forward to the Apple bug-fix soon, and in the meantime there is a workaround.

The workaround is, as mentioned in similar questions on this forum, to add a view modifier, in my case to the Hstacks that contained my pickers.

 .compositingGroup()

As my pickers were also part of a '.popover' view, I in addition had to add the view modifier to the frame used in the popover view. So in my case it needed adding to both views (Hstack and popover).