react-native-status-bar-size

react-native-status-bar-height

Watch and respond to changes in the iOS status bar height.

$3

1. Run npm install react-native-status-bar-size --save
2. Follow the example below to use it in JS

$3

The change event has been deprecated. The didChange event should be used instead.
It's still available but may be removed in a later version.

Example

``javascript
var MyApp = React.createClass({
getInitialState: function() {
return {
currentStatusBarHeight: StatusBarSizeIOS.currentHeight,
};
},

componentDidMount: function() {
StatusBarSizeIOS.addEventListener('willChange', this._handleStatusBarSizeWillChange);
StatusBarSizeIOS.addEventListener('didChange', this._handleStatusBarSizeDidChange);
},

componentWillUnmount: function() {
StatusBarSizeIOS.removeEventListener('willChange', this._handleStatusBarSizeWillChange);
StatusBarSizeIOS.removeEventListener('didChange', this._handleStatusBarSizeDidChange);
},

_handleStatusBarSizeWillChange: function(nextStatusBarHeight) {
console.log('Will Change: ' + nextStatusBarHeight);
},

_handleStatusBarSizeDidChange: function(currentStatusBarHeight) {
console.log('changed');
this.setState({ currentStatusBarHeight: currentStatusBarHeight });
},

render: function() {
return (

Current status bar height is: {this.state.currentStatusBarHeight}

);
},
});
``

!Demo gif