Header absolute/fixed value with transparent background

I’m trying to make the header to be transparent. I’ve tried styling it to absolute but its not in the screen (hidden) if I do that. also if I do backgroundColor: 'transparent' it doesn’t work as well.

I want the Header component to be on top of the view that has the gradient. I want to achieve something like this.

Is it possible with Native Base header component or I have to create my own?

[iamadityaaz]

I done this using style={{ backgroundColor: null }}

[qin-guan]

To make header transparent you should do

class App extends Component {
  static navigationOptions = {
    headerStyle: {
      backgroundColor: 'transparent'
    }
  }
  render() {
    return (
      <YourViewHere/>
    )
  }
}

You did backgroundColor: { 'transparent' } instead with {} Also keep note that the white may be your actual background color, so you may mistake your View background color for that

Hope this helps! Please let me know if it does! 😄