Dark mode and SegmentedControlIOS

  1. SDK Version: 36.0.0
  2. Platforms(Android/iOS/web/all): iOS

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 Expo, 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

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!

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.