search

expo / react-native-appearance

Access operating system appearance information (currently only light/dark mode) on iOS, Android, and web
MIT License
337 stars 40 forks source link

React Native's SegmentedControlIOS colour #37

Closed darrylyoung closed 4 years ago

darrylyoung commented 4 years ago

Hi, everyone,

I recently started using this package when adding a theme to my app (based on React Navigation's Theme documentation). It's working fine but I've noticed an issue with React Native's SegmentedControlIOS component and I don't know if it's an issue with this package, React Navigation, or with that component itself.

As I haven't yet written my dark theme, I set my app to display the light theme regardless of whether the device was in dark mode or not. For the sake of testing, my custom light theme just consisted of the default values recommended, i.e. primary, background, etc. This meant that nothing should have changed (visually) when switching my phone between light and dark mode.

What I noticed, though, is that the SegmentedControlIOS still changed its appearance when the phone was set to dark mode. Here are screenshots to show what I mean.

Light mode light-mode

Dark mode dark-mode

I don't understand why this is changing. I have no custom styles and the component doesn't seem to change if I manually try to adjust tintColor. Is there any other way I can control this?

Apologies if this is an issue in React Navigation or in React Native itself; I just wasn't sure where to start. Thanks!

Naturalclar commented 4 years ago

@darrylyoung :wave: I believe this is an issue with react-native core itself. It's fixed in this issue https://github.com/facebook/react-native/pull/27643, but the fix is not included in the latest published version of react native. If you're using bare workflow and not expo, you can also try using the community repo which is more up to date :)

darrylyoung commented 4 years ago

Hi, @Naturalclar. 👋

Thank you for your comment. Unfortunately, I'm using Expo. As I couldn't originally find a way around this I've taken the SegmentedControlIOS out of my app completely. Maybe, once the fix is in a React Native release (and then in Expo), I can look at it again. No worries.

Thanks again. Have a nice day.