title: How to hide or remove shadow or bottomBorder in react-native IOS
body: <p>I am using react-native-router-flux v4.0 library for showing navigation bar in react-native. </p>
  
  <p>Here I created a custom navigation bar.</p>
  
  <p>Here is my code :</p>
  
  <pre><code> _renderLeft() {
      return (
          &lt;TouchableOpacity
              style={{justifyContent: 'flex-start', alignItems: 'flex-start', alignSelf: 'flex-start'}}
          onPress={Actions.pop}&gt;
              &lt;Image
                  style={{width: 24, height: 24}}
                  resizeMode="contain"
                  source={require('../../assets/images/ico_swipe.png')}&gt;&lt;/Image&gt;
          &lt;/TouchableOpacity&gt;
      )
  }
  
  _renderMiddle() {
      return (
          &lt;View style={[styles.navBarTitleView]}&gt;
              &lt;Text style={[styles.navBarTitle]}&gt;{this.props.title}&lt;/Text&gt;
          &lt;/View&gt;
      )
  }
  
  _renderRight() {
      return (
          &lt;TouchableOpacity
              style={{justifyContent: 'flex-start', alignItems: 'flex-start', alignSelf: 'flex-start'}}
              onPress={Actions.pop}&gt;
              &lt;Image
                  style={{width: 24, height: 24}}
                  resizeMode="contain"
                  source={require('../../assets/images/ico_home.png')}&gt;&lt;/Image&gt;
          &lt;/TouchableOpacity&gt;
      )
  }
  
  render() {
      StatusBar.setBarStyle('light-content', true);
      return (
          &lt;Header style={[styles.container]}&gt;
              &lt;Left style={{flex: 1}}&gt;
                  {this._renderLeft()}
              &lt;/Left&gt;
              &lt;Body style={{flex: 3}}&gt;
              &lt;Title style={styles.navBarTitle}&gt;{this.props.title}&lt;/Title&gt;
              &lt;/Body&gt;
              &lt;Right style={{flex: 1}}&gt;
                  {this._renderRight()}
              &lt;/Right&gt;
          &lt;/Header&gt;
      )
  }
  </code></pre>
  
  <p>Here is my Style:</p>
  
  <pre><code>const styles = StyleSheet.create({
  container: {
      backgroundColor: AppColors.colorToolBar,
      elevation:0
  },
  navBarTitleView: {
      flex: 2,
  },
  navBarTitle: {
      fontSize: 20,
      fontFamily: AppStyles.fontFamilyMedium,
      color: AppColors.white,
      alignSelf: 'center'
  },
  menuItem:{
      flex: 1, flexDirection: 'row', padding: 20
  },
  menuTitle:{flex: 20, justifyContent: 'flex-start', alignItems: 'center',
      alignSelf: 'flex-start'},
  menuNextArrow:{flex: 1}
  </code></pre>
  
  <p>});</p>
  
  <p>Here I used it :</p>
  
  <pre><code>&lt;Stack key="Key"  hideTabBar&gt;
                  &lt;Scene key="Key"
                         navBar={MyCustomNavBarLocation}
                         component={myFileLocation}
                         title="Round 1"
                         onLeft={Actions.pop}
                         BackHandler={Actions.pop}
                         back
                  /&gt;
              &lt;/Stack&gt;
  </code></pre>
  
  <p>I am getting it proper in Android like:</p>
  
  <p><a href="https://i.stack.imgur.com/9wQrP.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/9wQrP.jpg" alt="enter image description here"></a></p>
  
  <p>But in Iphone its not coming proper:</p>
  
  <p><a href="https://i.stack.imgur.com/LvEm2.png" rel="noreferrer"><img src="https://i.stack.imgur.com/LvEm2.png" alt="enter image description here"></a></p>
  
  <p>Here If u see the second Image u saw one grey Line between navigation bar and TimeRemaining view I want to remove that.</p>
  
  <p>Thanks </p>