Add support for viewOffset and viewPosition to maintainVisibleContentPosition

[ryanlntn]

Summary:

When building a chat like application with FlatList maintainVisibleContentPosition works great but if you happen to get a particularly lengthy message (i.e. longer than the list container) it will scroll to the end instead of the top of the new message. This can be worked around with scrollToIndex({ animated: true, index: 0, viewPosition: 1 }) but requires an extra round trip that can make coordination tricky. This adds support for viewOffset and viewPosition to maintainVisibleContentPosition giving it the same level of control as scrollToIndex.

Changelog:

[GENERAL] [ADDED] - Add support for viewOffset and viewPosition to maintainVisibleContentPosition

Test Plan:

Here's a quick demo:

Simulator.Screen.Recording.-.iPhone.15.Pro.Max.-.2024-06-10.at.15.47.44.mp4

maintainVisibleContentPosition can now be modified with viewOffset and viewPosition just as in scrollToIndex.

<FlatList
  data={data ?? []}
  inverted
  maintainVisibleContentPosition={{
    autoscrollToTopThreshold: 9999,
    minIndexForVisible: 0,
    viewOffset: -16,
    viewPosition: 1,
  }}
  renderItem={({item, index}) => (<Item item={item} isFirst={index === 0} />)}
/>

[analysis-bot]

Platform	Engine	Arch	Size (bytes)	Diff
android	hermes	arm64-v8a	20,249,343	+3
android	hermes	armeabi-v7a	n/a	--
android	hermes	x86	n/a	--
android	hermes	x86_64	n/a	--
android	jsc	arm64-v8a	23,454,886	-6
android	jsc	armeabi-v7a	n/a	--
android	jsc	x86	n/a	--
android	jsc	x86_64	n/a	--

Base commit: e686b43
Branch: main

[liylmn]

After adding mainVisibleContentPosition, adding data to the bottom of the invested flatlist iOS will cause shaking. Is there any good way to solve this problem? thanks

[ryanlntn]

After adding mainVisibleContentPosition, adding data to the bottom of the invested flatlist iOS will cause shaking. Is there any good way to solve this problem? thanks

Are you resizing or reordering the existing items? That's typically when I saw glitchy behavior like that and is a known limitation of the current implementation of maintainVisibleContentPosition.

[liylmn]

@ryanlntn Thank you for your answer. My data is indeed reordered. I saw the official document has a solution. Can you share it?