Блог

Я работаю над этим, чтобы реализовать темный режим в React Native с помощью React Navigation. но он изменяет только навигатор нижней панели, а не экраны внутри него. можете ли вы помочь мне с этим

Код закуски

https://snack.expo.io/@belgin/news-app

Вы несете ответственность за стиль внутри своих собственных компонентов. Вы стилизуете фон как светлый, установка темы навигации на темный не приведет к волшебному изменению определенных вами цветов.

Чтобы изменить темы для работы с вашими компонентами, вам нужно использовать useTheme хук для установки цветов в ваших собственных компонентах вместо их жесткого кодирования.

 import * as React from 'react';
import { TouchableOpacity, Text } from 'react-native';
import { useTheme } from '@react-navigation/native';

function MyScreen() {
  const { colors } = useTheme();

  return (
    <View style={{ flex: 1, backgroundColor: colors.background }}>
      {/* screen content */}
    </View>
  );
}
 

https://reactnavigation.org/docs/themes/#using-the-current-theme-in-your-own-components