Skip to content

FlatList snapToInterval is not precise in long list #21441

@chicken-suop

Description

@chicken-suop

Environment

Environment:
OS: macOS 10.14
Node: 8.12.0
Yarn: Not Found
npm: 6.4.1
Watchman: 4.9.0
Xcode: Not Found
Android Studio: 3.2 AI-181.5540.7.32.5014246

Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: https://github.com/expo/react-native/archive/sdk-29.0.0.tar.gz => 0.55.4

Description

I'm using the FlatList component with around 50 elements. When my element height (and subsequently snapToInterval prop) are set to floats, rather than integers, there seems to be a proportionality increasing offset from the correct interval to snap to. The affect of this is very noticeable with a lot of elements. The further I scroll down a list the bigger the offset, so that when I get to the bottom, it's very noticeable.

This offset is still there with integers, but it's a lot less pronounced.
Screenshots:

First two are with height set to 105.14285714285714, which is an iPhone 6s Plus' height divided by seven. The last two have height set to 105, which is just the truncated version of the previous height.

Height: 105.14285714285714 (at bottom):
105 14285714285714 at bottom

Height: 105.14285714285714 (second from top):
105 14285714285714 second from top

Height: 105 (at bottom):
105 at bottom

Height: 105 (second from top):
105 second from top

Reproducible Demo

https://snack.expo.io/@elliotschep/flatlist-snaptointerval-is-not-precise-in-long-list

Metadata

Metadata

Assignees

No one assigned

    Labels

    BugComponent: FlatListStaleThere has been a lack of activity on this issue and it may be closed soon.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions