iOS Status bar issue

https://dev.wormwood.com.sg/zentao/task-view-344.html

Strides-APP/app/components/Toolbar.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { Pressable, StyleSheet, View } from 'react-native';
 import TopChargeBackground from '../icons/TopChargeBackground';
 import HeaderTitle from './HeaderTitle';
@@ -63,31 +63,52 @@ export const StationBack = ({bottom = 24, scale=1.0}) => {
 }
 
 export default Toolbar = ({
+  style=Styles.toolbar,
   title,
   scope,
   showBack=true,
   rightIcon,
-  onBackPress
+  onBackPress,
+  height=toolbarSize,
+  children
 }) => {
-  return (
-    <View style={Styles.toolbar}>
-      { showBack &&
-        <BackButton onPress={onBackPress}/>
-      }
-      <HeaderTitle scope={scope} title={title} style={Styles.titleText}/>
-      { rightIcon
-      ? rightIcon()
-      : showBack
-      ? <View style={Styles.backIcon}>
-          <MaterialIcons
-            name={'arrow-back-ios'}
-            size={16}
-            color={'transparent'} />
-        </View>
-      : <></>
-      }
-    </View>
-  )
+  const [viewStyle, setStyle] = useState({})
+  useEffect(() => {
+    if (isIOS) {
+      console.log("statusHeight", statusHeight)
+      setStyle({
+        height: height + statusHeight,
+        paddingTop: statusHeight
+      })
+    }
+  }, []);
+  if (children) {
+    return (
+      <View style={[style, viewStyle]}>
+        {children}
+      </View>
+    )
+  } else {
+    return (
+      <View style={[style, viewStyle]}>
+        { showBack &&
+          <BackButton onPress={onBackPress}/>
+        }
+        <HeaderTitle scope={scope} title={title} style={Styles.titleText}/>
+        { rightIcon
+        ? rightIcon()
+        : showBack
+        ? <View style={Styles.backIcon}>
+            <MaterialIcons
+              name={'arrow-back-ios'}
+              size={16}
+              color={'transparent'} />
+          </View>
+        : <></>
+        }
+      </View>
+    )
+  }
 }
 
 export const Styles = StyleSheet.create({

Strides-APP/app/utils/constant.js

@@ -21,18 +21,18 @@ global.isIOS = Platform.OS == 'ios';
 
 global.$width = Dimensions.get('window').width;
 global.$height = Dimensions.get('window').height;
-global.statusHeight = isIOS ? 20 : StatusBar.currentHeight;
+global.$screen = Dimensions.get('screen').height;
+global.statusHeight = isIOS ? 0 : StatusBar.currentHeight;
 global.toolbarSize = isIOS ? 50 : 56;
-
-/*if (isIOS) {
+if (isIOS) {
   const {StatusBarManager} = NativeModules;
   StatusBarManager.getHeight(statusBarHeight => {
     const height = statusBarHeight.height;
-    global.toolbarSize = toolbarSize + height;
+    //global.toolbarSize = toolbarSize + height;
     global.statusHeight = height;
   });
   global.BRAND = '';
-} else {
+} /*else {
   global.statusHeight = StatusBar.currentHeight;
   global.BRAND = DeviceInfo.getBrand().toLowerCase();
 }*/