search

t4t5 / react-native-router

Awesome navigation for your React Native app.
MIT License
1.17k stars 155 forks source link

Set headerStyle backgroundColor transparent #57

Open RWOverdijk opened 9 years ago

RWOverdijk commented 9 years ago

I'm trying to accomplish, more or less, this: https://www.dropbox.com/s/dqeqy1gw3ntw7lt/Screenshot%202015-09-02%2021.41.20.png?dl=0

This is actually a working example which I managed by writing something like the following, and setting my content to a marginTop of -64 on my content:

<ReactNativeRouter headerStyle={backgroundColor: 'transparent'} />

I'd like to be able to do this per-route. Keep the controls, and the title, but set the backgroundColor to transparent.

Now here's where my problem occurs. When using this.props.toRoute(), with a property headerStyle, it only works if the backgroundColor property inside of it holds an actual color (it even includes the transition :)). As soon as the value is set to transparent however, it seems to be ignored.

So to recap, setting the backgroundColor to transparent initially: works. Setting it per-route: doesn't work.

darkrishabh commented 9 years ago

take a look at this fork .. you can hide the navigation bar and just create this look as a component https://github.com/darkrishabh/react-native-router/

darkrishabh commented 9 years ago

BTW, I would recommend you to fork it and then use it. I use it for my custom usage and it may change in future

davidLeonardi commented 8 years ago

Please use this fork: github.com/MikaelCarpenter/gb-native-router . It's gotten quite a bit of support lately.