How can I scroll to the current TextInput in a scrollView when focussed? I have applied a custom keyboard that opens up onFocus. I tried
scrollTo({y: heightFromTopOfInput + heightOfKeyboard, animated : true})
But this leads to uneven scroll. For some input, this works fine, but in most cases, it scrolls to too much bottom than the focused input. How can I get the perfect y coordinate to scrollTo when input is focused?
My screen something like this
Update :
I am now using the following function to scroll to my focused input. But still not working.
// inputRef is ref to current input
scrollToCurrentInput = inputRef => {
if (inputRef) {
inputRef.current.measureLayout(this.scrollViewRef.current, (x, y) => {
if (y - keyboardHeight < 0) {
return;
} else {
const {height} = Dimensions.get('screen');
const keyboardScreenY = keyboardHeight;
let scrollOffsetY = y - keyboardScreenY + (height * 11) / 100;
this.scrollViewRef.current.scrollTo({
x: 0,
animated: true,
y: scrollOffsetY,
});
}
});
}
};
Here [https://github.com/iamrohitagg/react-native-keyboard-android-ios] (https://github.com/iamrohitagg/react-native-keyboard-android-ios) is a repo for the same. It has minimal reproducible example