react-native-picker-select icon indicating copy to clipboard operation
react-native-picker-select copied to clipboard

how to dim the background screen when the picker shows

Open saaspeter opened this issue 1 year ago • 1 comments

Hi: I want to know how to dim the background screen when the picker shows, below is the details, thanks!

Is your feature request related to a problem? Please describe.
Yes, It seems no built-in way to customize the background screen opacity when the react-native-picker-select modal is open on iOS. This leads to a lack of visual distinction between the active picker and the underlying app content, potentially hindering user experience and focus. (e.g: most date-picker will dim the background screen to highlight the picker)

Describe the solution you'd like
By default, when the picker shows the backend screen should become dim, like other date-pickers. However maybe the user can turnoff this effect by some a property.

Describe alternatives you've considered
I am not sure whether it can be achieved in "modalProps"? maybe some property like: Opacity

Additional details
Add any other details or screenshots about the feature request here.

saaspeter avatar May 21 '24 03:05 saaspeter

This seems to do something:

      modalProps={{
        transparent: false,
        backdropColor: 'rgba(50, 74, 107, 0.78)',
      }}

However my Picker is inside a Modal, and when I add those properties, the Picker drawer mysteriously dismisses the modal. Posting here in case someone finds it useful for a scenario unlike mine.

jforaker avatar Jul 30 '25 02:07 jforaker