AvoidSoftInputView breaks with screen swipe #54

nucleartux · 2022-04-01T16:52:46Z

Environment

Library version: 2.4.1
OS version: iPhone 13, iOS 15.4
"@react-navigation/native": "^6.0.8",
"@react-navigation/native-stack": "^6.6.1",

Affected platforms

Android
iOS

Current behavior

Simulator.Screen.Recording.-.iPhone.13.-.2022-04-01.at.20.47.27.mp4

Expected behavior

Keyboard avoid view

Reproduction

Open screen
Focus keyboard
Start swiping back
Cancel swipe
Simplified code:

 <View style={styles.container}>
      <AvoidSoftInputView style={styles.container} avoidOffset={16}>
        <ImageBackground
          source={require("./bg.png")}
          imageStyle={styles.bgImage}
          resizeMode="repeat"
          style={styles.bg}
        >
          <FlatList />
        </ImageBackground>
        <View style={styles.bottom}>
          <TextInput />
        </View>
      </AvoidSoftInputView>
      <SafeAreaView style={styles.footer} edges={["bottom"]} />
    </View>

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  ...
})

And I have related question: now, when I swipe screen keyboard still present but keyboard avoid view smoothly disappears (and content scrolls down). How I can prevent this behavior?

The text was updated successfully, but these errors were encountered:

a-eid · 2022-04-01T16:58:21Z

I think you should not use AvoidSoftInputView, could you try setEnable(true) when the screen is active & setEanble(false) when it's not ?

nucleartux · 2022-04-01T17:14:23Z

I deleted AvoidSoftInputView and added this code:

  const onFocusEffect = useCallback(() => {
    AvoidSoftInput.setEnabled(true); 
    return () => {
      AvoidSoftInput.setEnabled(false);
    };
  }, []);

  useFocusEffect(onFocusEffect);

Now it completely hides navigation header. How I can fix that?

Simulator.Screen.Recording.-.iPhone.13.-.2022-04-01.at.21.13.04.mp4

And anyway bug still present. Even if I try to disable on transition start:

  useEffect(() => {
    const unsubscribe = navigation.addListener("transitionStart", () => {
      AvoidSoftInput.setEnabled(false);
    });

    return unsubscribe;
  }, [navigation]);

mateusz1913 · 2022-04-02T20:02:46Z

Hi @nucleartux

And I have related question: now, when I swipe screen keyboard still present but keyboard avoid view smoothly disappears (and content scrolls down). How I can prevent this behavior?

That's default iOS behavior, keyboard is still fully visible, even though app receives events from UIResponder.keyboardWillChangeFrameNotification:

first when swipe is started - from: "keyboardCoordinatesWhenItIsVisible", to: "keyboardCoordinatesWhenItIsDismissed"
second when swipe is aborted - from: "keyboardCoordinatesWhenItIsDismissed", to: "keyboardCoordinatesWhenItIsVisible").

I don't know if it can be prevented, you can try with writing your own logic for applying padding to your container based on useSoftInputShown & useSoftInputHidden hooks, but I don't guarantee, that it will make a satisfying result.

mateusz1913 · 2022-04-02T20:27:55Z

@nucleartux issue is fixed and available in version 2.4.2 🎉

nucleartux · 2022-04-03T07:59:35Z

@mateusz1913 hello
I updated library and added screenOptions. Now screen (avoid soft input part) moves together with keyboard but still breaks on swipe cancel. So it's expected behaviour, right?

Simulator.Screen.Recording.-.iPhone.13.-.2022-04-03.at.11.55.37.mov

mateusz1913 · 2022-04-03T08:11:15Z

On the provided video, after you cancel swipe, can you scroll to the very bottom (so the input and all messages are visible as it was before the swipe)?

If not, please create reproduction repo and link it in issue's description, so I will be able to investigate and reopen this issue

nucleartux · 2022-04-03T08:21:02Z

It's not possible.

Simulator.Screen.Recording.-.iPhone.13.-.2022-04-03.at.12.19.28.mov

I will try to make repro demo.

nucleartux · 2022-04-03T09:02:40Z

I'm in process of repro but found another bug(?). Can you help me investigate it?
https://github.com/nucleartux/TestProject

Simulator.Screen.Recording.-.iPhone.13.-.2022-04-03.at.12.58.32.mp4

nucleartux · 2022-04-03T09:35:22Z

Ok I get it. If you add avoidOffset={16} to my demo it will collapse keyboard after swipe cancel.
Without avoidOffset it adds height every time swipe canceled.

So maybe it's two separate bugs, i'm not sure.

mateusz1913 · 2022-04-03T12:38:24Z

I downloaded your repo and can't reproduce behavior from video

Simulator.Screen.Recording.-.iPhone.13.-.2022-04-03.at.14.35.28.mp4

I added nice Swift package ShowTime, so you will see where I make touches

nucleartux · 2022-04-03T13:20:33Z

How it is even possible? I tried delete node_modules and pods and reinstall everything again but bug still exists.

mateusz1913 · 2022-04-03T13:21:53Z

Which simulator, do you use?

nucleartux · 2022-04-03T13:23:10Z

Simulator. iPhone 13, iOS 15.4

mateusz1913 · 2022-04-03T13:25:11Z

Weird. I will try on real device

nucleartux · 2022-04-03T13:34:10Z

I tried on real device (iPhone X, latest iOS) - same bug.

mateusz1913 · 2022-04-03T13:35:38Z

Ok, I reproduced on real device. Will investigate it and probably create separate ticket.

In the meantime, please prepare that chat repro and I will reopen this ticket

mateusz1913 · 2022-04-03T13:38:35Z

I will track second one here: #59

nucleartux · 2022-04-03T13:48:43Z

I made separate branch for this issue https://github.com/nucleartux/TestProject/tree/issue-54

Simulator.Screen.Recording.-.iPhone.13.-.2022-04-03.at.17.47.27.mp4

mateusz1913 · 2022-04-03T14:42:41Z

@nucleartux Can you try following patch?

diff --git a/node_modules/react-native-avoid-softinput/ios/AvoidSoftInputManager.swift b/node_modules/react-native-avoid-softinput/ios/AvoidSoftInputManager.swift
index 3f30b5a..685dd3f 100644
--- a/node_modules/react-native-avoid-softinput/ios/AvoidSoftInputManager.swift
+++ b/node_modules/react-native-avoid-softinput/ios/AvoidSoftInputManager.swift
@@ -34,6 +34,8 @@ class AvoidSoftInputManager: NSObject {
     private var showDelay: Double = SHOW_ANIMATION_DELAY_IN_SECONDS
     private var showDuration: Double = SHOW_ANIMATION_DURATION_IN_SECONDS
     private var softInputVisible: Bool = false
+    private var wasAddOffsetInRootViewAborted = false
+    private var wasAddOffsetInScrollViewAborted = false
     
     func setAvoidOffset(_ offset: NSNumber) {
         avoidOffset = CGFloat(offset.floatValue)
@@ -157,7 +159,7 @@ class AvoidSoftInputManager: NSObject {
     
     private func decreaseOffsetInRootView(from: CGFloat, to: CGFloat, rootView: UIView) {
         let addedOffset = to - from
-        let newBottomOffset = isShowAnimationRunning ? bottomOffset : bottomOffset + addedOffset
+        let newBottomOffset = isShowAnimationRunning || wasAddOffsetInRootViewAborted ? bottomOffset : bottomOffset + addedOffset
         
         if newBottomOffset < 0 {
             return
@@ -175,7 +177,7 @@ class AvoidSoftInputManager: NSObject {
     
     private func increaseOffsetInRootView(from: CGFloat, to: CGFloat, rootView: UIView) {
         let addedOffset = to - from
-        let newBottomOffset = isHideAnimationRunning ? bottomOffset : bottomOffset + addedOffset
+        let newBottomOffset = isHideAnimationRunning || wasAddOffsetInRootViewAborted ? bottomOffset : bottomOffset + addedOffset
         
         if newBottomOffset < 0 {
             return
@@ -211,6 +213,7 @@ class AvoidSoftInputManager: NSObject {
     
     private func addOffsetInRootView(_ offset: CGFloat, firstResponder: UIView, rootView: UIView) {
         guard let firstResponderPosition = firstResponder.superview?.convert(firstResponder.frame.origin, to: nil) else {
+            wasAddOffsetInRootViewAborted = true
             return
         }
         
@@ -221,13 +224,15 @@ class AvoidSoftInputManager: NSObject {
         
         let firstResponderDistanceToBottom = UIScreen.main.bounds.size.height - (firstResponderPosition.y + firstResponder.frame.height) - bottomSafeInset
         
-        let newOffset = max(offset - firstResponderDistanceToBottom, 0) + avoidOffset
+        let newOffset = max(offset - firstResponderDistanceToBottom, 0)
 
         if (newOffset <= 0) {
+            wasAddOffsetInRootViewAborted = true
             return
         }
         
-        bottomOffset = newOffset
+        wasAddOffsetInRootViewAborted = false
+        bottomOffset = newOffset + avoidOffset
         
         beginShowAnimation(initialOffset: 0, addedOffset: bottomOffset)
         UIView.animate(withDuration: showDuration, delay: showDelay, options: [.beginFromCurrentState, easingOption]) {
@@ -265,7 +270,7 @@ class AvoidSoftInputManager: NSObject {
     
     private func decreaseOffsetInScrollView(from: CGFloat, to: CGFloat, firstResponder: UIView, scrollView: UIScrollView, rootView: UIView) {
         let addedOffset = to - from
-        let newBottomOffset = isShowAnimationRunning ? bottomOffset : bottomOffset + addedOffset
+        let newBottomOffset = isShowAnimationRunning || wasAddOffsetInScrollViewAborted ? bottomOffset : bottomOffset + addedOffset
         let scrollToOffset = getScrollToOffset(softInputHeight: to, firstResponder: firstResponder, scrollView: scrollView, rootView: rootView)
         
         if newBottomOffset < 0 {
@@ -291,7 +296,7 @@ class AvoidSoftInputManager: NSObject {
     
     private func increaseOffsetInScrollView(from: CGFloat, to: CGFloat, firstResponder: UIView, scrollView: UIScrollView, rootView: UIView) {
         let addedOffset = to - from
-        let newBottomOffset = isHideAnimationRunning ? bottomOffset : bottomOffset + addedOffset
+        let newBottomOffset = isHideAnimationRunning || wasAddOffsetInScrollViewAborted ? bottomOffset : bottomOffset + addedOffset
         let scrollToOffset = getScrollToOffset(softInputHeight: to, firstResponder: firstResponder, scrollView: scrollView, rootView: rootView)
         
         if newBottomOffset < 0 {
@@ -344,6 +349,7 @@ class AvoidSoftInputManager: NSObject {
         }
         
         guard let scrollViewPosition = scrollView.superview?.convert(scrollView.frame.origin, to: nil) else {
+            wasAddOffsetInScrollViewAborted = true
             return
         }
         
@@ -351,13 +357,15 @@ class AvoidSoftInputManager: NSObject {
         
         let scrollToOffset = getScrollToOffset(softInputHeight: offset, firstResponder: firstResponder, scrollView: scrollView, rootView: rootView)
         
-        let newOffset = max(offset - scrollViewDistanceToBottom, 0) + avoidOffset
+        let newOffset = max(offset - scrollViewDistanceToBottom, 0)
         
         if newOffset <= 0 {
+            wasAddOffsetInScrollViewAborted = true
             return
         }
         
-        bottomOffset = newOffset
+        wasAddOffsetInScrollViewAborted = false
+        bottomOffset = newOffset + avoidOffset
         
         if !softInputVisible {
             // Save original scroll insets

I think it should resolve both issues

nucleartux · 2022-04-03T15:04:59Z

Tested on repro and real project, works fine!
You saved my life 🕺

nucleartux · 2022-04-03T15:09:26Z

But one question. It works fine with fullScreenGestureEnabled enabled but without it on swipe flat list goes under keyboard (video in very first post). Can I somehow workaround it and with disabled fullScreenGestureEnabled?

It's just question, issue is solved anyway.

mateusz1913 · 2022-04-03T15:10:40Z

I'll check that, probably it shouldn't work like that

mateusz1913 · 2022-04-03T15:13:27Z

Ah, ok, I misunderstood your question. So I guess that fullScreenGestureEnabled option is making keyboard interactive when dismissing it

mateusz1913 · 2022-04-03T16:09:35Z

Fix is available in v2.4.3

nucleartux added the bug Something isn't working label Apr 1, 2022

mateusz1913 self-assigned this Apr 2, 2022

mateusz1913 added a commit that referenced this issue Apr 2, 2022

fix(#54): incorrect offset when screen swiping on iOS

d22783c

mateusz1913 mentioned this issue Apr 2, 2022

fix(#54): incorrect offset when screen swiping on iOS #56

Merged

2 tasks

mateusz1913 closed this as completed in #56 Apr 2, 2022

mateusz1913 added a commit that referenced this issue Apr 2, 2022

fix(#54): incorrect offset when screen swiping on iOS (#56)

232715c

mateusz1913 reopened this Apr 3, 2022

mateusz1913 added a commit that referenced this issue Apr 3, 2022

fix(#54, #59): screen swipe incorrect offsets

ccadb80

mateusz1913 mentioned this issue Apr 3, 2022

fix(#54, #59): screen swipe incorrect offsets #60

Merged

2 tasks

mateusz1913 added a commit that referenced this issue Apr 3, 2022

fix(#54, #59): screen swipe incorrect offsets

f77ad19

mateusz1913 closed this as completed in #60 Apr 3, 2022

mateusz1913 added a commit that referenced this issue Apr 3, 2022

fix(#54, #59): screen swipe incorrect offsets (#60)

a4415a4

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

AvoidSoftInputView breaks with screen swipe #54

AvoidSoftInputView breaks with screen swipe #54

nucleartux commented Apr 1, 2022 •

edited

a-eid commented Apr 1, 2022

nucleartux commented Apr 1, 2022 •

edited

mateusz1913 commented Apr 2, 2022

mateusz1913 commented Apr 2, 2022 •

edited

nucleartux commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

nucleartux commented Apr 3, 2022

nucleartux commented Apr 3, 2022

nucleartux commented Apr 3, 2022 •

edited

mateusz1913 commented Apr 3, 2022

nucleartux commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022 •

edited

nucleartux commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

nucleartux commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

nucleartux commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

nucleartux commented Apr 3, 2022

nucleartux commented Apr 3, 2022 •

edited

mateusz1913 commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

AvoidSoftInputView breaks with screen swipe #54

AvoidSoftInputView breaks with screen swipe #54

Comments

nucleartux commented Apr 1, 2022 • edited

Environment

Affected platforms

Current behavior

Expected behavior

Reproduction

a-eid commented Apr 1, 2022

nucleartux commented Apr 1, 2022 • edited

mateusz1913 commented Apr 2, 2022

mateusz1913 commented Apr 2, 2022 • edited

nucleartux commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

nucleartux commented Apr 3, 2022

nucleartux commented Apr 3, 2022

nucleartux commented Apr 3, 2022 • edited

mateusz1913 commented Apr 3, 2022

nucleartux commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022 • edited

nucleartux commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

nucleartux commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

nucleartux commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

nucleartux commented Apr 3, 2022

nucleartux commented Apr 3, 2022 • edited

mateusz1913 commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

mateusz1913 commented Apr 3, 2022

nucleartux commented Apr 1, 2022 •

edited

nucleartux commented Apr 1, 2022 •

edited

mateusz1913 commented Apr 2, 2022 •

edited

nucleartux commented Apr 3, 2022 •

edited

mateusz1913 commented Apr 3, 2022 •

edited

nucleartux commented Apr 3, 2022 •

edited