APSL / react-native-keyboard-aware-scroll-view

A ScrollView component that handles keyboard appearance and automatically scrolls to focused TextInput.
MIT License
5.27k stars 646 forks source link

screen bouncing while focusing on of the input #418

Open ganesh-papola opened 4 years ago

ganesh-papola commented 4 years ago

Screen is bouncing up and down when jumping to any text input

jpamarohorta commented 4 years ago

I'm having the same problem

louisholley commented 4 years ago

have you got scrollEnabled={false} on the input? I took it off and it's working better

ganesh-papola commented 4 years ago

@louisholley well that should work but i need scroll enabled, so can't turn it off

thijs-qv commented 4 years ago

Try replacing

setTimeout(() => {
  if (!this.mountedComponent) {
    return
  }
  const responder = this.getScrollResponder()
  responder &&
    responder.scrollResponderScrollNativeHandleToKeyboard(
      reactNode,
      extraHeight,
      true
    )
}, keyboardOpeningTime)

with

if (this.mountedComponent) {
  UIManager.measureLayout(
    reactNode,
    0,
    () => {},
    (x, y, width, height) => {
      findNodeHandle(this._rnkasv_keyboardView), (x, y, width, height) => {
        this._rnkasv_keyboardView.scrollToPosition(0, parseInt(y) - height - extraHeight, true);
    }
  });
}

inside KeyboardAwareHOC.scrollToFocusedInput()

peterson79 commented 4 years ago

@thijs-qv solution worked for me, thank you!

steve228uk commented 4 years ago

Thanks @thijs-qv. Has a PR been submitted for this?

thijs-qv commented 4 years ago

I've just submitted a PR. Not sure if this library is actively maintained though.

JoseLion commented 4 years ago

I managed to solve it by setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER}, but it's just a workaround.

ntk0104 commented 4 years ago

I managed to solve it by setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER}, but it's just a workaround.

Thank you very much, you saved my day

serhiimahdiuk commented 4 years ago

I managed to solve it by setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER}, but it's just a workaround.

Solved! Thanks

cihanbas commented 4 years ago
 <KeyboardAwareScrollView
      scrollEnabled={true}
      extraScrollHeight={-64}
      keyboardShouldPersistTaps="handled"
      enableAutoAutomaticScroll={false}
      enableOnAndroid={true}
      keyboardOpeningTime={Number.MAX_SAFE_INTEGER}
      {...props}>
      {props.children}
</KeyboardAwareScrollView>

it is work for me

keremcubuk commented 3 years ago

I managed to solve it by setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER}, but it's just a workaround.

You saved our lives. Me and my pair friend spent a week for keyboards problems of react-native. We replaced the component for android problem but in IOS we spent too many for bouncing problem. God bless you! 🚀 :godmode:

mgwedd commented 3 years ago

I managed to solve it by setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER}, but it's just a workaround.

This also solved it for me. I'd like to know what the root cause is though and how to avoid it though.

biz-kevin commented 2 years ago

I managed to solve it by setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER}, but it's just a workaround.

WORKING :)

anhkieet commented 2 years ago

I managed to solve it by setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER}, but it's just a workaround.

Working, you saved my day

luchozamora commented 2 years ago

For those of you wondering (just like me): Number.MAX_SAFE_INTEGER is defined as 2^53 - 1, that is, 9007199254740991

The keyboardOpeningTime prop receives a number as miliseconds, so setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER} actually means:

So yea... that

sandipndev commented 2 years ago

Although If you set an extraHeight , this issue goes away

Pat-Gekoski commented 2 years ago

@JoseLion You should run for president! The world owes you for that fix!

vjoby-wavefin commented 2 years ago

@JoseLion You sir you have my respect, thanks for the workaround 👍

heyalexchoi commented 2 years ago

I managed to solve it by setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER}, but it's just a workaround.

~this just makes the view not scroll for me... as in the view doesn't avoid the keyboard...~ I had scrollEnabled set to false. setting that to true did improve the behavior.

scott-dang commented 1 year ago

I managed to solve it by setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER}, but it's just a workaround.

I was about to go bald, thanks!

ahsanbhatti98 commented 1 year ago

I managed to solve it by setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER}, but it's just a workaround.

After applying so many things it works finally Thanks 😊 🙏 . But can you explain how it works??

nibinb commented 1 year ago

I managed to solve it by setting keyboardOpeningTime={Number.MAX_SAFE_INTEGER}, but it's just a workaround.

Wow! Thanks a bunch my superhero!

pkayokay commented 1 year ago

keyboardOpeningTime={Number.MAX_SAFE_INTEGER} 🙇

MasonTModea commented 1 year ago

enableAutomaticScroll={Platform.OS === 'ios'} worked for me, keyboardOpeningTime={Number.MAX_SAFE_INTEGER} didn't