search

nandorojo / zeego

Menus for React (Native) done right.
https://zeego.dev
MIT License
1.42k stars 41 forks source link

Dark Mode? #53

Closed michaelkremenetsky closed 9 months ago

michaelkremenetsky commented 10 months ago

Is there any way to enable dark mode in Zeego? Didn't see anything about it in the docs.

timothyerwin commented 10 months ago

I'm using it and dark mode is working fine for me. I don't think I used any setting.

timothyerwin commented 10 months ago

if you are using a native app make sure your app also works in dark mode as well

nandorojo commented 10 months ago

@timothyerwin can you show a screenshot of it working? i didn’t think the upstream ios library supported dark mode

timothyerwin commented 10 months ago

IMG_4899

timothyerwin commented 10 months ago

the upstream ios library is built on an actual ios component, so yeah, apple supports that

nandorojo commented 10 months ago

ah yeah you’re right, works on beatgig too

michaelkremenetsky commented 10 months ago

weird that it doesn't work for me on expo dev client, I guess I'll keep playing with it, although I was also hoping there would be some way to toggle it at the app level since my app has its own theme settings that allow you to override the system ones.

michaelkremenetsky commented 10 months ago

I figured it out. I fixed it by installing expo-system-ui

nandorojo commented 10 months ago

good to know, we could add this to the docs

Darren120 commented 10 months ago

I figured it out. I fixed it by installing expo-system-ui

Hey I have installed expo-system-ui but unable to toggle dark mode for the dropdown. I tried setting the background

  await SystemUI.setBackgroundColorAsync(dark ? "black" : "white");

but the dropdown still light :/ how did u do it?

nandorojo commented 10 months ago

i added userInterfaceStyle: ‘dark’ to my app config since we only do dark mode. but you could try setting it to automatic

Darren120 commented 10 months ago

i added userInterfaceStyle: ‘dark’ to my app config since we only do dark mode. but you could try setting it to automatic

Thanks, but I thought @michaelkremenetsky was able to toggle it in app via expo system ui

michaelkremenetsky commented 10 months ago

Unfortunately, the only way I was able to get it toggle was by changing the system theme in settings. expo-system-ui just made it so it would follow the system theme.

michaelkremenetsky commented 10 months ago

If anyone finds a way to toggle it in-app I would love to know, I wanted to add in-app theme settings but couldn't find a way to the toggle the zeego components.

miafoo commented 10 months ago

I've got an app that supports multiple themes. If a user has selected a darker theme but their iOS appearance is light it will also render the context menus as light variants rather than dark versions which is not very nice.

Is there any way to explicitly set the appearance to either light or dark which overrides the OS level appearance?

Edit: As a workaround I've used this package, which seems to work great so far: https://www.npmjs.com/package/react-native-override-color-scheme

michaelkremenetsky commented 10 months ago

Thank you the workaround is exactly what I was looking for, I don't think theirs anything built into the library itself though

nandorojo commented 9 months ago

Hey guys, I'm going to close this out. I'd love to add this to the docs though, can anyone send a PR for dark mode that mentions the override color scheme library? Thank you!

CC @miafoo @michaelkremenetsky

michaelkremenetsky commented 9 months ago

@nandorojo Submitted a PR #62

Estevete commented 3 months ago

@nandorojo I am facing the issue on Android. Also with the Alert component. I am tracking the issue here https://github.com/expo/expo/issues/27584