diff --git a/package.json b/package.json index 56e1a88..f683d73 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "react-native-circular-progress": "1.3.6", "react-native-config": "1.4.0", "react-native-gesture-handler": "1.8.0", + "react-native-navigation-bar-color": "2.0.1", "react-native-paper": "4.0.0", "react-native-reanimated": "1.13.2", "react-native-safe-area-context": "3.1.9", diff --git a/src/constants/theme.ts b/src/constants/theme.ts index c149bf2..791fd19 100644 --- a/src/constants/theme.ts +++ b/src/constants/theme.ts @@ -22,7 +22,7 @@ export const theme = (type: 'light' | 'dark'): AppTheme => { ...PaperDarkTheme.colors, ...NavigationDarkTheme.colors, background: '#1E1E1E', - surface: '#333333ff', + surface: '#333333', }, } diff --git a/src/store/preferences/index.ts b/src/store/preferences/index.ts index f598e4c..b9f9a6b 100644 --- a/src/store/preferences/index.ts +++ b/src/store/preferences/index.ts @@ -1,7 +1,9 @@ import { StatusBar } from 'react-native' +import changeNavigationBarColor from 'react-native-navigation-bar-color' import AsyncStorage from '@react-native-async-storage/async-storage' import { StoreonModule } from 'storeon' import { State, Events } from 'store/types' +import { theme } from 'constants/theme' import { PreferencesStore, ThemeType } from './types' const STORAGE_KEY = '@preferences' @@ -59,5 +61,18 @@ export const preferences: StoreonModule = (store) => { } function updateSatusBar (themeType: ThemeType) { - StatusBar.setBarStyle(themeType === 'dark' ? 'light-content' : 'dark-content', true) + const { colors } = theme(themeType) + const isLightContent = themeType === 'dark' + const color = colors.surface + + StatusBar.setBackgroundColor(color, true) + StatusBar.setBarStyle(isLightContent ? 'light-content' : 'dark-content', true) + + try { + changeNavigationBarColor(color, !isLightContent, true) + } catch (error) { + if (__DEV__) { + console.error(error) + } + } } diff --git a/yarn.lock b/yarn.lock index fb37cb8..2fe1e8a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6186,6 +6186,11 @@ react-native-iphone-x-helper@^1.3.0: resolved "https://registry.yarnpkg.com/react-native-iphone-x-helper/-/react-native-iphone-x-helper-1.3.1.tgz#20c603e9a0e765fd6f97396638bdeb0e5a60b010" integrity sha512-HOf0jzRnq2/aFUcdCJ9w9JGzN3gdEg0zFE4FyYlp4jtidqU03D5X7ZegGKfT1EWteR0gPBGp9ye5T5FvSWi9Yg== +react-native-navigation-bar-color@2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/react-native-navigation-bar-color/-/react-native-navigation-bar-color-2.0.1.tgz#ee2be25cc37105f7da355717b0a9a32c9c059ae6" + integrity sha512-1kE/oxWt+HYjRxdZdvke9tJ365xaee5n3+euOQA1En8zQuSbOxiE4SYEGM7TeaWnmLJ0l37mRnPHaB2H4mGh0A== + react-native-paper@4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/react-native-paper/-/react-native-paper-4.0.0.tgz#b77862628a89a6b43ba45a9e5e90254810f4ea06"