如何在原生基础中更改主题？

Posted 2023-03-15

【中文标题】如何在原生基础中更改主题？

【英文标题】：How to change theme in native base?

【发布时间】：2017-09-11 07:35:22

【问题描述】：

我目前是 react native 的新手，并尝试使用原生基础，组件很好，但我坚持在原生基础中更改主题，而我知道如何使用样式但并非所有样式都可以应用在本机基础中（例如在活动页脚选项卡中更改颜色）。即使它可以自定义样式，我也希望像在文档中一样更改主题。但我无法克服这一点。

到目前为止，我已经尝试使用我的自定义主题并应用到我的组件中，但它没有改变。

我的工作区： -反应原生 2.0.1 -native-base 2.3.1

谢谢

【参考方案1】：

您可以使用此代码并阅读here 了解更多信息：

import React,  Component  from 'react';
import  Container, Content, Text, StyleProvider  from 'native-base';
import getTheme from './native-base-theme/components';
import material from './native-base-theme/variables/material';
​export default class ThemeExample extends Component 
  render() 
    return (
      <StyleProvider style=getTheme(material)>
        <Container>
          <Content>
            <Text>
              I have changed the text color.
            </Text>
          </Content>
        </Container>
      </StyleProvider>
    );
  

【讨论】：

我正在尝试使用上面的代码创建一个名为 myThemes.js 的文件并运行此命令 node node_modules/native-base/ejectTheme.js 之后我尝试运行或导入 myThemes 并且有一个错误意外字符“（5:0）

您要自定义主题吗？

是的，我一直在学习教程，但无法通过它

我以前看过那个页面，但无法获取 light.js，也许你可以举个例子？

您的整个应用程序必须由 StyleProvider 包装。如果你有一个根组件，你可以使用它一次。

【参考方案2】：

运行此命令，即项目根目录中的 node node_modules/native-base/ejectTheme.js。 运行此命令后，将在您的项目根目录中创建一个名为 native-base-them 的文件夹。