有什么方法可以使用 React-Native 根据用户的本地时间将 App(UI) 的主题模式动态更改为深色或浅色？

Question

我试过贝娄代码但还是不行...

我收到错误消息：AppThemeState 是 undefined .

import { AppThemeState } from 'react-native';


const bannerContainerStyle =
AppThemeState.currentTheme === 'dark' ? styles.mainContainerViewDark : styles.mainContainerViewLight;

Answer 1

如果您想在 evening 中的 dark mode 和 morning 中的 light，根据当地时间，您可以：

var themColor = ""
var hours = new Date().getHours();
if (hours >20 || hours < 5) {
   themColor = "dark"
} else {
   themColor = "light"
}
const bannerContainerStyle = themColor === "dark" ? styles.mainContainerViewDark : styles.mainContainerViewLight;

通过GPS接收和处理当前位置信息的方法有很多，这里介绍一下简单的方法。接收和处理设备使用语言信息。

你可以运行

$ npm install --save react-native-localize
# --- or ---
$ yarn add react-native-localize
//Don't forget to run pod install after that !

用法

import * as RNLocalize from "react-native-localize";

const localCode =  RNLocalize.getLocales()
const countryCode = localCode.countryCode
if (countryCode === "IN" && hours >17 || countryCode === "IN" && hours < 5) {
   themColor = "dark"
} else if (countryCode === "AU" && hours > 19 || countryCode === "AU" && hours < 5)  {
   themColor = "dark"
} else {
   themColor = "light"
}

Answer 2

export const getCurrentAuTime = () => {
  return moment
    .duration(
      moment
        .default()
        .tz('Australia/Melbourne')
        .format('HH:mm:ss'),
    )
    .asSeconds();
  //return 32401;
};

有什么方法可以使用 React-Native 根据用户的本地时间将 App(UI) 的主题模式动态更改为深色或浅色？

Is there any way to change theme mode of App(UI) to dark or light dynamically based on user's Local time using React-Native?

themes

react-native

用法