Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to change theme in native base?

I'm currently new in react native and tried to use native base, the component is good but I'm in stuck to change the theme in native base while I know how to use style but not all of them can be applied in native base (such as change color in active footer tab). Even it can be customize in style I would prefer to change in theme just like in the doc. But I can't overcome this.

I've tried to use my custom Themes and applied in my component so far but it didn't change.

My Workspace: -react-native 2.0.1 -native-base 2.3.1

Thanks

like image 213
kripton haz Avatar asked Sep 11 '17 07:09

kripton haz


Video Answer


2 Answers

You can use this code and read here for more information:

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>
    );
  }
}
like image 84
Vahid Boreiri Avatar answered Oct 31 '22 18:10

Vahid Boreiri


Run this command i.e. node node_modules/native-base/ejectTheme.js in the project root directory. After running this command a folder with named native-base-them will be created to your project root.

like image 26
Yakup DURMUS Avatar answered Oct 31 '22 17:10

Yakup DURMUS