NativeBase自定义组件样式

http://nativebase.io/docs/v0.5.13/customize#themingNativeBaseApp

对于NativeBase中的组件,我们可以根据实际需要来进行自定义组件颜色、高度、大小等。

准备

  1. 复制light.js文件(/node_modules/native-base/Components/Themes/light.js)
  2. 创建文件夹Themes在我们的项目中,然后粘贴刚刚复制的文件,重新命名为myTheme.js
  3. 在我们需要自定义的文件中导入文件Themes/myTheme.js
  4. 进入Themes/myTheme.js文件中找到相应的组件,可以自定义改变

用法

<Container theme={myTheme}>
    <Header>
        <Title>课程</Title>
    </Header>
    <Content>
        <Button block style={{marginTop:30}}><Text>我是课程</Text></Button>
    </Content>
    <Footer>
        <TabsFooter />
    </Footer>
</Container>

举例-修改底部背景及字体颜色

默认底部颜色样式为:

修改后:

原文地址:https://www.cnblogs.com/maoyazhi/p/6474982.html