add setLayoutIfNeededOnUpdate to fix problem with safearea

douglasjunior · Sep 16, 2021 · 73e06a1 · 73e06a1
1 parent e811336
commit 73e06a1
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 16 deletions.
diff --git a/README.md b/README.md
@@ -81,6 +81,7 @@ if (Platform.OS === 'ios') {
     KeyboardManager.setEnable(true);
     KeyboardManager.setEnableDebugging(false);
     KeyboardManager.setKeyboardDistanceFromTextField(10);
+    KeyboardManager.setLayoutIfNeededOnUpdate(true);
     KeyboardManager.setEnableAutoToolbar(true);
     KeyboardManager.setToolbarDoneBarButtonItemText("Done");
     KeyboardManager.setToolbarManageBehaviourBy("subviews"); // "subviews" | "tag" | "position"

diff --git a/Sample/App.js b/Sample/App.js
@@ -38,6 +38,7 @@ import KeyboardManager, { PreviousNextView } from 'react-native-keyboard-manager
 KeyboardManager.setEnable(true);
 KeyboardManager.setEnableDebugging(true);
 KeyboardManager.setKeyboardDistanceFromTextField(30);
+KeyboardManager.setLayoutIfNeededOnUpdate(true);
 KeyboardManager.setEnableAutoToolbar(true);
 KeyboardManager.setToolbarDoneBarButtonItemText("Done");
 KeyboardManager.setToolbarManageBehaviourBy("subviews"); // "subviews" | "tag" | "position"
@@ -120,28 +121,28 @@ class App extends Component {
     return (
       <View style={{ flex: 1 }}>
         <SafeAreaView style={{ flex: 1 }}>
-        {/* To try with Modal, uncomment the two following lines. */}
-        {/* <Modal visible={true}> */}
-        {/* <PreviousNextView style={{ flex: 1 }}> */}
+          {/* To try with Modal, uncomment the two following lines. */}
+          {/* <Modal visible={true}> */}
+          {/* <PreviousNextView style={{ flex: 1 }}> */}
 
-        {/* ScrollView is not required, but may be needed in some cases. */}
-        <ScrollView>
+          {/* ScrollView is not required, but may be needed in some cases. */}
+          <ScrollView>
 
-          <View style={{ alignItems: "center" }}>
+            <View style={{ alignItems: "center" }}>
               <Text style={{ marginTop: 10, textAlign: "center" }}>React-Native Keyboard Manager</Text>
-            <View style={{ marginTop: 10, flexDirection: "row", alignItems: "center" }}>
-              <Text>Enable/Disable </Text>
-              <Switch onValueChange={this.onEnableDisable}
-                value={this.state.enableDisable} />
+              <View style={{ marginTop: 10, flexDirection: "row", alignItems: "center" }}>
+                <Text>Enable/Disable </Text>
+                <Switch onValueChange={this.onEnableDisable}
+                  value={this.state.enableDisable} />
+              </View>
             </View>
-          </View>
 
-          <View>{inputs}</View>
+            <View>{inputs}</View>
 
-        </ScrollView>
+          </ScrollView>
 
-        {/* </PreviousNextView> */}
-        {/* </Modal> */}
+          {/* </PreviousNextView> */}
+          {/* </Modal> */}
         </SafeAreaView>
       </View>
     )

diff --git a/ios/ReactNativeKeyboardManager/ReactNativeKeyboardManager.m b/ios/ReactNativeKeyboardManager/ReactNativeKeyboardManager.m
@@ -54,6 +54,10 @@ - (instancetype)init
     if (self) {
         Swizzle([RCTBaseTextInputView class], @selector(setDefaultInputAccessoryView_backup), @selector(setDefaultInputAccessoryView));
         Swizzle([RCTBaseTextInputView class], @selector(setDefaultInputAccessoryView), @selector(setDefaultInputAccessoryView_avoid));
+
+        // set LayoutIfNeededOnUpdate to YES to prevent problems with SateArea
+        // https://github.com/hackiftekhar/IQKeyboardManager/issues/1687#issuecomment-721618667
+        [[IQKeyboardManager shared] setLayoutIfNeededOnUpdate:YES];
     }
     return self;
 }
@@ -108,6 +112,11 @@ - (dispatch_queue_t)methodQueue
     [[IQKeyboardManager shared] setKeyboardDistanceFromTextField:distance];
 }
 
+RCT_EXPORT_METHOD(setLayoutIfNeededOnUpdate: (BOOL) enabled) {
+    if (debugging) RCTLogInfo(@"KeyboardManager.setLayoutIfNeededOnUpdate: %d", enabled);
+    [[IQKeyboardManager shared] setLayoutIfNeededOnUpdate:enabled];
+}
+
 // UIToolbar handling
 
 RCT_EXPORT_METHOD(setToolbarPreviousNextButtonEnable: (BOOL) enabled) {

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "react-native-keyboard-manager",
-	"version": "6.5.4-2",
+	"version": "6.5.4-3",
 	"description": "Library that allows to prevent issues of keyboard sliding up and cover on React-Native iOS projects. ⚛",
 	"private": false,
 	"types": "index.d.ts",