platform check in react native for status bar color

1import React, {
2  Component,
3} from 'react';
4import {
5  AppRegistry,
6  StyleSheet,
7  View,
8  StatusBar,
9  Platform,
10  SafeAreaView
11} from 'react-native';
12
13const MyStatusBar = ({backgroundColor, ...props}) => (
14  <View style={[styles.statusBar, { backgroundColor }]}>
15    <SafeAreaView>
16      <StatusBar translucent backgroundColor={backgroundColor} {...props} />
17    </SafeAreaView>
18  </View>
19);
20
21class DarkTheme extends Component {
22  render() {
23    return (
24      <View style={styles.container}>
25        <MyStatusBar backgroundColor="#5E8D48" barStyle="light-content" />
26        <View style={styles.appBar} />
27        <View style={styles.content} />
28      </View>
29    );
30  }
31}
32
33const STATUSBAR_HEIGHT = StatusBar.currentHeight;
34const APPBAR_HEIGHT = Platform.OS === 'ios' ? 44 : 56;
35
36const styles = StyleSheet.create({
37  container: {
38    flex: 1,
39  },
40  statusBar: {
41    height: STATUSBAR_HEIGHT,
42  },
43  appBar: {
44    backgroundColor:'#79B45D',
45    height: APPBAR_HEIGHT,
46  },
47  content: {
48    flex: 1,
49    backgroundColor: '#33373B',
50  },
51});
52
53AppRegistry.registerComponent('App', () => DarkTheme);
54