Flatlist scrollToIndex scrolls item all the way to the top of the list and produces whitespace

[velevtzvetlin]

• I have reviewed the documentation
• I have searched existing issues
• I am using the latest React Native version

I am rendering a flatlist and on iOS, when scrolltoindex is called on a item that is close to the bottom of the list, it is pushed to the top and leaves whitespace below it. When you touch the list, it snaps back down. On android it works perfectly. I would like to add that get item layout is implemented.

Environment

Environment:
OS: macOS High Sierra 10.13.2
Node: 7.10.1
Yarn: Not Found
npm: 4.2.0
Watchman: 4.9.0
Xcode: Xcode 9.2 Build version 9C40b
Android Studio: Not Found

Packages: (wanted => installed)
react: 16.2.0 => 16.2.0
react-native: 0.52.0 => 0.52.0

Steps to Reproduce

Expected Behavior

Expected behavior is what happens on android, it will only scroll a item far enough to leave whatever is below it without any whitespace under the last item.

[react-native-bot]

Thanks for posting this! It looks like your issue may refer to an older version of React Native. Can you reproduce the issue on the latest release, v0.55?

Thank you for your contributions.

[velevtzvetlin]

upgraded still same issue. There are items above the index that is scrolled to

[scottmas]

Can confirm this is happening on React Native 55.4. And similar to the post, it only happens on ios.

I have to do some janky logic to offset the scroll position by the max number of rows that can be rendered at a time. Like

//Scroll to last item
let scrollIndex = data.length - 1; 

//Correct for the bug
const maxNumRows = Math.floor(windowHeight / ROW_HEIGHT);
if (data.length - scrollIndex < maxNumRows) {
  const diff = maxNumRows - (data.length - scrollIndex) - 2;
  scrollIndex = scrollIndex - diff;
}

[elicwhite]

Is this related to this PR? #22769

[scottmas]

Yes, that PR appears as though it would fix it.

[elicwhite]

Can you test it on your problem and verify?

[scottmas]

I think so. Is the RN build process complicated or can I just point my package.json at his forked repo?

[elicwhite]

https://facebook.github.io/react-native/docs/building-from-source