修复切换亮暗主题时的状态栏字体颜色适配问题

This commit is contained in:
lyswhut 2023-04-13 14:06:49 +08:00
parent ca41b412c3
commit ee2c111495
3 changed files with 29 additions and 23 deletions

View File

@ -9,5 +9,6 @@ const StatusBar = function() {
} }
StatusBar.currentHeight = RNStatusBar.currentHeight ?? 0 StatusBar.currentHeight = RNStatusBar.currentHeight ?? 0
StatusBar.setBarStyle = RNStatusBar.setBarStyle
export default StatusBar export default StatusBar

View File

@ -3,20 +3,25 @@ import { getAppearance, getIsSupportedAutoTheme, onAppearanceChange } from '@/ut
import { setShouldUseDarkColors, applyTheme } from '@/core/theme' import { setShouldUseDarkColors, applyTheme } from '@/core/theme'
import { getTheme } from '@/theme/themes/index' import { getTheme } from '@/theme/themes/index'
import settingState from '@/store/setting/state' import settingState from '@/store/setting/state'
import StatusBar from '@/components/common/StatusBar'
// import { Dimensions, PixelRatio } from 'react-native' // import { Dimensions, PixelRatio } from 'react-native'
export default async(setting: LX.AppSetting) => { export default async(setting: LX.AppSetting) => {
setShouldUseDarkColors(getAppearance() == 'dark')
applyTheme(await getTheme())
if (getIsSupportedAutoTheme()) { if (getIsSupportedAutoTheme()) {
setShouldUseDarkColors(getAppearance() == 'dark')
onAppearanceChange(color => { onAppearanceChange(color => {
setShouldUseDarkColors((color ?? 'light') == 'dark') setShouldUseDarkColors((color ?? 'light') == 'dark')
if (settingState.setting['common.isAutoTheme']) void getTheme().then(applyTheme) if (settingState.setting['common.isAutoTheme']) void getTheme().then(applyTheme)
}) })
} }
applyTheme(await getTheme())
global.state_event.on('themeUpdated', (theme) => {
StatusBar.setBarStyle(theme.isDark ? 'light-content' : 'dark-content')
})
// onDimensionChange(({ window }) => { // onDimensionChange(({ window }) => {
// let screenW = window.width // let screenW = window.width
// let screenH = window.height // let screenH = window.height

View File

@ -11,10 +11,10 @@ import {
import themeState from '@/store/theme/state' import themeState from '@/store/theme/state'
import { NAV_SHEAR_NATIVE_IDS } from '@/config/constant' import { NAV_SHEAR_NATIVE_IDS } from '@/config/constant'
import { getStatusBarStyle } from './utils'
// const store = getStore() // const store = getStore()
// const getTheme = () => getter('common', 'theme')(store.getState()) // const getTheme = () => getter('common', 'theme')(store.getState())
const getStatusBarStyle = (isDark: boolean) => isDark ? 'light' : 'dark'
export async function pushHomeScreen() { export async function pushHomeScreen() {
/* /*
@ -71,10 +71,10 @@ export async function pushHomeScreen() {
}, },
navigationBar: { navigationBar: {
// visible: false, // visible: false,
backgroundColor: theme.isDark ? '#000' : '#fff', backgroundColor: theme['c-content-background'],
}, },
layout: { layout: {
// componentBackgroundColor: theme.isDark ? '#000' : '#fff', componentBackgroundColor: theme['c-content-background'],
}, },
}, },
}, },
@ -134,12 +134,12 @@ export function pushPlayDetailScreen(componentId: string) {
style: getStatusBarStyle(theme.isDark), style: getStatusBarStyle(theme.isDark),
backgroundColor: 'transparent', backgroundColor: 'transparent',
}, },
navigationBar: { // navigationBar: {
// visible: false, // // visible: false,
backgroundColor: theme.isDark ? '#000' : '#fff', // backgroundColor: theme['c-content-background'],
}, // },
layout: { layout: {
componentBackgroundColor: theme.isDark ? '#000' : '#fff', componentBackgroundColor: theme['c-content-background'],
}, },
animations: { animations: {
push: { push: {
@ -227,12 +227,12 @@ export function pushSonglistDetailScreen(componentId: string, id: string) {
style: getStatusBarStyle(theme.isDark), style: getStatusBarStyle(theme.isDark),
backgroundColor: 'transparent', backgroundColor: 'transparent',
}, },
navigationBar: { // navigationBar: {
// visible: false, // // visible: false,
backgroundColor: theme.isDark ? '#000' : '#fff', // backgroundColor: theme['c-content-background'],
}, // },
layout: { layout: {
componentBackgroundColor: theme.isDark ? '#000' : '#fff', componentBackgroundColor: theme['c-content-background'],
}, },
animations: { animations: {
push: { push: {
@ -360,12 +360,12 @@ export function pushCommentScreen(componentId: string) {
style: getStatusBarStyle(theme.isDark), style: getStatusBarStyle(theme.isDark),
backgroundColor: 'transparent', backgroundColor: 'transparent',
}, },
navigationBar: { // navigationBar: {
// visible: false, // // visible: false,
backgroundColor: theme.isDark ? '#000' : '#fff', // backgroundColor: theme['c-content-background'],
}, // },
layout: { layout: {
componentBackgroundColor: theme.isDark ? '#000' : '#fff', componentBackgroundColor: theme['c-content-background'],
}, },
animations: { animations: {
push: { push: {
@ -446,10 +446,10 @@ export function pushCommentScreen(componentId: string) {
// }, // },
// navigationBar: { // navigationBar: {
// // visible: false, // // visible: false,
// backgroundColor: theme.isDark ? '#000' : '#fff', // backgroundColor: theme['c-content-background'],
// }, // },
// layout: { // layout: {
// componentBackgroundColor: theme.isDark ? '#000' : '#fff', // componentBackgroundColor: theme['c-content-background'],
// }, // },
// animations: { // animations: {
// push: { // push: {