borderColor, overlayColor don't work with platformColor on android.

[a-eid]

Description

when trying to using PlatformColor api with borderColor or overlayColor, they don't work

Error while updating property borderColor of a view managed by: RCTView
com.facebook.react.bridge.ReadableNativeMap cannot be case to java.lang.integer

Warning: Failed prop type: Invalid prop `overlayColor` of type `object` supplied to `Image`, expected `string`.
Bad object: {
  "width": 100,
  "height": 100,
  "overlayColor": {
    "resource_paths": [
      "?attr/colorPrimary"
    ]
  }
}

Version

67.1

Output of npx react-native info

System:
OS: macOS 11.6.1
CPU: (8) x64 Intel(R) Core(TM) i7-4770 CPU @ 3.40GHz
Memory: 2.21 GB / 32.00 GB
Shell: 5.8 - /bin/zsh
Binaries:
Node: 16.13.1 - /usr/local/bin/node
Yarn: 1.22.15 - ~/.yarn/bin/yarn
npm: 8.1.2 - ~/n/bin/npm
Watchman: 2022.01.03.00 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.11.2 - /Users/ahmedelshentenawy/.rvm/gems/ruby-2.7.4/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 21.0.1, iOS 15.0, macOS 12.0, tvOS 15.0, watchOS 8.0
Android SDK:
API Levels: 28, 29, 30, 31
Build Tools: 28.0.3, 29.0.2, 29.0.3, 30.0.2, 31.0.0
System Images: android-29 | Google APIs Intel x86 Atom, android-29 | Google Play Intel x86 Atom
Android NDK: Not Found
IDEs:
Android Studio: Arctic Fox 2020.3.1 Patch 4 Arctic Fox 2020.3.1 Patch 4
Xcode: 13.1/13A1030d - /usr/bin/xcodebuild
Languages:
Java: 1.8.0_292 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 17.0.2 => 17.0.2
react-native: 0.67.1 => 0.67.1
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

• provider a platformColor to either borderColor or shadowColor properties
• run the app on android

<View style={{
borderColor:
  Platform.OS == 'android' ? PlatformColor('?attr/colorPrimary') : 'blue' 
}} />


<Image
  source={{
    uri: 'https://source.unsplash.com/user/c_v_r/1900x800',
  }}
  style={{
    width: 100,
    height: 100,
    overlayColor:
      Platform.OS == 'android'
        ? PlatformColor('?attr/colorPrimary')
        : 'blue',
  }}
/>

Snack, code example, screenshot, or link to a repository

https://github.com/a-eid/platformColorIssueAndorid2

[kelset]

Hey @a-eid, is this a regression? as in, before upgrading to 0.67 it was fine?

[a-eid]

Hey @a-eid, is this a regression? as in, before upgrading to 0.67 it was fine?

No it's not a regression

[kelset]

ok so it was present even in earlier versions than 0.67?

[a-eid]

ok so it was present even in earlier versions than 0.67?

Yes.

[Gregoirevda]

PlatformColor is also not accepted in StatusBar backgroundColor prop for Android:
<StatusBar backgroundColor={PlatformColor('?attr/surfaceColor')} />

backgroundColor defaults to ?attr/colorPrimaryDark, so changing the value for it in styles.xml without specifying it in JS works, but when updating the phone's light/dark mode it's not being updated (event without uiMode)

[github-actions]

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

[a-eid]

still an issue as of version 0.70.

[danilobuerger]

@a-eid did you see my PR? It should fix your issue.