Calculate and adjust status bar padding for iOS devices. Component needs to be placed at top of screen/view.
npm install react-native-ios-status-bar-padding --save
Require package from your Javascript file as shown below:
import React, { Component } from 'react-native';
import StatusBarPaddingIOS from 'react-native-ios-status-bar-padding';
class ExampleComponent extends Component {
render() {
return(<StatusBarPaddingIOS/>)
}
}
export default ExampleComponent;
Provide custom styles to bar (applies only in iOS)
<StatusBarPaddingIOS style={{backgroundColor: 'red'}}/>