Skip to content

Using rgba with alpha in backgroundColor causes text to be highlighted #388

Open
@Ashutosh-Tiwari

Description

@Ashutosh-Tiwari

Describe the bug

As mentioned in issues #79 #80, I too am facing the same exact issue. It basically appears only on an iOS device and that too when I set the styling property backgroundColor to use a rgba method with some alpha and not a normal hex starting with a #

To Reproduce

  1. Go to the screen in your demo's App.js that has a style named pickerSelectStyles
  2. Change backgroundColor property to use rgba method with some alpha value, for example:
    backgroundColor: "rgba(255, 255, 255, 0.6)"
  3. Save the change
  4. See the buggy output (only in iOS simulator/device)

Expected behavior

image

[Note: You can ignore other styling props that I have set like bottom border, font family, arrow icon, etc]

Screenshots

image

Additional details

  • Device: [iPhone (any)]
  • OS: [N/A]
  • react-native-picker-select version: [^7.0.0]
  • react-native version: [https://github.com/expo/react-native/archive/sdk-37.0.1.tar.gz]
  • expo sdk version: [~37.0.3]

Reproduction and/or code sample

https://snack.expo.io/@astiwari/react-native-picker-select
[Note: The behavior of the plugin looks very different than its actual output. Snack seems a little buggy as it doesn't even properly depict the colors that I have used]

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions