SWIFTUI - Picker view touch/scroll-able area is still out of frame even after using clipped()

user_11692675 0
Viewed 1010

SWIFTUI I have a picker view(wheel type) and I clipped() its frame to half width of the screen, and from the UI you can see its half but the scrollable area is still actionable outside that frame. How can I remove that outer area to not be scrollable?

HStack(spacing: 0) {
    Picker(selection: self.$viewModel.selectedFrameworkIndex, label: Text("")) {
    ForEach(0 ..< viewModel.Categories.count) {
        Text(self.viewModel.Categories[$0])
            .foregroundColor((self.colorScheme == .dark) ? Color.white : Color.black)
         }
    }
    .frame(width: width / 2) // width is width of my screen
    .clipped() 
}
swiftui
3 Answers

Add .compositingGroup() after .clipped()

HStack(spacing: 0) {
Picker(selection: self.$viewModel.selectedFrameworkIndex, label: Text("")) {
ForEach(0 ..< viewModel.Categories.count) {
    Text(self.viewModel.Categories[$0])
        .foregroundColor((self.colorScheme == .dark) ? Color.white : Color.black)
     }
}
.frame(width: width / 2) // width is width of my screen
.clipped() 
.compositingGroup()  }
user_121370300

Adding this extension worked for me:

extension UIPickerView {
    open override var intrinsicContentSize: CGSize {
        return CGSize(width: UIView.noIntrinsicMetric, height: super.intrinsicContentSize.height)
    }
}
user_102619680
user_193126660
Related