Fixed iPhone 14, 15 and 16 with Dynamic Island status bar height issue

[Talha-Jawed]

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch react-native-status-bar-height@2.6.0 for the project I'm working on.

Here is the difference that solved my problem:

diff --git a/node_modules/react-native-status-bar-height/index.js b/node_modules/react-native-status-bar-height/index.js
index 08fd56b..94e5795 100644
--- a/node_modules/react-native-status-bar-height/index.js
+++ b/node_modules/react-native-status-bar-height/index.js
@@ -4,6 +4,9 @@ const STATUSBAR_DEFAULT_HEIGHT = 20;
 const STATUSBAR_X_HEIGHT = 44;
 const STATUSBAR_IP12_HEIGHT = 47;
 const STATUSBAR_IP12MAX_HEIGHT = 47;
+const STATUSBAR_IP14PRO_HEIGHT = 49;
+const STATUSBAR_IP16PRO_HEIGHT = 51;
+const STATUSBAR_IP16PROMAX_HEIGHT = 53;

 const X_WIDTH = 375;
 const X_HEIGHT = 812;
@@ -17,6 +20,18 @@ const IP12_HEIGHT = 844;
 const IP12MAX_WIDTH = 428;
 const IP12MAX_HEIGHT = 926;

+const IP14PRO_WIDTH = 393;
+const IP14PRO_HEIGHT = 852;
+
+const IP14PROMAX_WIDTH = 430;
+const IP14PROMAX_HEIGHT = 932;
+
+const IP16PRO_WIDTH = 402;
+const IP16PRO_HEIGHT = 874;
+
+const IP16PROMAX_WIDTH = 440;
+const IP16PROMAX_HEIGHT = 956;
+
 const { height: W_HEIGHT, width: W_WIDTH } = Dimensions.get('window');

 let statusBarHeight = STATUSBAR_DEFAULT_HEIGHT;
@@ -25,6 +40,7 @@ let isIPhoneXMax_v = false;
 let isIPhone12_v = false;
 let isIPhone12Max_v = false;
 let isIPhoneWithMonobrow_v = false;
+let isIPhoneWithDynamicIsland_v = false;

 if (Platform.OS === 'ios' && !Platform.isPad && !Platform.isTVOS) {
     if (W_WIDTH === X_WIDTH && W_HEIGHT === X_HEIGHT) {
@@ -43,6 +59,20 @@ if (Platform.OS === 'ios' && !Platform.isPad && !Platform.isTVOS) {
         isIPhoneWithMonobrow_v = true;
         isIPhone12Max_v = true;
         statusBarHeight = STATUSBAR_IP12MAX_HEIGHT;
+    } else if (W_WIDTH === IP14PROMAX_WIDTH && W_HEIGHT === IP14PROMAX_HEIGHT) {
+        isIPhoneWithDynamicIsland_v = true;
+        statusBarHeight = STATUSBAR_IP14PRO_HEIGHT;
+    } else if (W_WIDTH === IP14PRO_WIDTH && W_HEIGHT === IP14PRO_HEIGHT) {
+        isIPhoneWithDynamicIsland_v = true;
+        statusBarHeight = STATUSBAR_IP14PRO_HEIGHT;
+    } 
+
+    else if (W_WIDTH === IP16PRO_WIDTH && W_HEIGHT === IP16PRO_HEIGHT) {
+        isIPhoneWithDynamicIsland_v = true;
+        statusBarHeight = STATUSBAR_IP16PRO_HEIGHT;
+    } else if (W_WIDTH === IP16PROMAX_WIDTH && W_HEIGHT === IP16PROMAX_HEIGHT) {
+        isIPhoneWithDynamicIsland_v = true;
+        statusBarHeight = STATUSBAR_IP16PROMAX_HEIGHT;
     }
 }

@@ -51,6 +81,7 @@ export const isIPhoneXMax = () =>  isIPhoneXMax_v;
 export const isIPhone12 = () =>  isIPhone12_v;
 export const isIPhone12Max = () =>  isIPhone12Max_v;
 export const isIPhoneWithMonobrow = () => isIPhoneWithMonobrow_v;
+export const isIPhoneWithDynamicIsland = () => isIPhoneWithDynamicIsland_v;

 const getExpoRoot = () => global.Expo || global.__expo || global.__exponent;

[flavio-dias]

nice job, i would also try to open a PR to the project since the doc says that its open sourced