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

How does Appearance.addChangeListener work? #40

Closed annjawn closed 4 years ago

annjawn commented 4 years ago

I am not sure i can get it to work. I did Appearance.addChangeListener in my componentDidMount and have a state update inside of it but when I change the theme while testing nothing really happens and the colorScheme continues to have the previous colorScheme value. I am not sure if I am doing this correctly.

componentDidMount(){
   this._schemeSubscription = Appearance.addChangeListener(({ colorScheme }) => {
            this.setState({ colorscheme: colorScheme });
        });
}
abeeralshaer commented 4 years ago

I am not sure i can get it to work. I did Appearance.addChangeListener in my componentDidMount and have a state update inside of it but when I change the theme while testing nothing really happens and the colorScheme continues to have the previous colorScheme value. I am not sure if I am doing this correctly.

componentDidMount(){
   this._schemeSubscription = Appearance.addChangeListener(({ colorScheme }) => {
            this.setState({ colorscheme: colorScheme });
        });
}

@annjawn How did you manage to fix it?

annjawn commented 4 years ago

I missed wrapping the root with <AppearanceProvider> , once I did that the Appearance.addChangeListener started working.

AmirDoreh commented 4 years ago

with the new useColorScheme() there is no need for setting state any more, just use const colortheme= useColorScheme() and use colortheme anywhere

aymkin commented 3 years ago

What is I need to find color scheme outside the functional component?