我正在尝试使用<FlatList>
'ssnapToOffsets
和复制这种效果stickyHeaderIndices
,其中卡片相互滑动并粘在顶部。
https://i.imgur.com/EY37RKS.gifv
这是我的代码:
<FlatList
horizontal={false}
data={posts}
initialNumToRender={5}
pagingEnabled={false}
decelerationRate={0}
// the first PostCard starts 44 from the top and then each one is 164 tall
snapToOffsets={[...Array(posts.length)].map(
(_, i) => 44 + i * 164
)}
// I want every single item in the FlatList to be sticky, but this isn't working
stickyHeaderIndices={[...Array(posts.length)]}
contentContainerStyle={{ width }}
keyExtractor={(item) => item.id}
renderItems={({ item, index }) => (
<PostCard {...item} style={{ zIndex: index }}/>
)}
/>
实际上没有任何东西最终会粘在顶部。snapToOffsets
为我工作,但stickyHeaderIndices
根本不工作。
如果我尝试将硬编码的数组传递给stickyHeaderIndices
like [0,1,2,3...20]
,那么中间某处的一个随机帖子最终会粘住,而其他任何东西都不会。
我检查了 SO 和 Github 上的每个搜索结果,但没有任何效果,我已经尝试了好几天。请帮忙!