react-native-router icon indicating copy to clipboard operation
react-native-router copied to clipboard

Set headerStyle backgroundColor transparent

Open RWOverdijk opened this issue 10 years ago • 3 comments
trafficstars

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.

RWOverdijk avatar Sep 02 '15 20:09 RWOverdijk

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 avatar Oct 28 '15 23:10 darkrishabh

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

darkrishabh avatar Oct 28 '15 23:10 darkrishabh

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

davidLeonardi avatar Dec 22 '15 22:12 davidLeonardi