在纯React Native项目中启用黑暗主题

npm install react-native-appearance

import { Appearance, AppearanceProvider, useColorScheme } from 'react-native-appearance';
import { StatusBar } from 'react-native';

export default function App() {
  return (
    <AppearanceProvider>
      <MainApp />
    </AppearanceProvider>
  );
}

export default function MainApp() {
  const colorScheme = useColorScheme();

  // 根据colorScheme的值来设置不同的样式
  const backgroundColor = colorScheme === 'dark' ? '#000000' : '#ffffff';
  const textColor = colorScheme === 'dark' ? '#ffffff' : '#000000';

  return (
    <>
      <StatusBar barStyle={colorScheme === 'dark' ? 'light-content' : 'dark-content'} />
      <View style={{ flex: 1, backgroundColor }}>
        <Text style={{ color: textColor }}>Hello, World!</Text>
      </View>
    </>
  );
}