Theming NativeBase Components for React Native

Question

I see there's a way to theme (customize) NativeBase components for React Native: http://nativebase.io/docs/v0.5.0/customize

But I would like to customize an attribute of a particular component that is not part of the provided theme attributes. How would I customize the font size of the tab label for the Tabs component?

score 1 · Answer 1 · answered Jul 28 '16 at 10:40

For a single component, you can use inline style attribute like this

<Button style={{backgroundColor: '#384850'}}>
    Hello world
</Button>

If you want all the buttons to have this property then you can create a wrapping component like this

class MyButton extends React.Component {
    render() {
        return <Button style={backgroundColor: '#384850'}}>
            {this.props.children}
        </Button>;
    }
}

and then you can use

<MyButton>
    Hello world
</MyButton>

Theming NativeBase Components for React Native

1 Answers1