-
Notifications
You must be signed in to change notification settings - Fork 24.9k
Closed
Labels
Issue: Author Provided ReproThis issue can be reproduced in Snack or an attached project.This issue can be reproduced in Snack or an attached project.Platform: AndroidAndroid applications.Android applications.Resolution: FixedA PR that fixes this issue has been merged.A PR that fixes this issue has been merged.
Description
Description
If you try to apply the next styles on Android app will crash with the next error:
"Error while updating property 'border TopColor' of a view managed by: RCTView"
Platform.select({
ios: {
borderTopColor: PlatformColor("systemTealColor"),
borderRightColor: PlatformColor('systemTealColor'),
borderLeftColor: PlatformColor('systemTealColor'),
borderBottomColor: PlatformColor('systemTealColor'),
},
android: {
borderTopColor: PlatformColor('@android:color/holo_blue_bright'),
borderRightColor: PlatformColor('@android:color/holo_blue_bright'),
borderLeftColor: PlatformColor('@android:color/holo_blue_bright'),
borderBottomColor: PlatformColor('@android:color/holo_blue_bright'),
}
})
React Native Version
0.72.3
Output of npx react-native info
System:
OS: macOS 13.4.1
CPU: (10) arm64 Apple M1 Pro
Memory: 413.83 MB / 32.00 GB
Shell:
version: 3.6.1
path: /opt/homebrew/bin/fish
Binaries:
Node:
version: 20.4.0
path: /opt/homebrew/bin/node
Yarn:
version: 1.22.19
path: /opt/homebrew/bin/yarn
npm:
version: 9.7.2
path: /opt/homebrew/bin/npm
Watchman:
version: 2023.07.10.00
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.12.1
path: /opt/homebrew/bin/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 22.4
- iOS 16.4
- macOS 13.3
- tvOS 16.4
- watchOS 9.4
Android SDK:
API Levels:
- "33"
Build Tools:
- 30.0.3
- 34.0.0
System Images:
- android-33 | Google APIs ARM 64 v8a
- android-33 | Google Play ARM 64 v8a
Android NDK: Not Found
IDEs:
Android Studio: Flamingo 2022.2.1 Patch 2 Flamingo 2022.2.1 Patch 2
Xcode:
version: 14.3.1/14E300c
path: /usr/bin/xcodebuild
Languages:
Java:
version: 11.0.19
path: /usr/bin/javac
Ruby:
version: 2.6.10
path: /usr/bin/ruby
npmPackages:
"@react-native-community/cli": Not Found
react:
installed: 18.2.0
wanted: 18.2.0
react-native:
installed: 0.72.3
wanted: 0.72.3
react-native-macos: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: true
newArchEnabled: false
iOS:
hermesEnabled: true
newArchEnabled: false
Steps to reproduce
Create a new project and put the next code to App.tsx
import { Platform, PlatformColor, View, StyleSheet } from 'react-native';
export default function App() {
return (
<View style={styles.container}>
<View style={styles.androidIssue} />
<View style={styles.test1} />
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
backgroundColor: 'white',
padding: 8,
},
test1: {
...Platform.select({
ios: {
backgroundColor: PlatformColor('systemTealColor'),
},
android: {
backgroundColor: PlatformColor('@android:color/holo_blue_bright'),
},
}),
width: 100,
height: 100,
marginTop: 20,
},
androidIssue: {
backgroundColor: 'gold',
width: 100,
height: 100,
borderWidth: 20,
...Platform.select({
ios: {
borderTopColor: PlatformColor('systemTealColor'),
borderRightColor: PlatformColor('systemTealColor'),
borderLeftColor: PlatformColor('systemTealColor'),
borderBottomColor: PlatformColor('systemTealColor'),
},
android: {
borderTopColor: PlatformColor('@android:color/holo_blue_bright'),
borderRightColor: PlatformColor('@android:color/holo_blue_bright'),
borderLeftColor: PlatformColor('@android:color/holo_blue_bright'),
borderBottomColor: PlatformColor('@android:color/holo_blue_bright'),
},
}),
},
});
Snack, screenshot, or link to a repository
https://snack.expo.dev/@retyui/rn-issue-bordertopcolor-and-platformcolor


flaviocastro
Metadata
Metadata
Assignees
Labels
Issue: Author Provided ReproThis issue can be reproduced in Snack or an attached project.This issue can be reproduced in Snack or an attached project.Platform: AndroidAndroid applications.Android applications.Resolution: FixedA PR that fixes this issue has been merged.A PR that fixes this issue has been merged.