Merge pull request #7 from 10play/fix-android-focus

fix: android focus
10play · Feb 5, 2024 · e9d8fb8 · e9d8fb8
2 parents 7019aa7 + 546f41e
commit e9d8fb8
Showing 1 changed file with 15 additions and 9 deletions.
diff --git a/src/RichText/RichText.tsx b/src/RichText/RichText.tsx
@@ -45,7 +45,7 @@ export const RichText = ({
   avoidIosKeyboard,
   autofocus,
 }: RichTextProps) => {
-  const { keyboardHeight: iosKeyboardHeight } = useKeyboard();
+  const { keyboardHeight: iosKeyboardHeight, isKeyboardUp } = useKeyboard();
   const source: WebViewProps['source'] = DEV
     ? { uri: DEV_SERVER_URL }
     : { html: customSource || editorHTML };
@@ -72,16 +72,22 @@ export const RichText = ({
 
   useEffect(() => {
     if (editor.webviewRef.current && Platform.OS === 'android') {
-      if (iosKeyboardHeight) {
-        editor.webviewRef.current.injectJavaScript(`
-          document.querySelector('.ProseMirror').style.paddingBottom = '${TOOLBAR_HEIGHT}px';
-        `);
-        editor.updateScrollThresholdAndMargin(TOOLBAR_HEIGHT);
+      if (iosKeyboardHeight && isKeyboardUp) {
+        setTimeout(() => {
+          editor.webviewRef.current &&
+            editor.webviewRef.current.injectJavaScript(`
+            document.querySelector('.ProseMirror').style.paddingBottom = '${TOOLBAR_HEIGHT}px';
+          `);
+          editor.updateScrollThresholdAndMargin(TOOLBAR_HEIGHT);
+        }, 200);
       } else {
-        editor.webviewRef.current.injectJavaScript(`
+        setTimeout(() => {
+          editor.webviewRef.current &&
+            editor.webviewRef.current.injectJavaScript(`
           document.querySelector('.ProseMirror').style.paddingBottom = '0px';
         `);
-        editor.updateScrollThresholdAndMargin(0);
+          editor.updateScrollThresholdAndMargin(0);
+        }, 200);
       }
     }
     // On iOS we want to control the scroll and not use the scrollview that comes with react-native-webview
@@ -105,7 +111,7 @@ export const RichText = ({
         editor.updateScrollThresholdAndMargin(0);
       }
     }
-  }, [avoidIosKeyboard, editor, iosKeyboardHeight]);
+  }, [avoidIosKeyboard, editor, iosKeyboardHeight, isKeyboardUp]);
 
   return (
     <>