Javascript 如何在React Native中滚动时在特定位置设置视图的动画？

我正在尝试设置

视图的动画，以便在滚动时粘贴到某个位置。我使用的滚动组件是
FlatList

以下是我到目前为止所做的：


基本上，这就是我的
ProfileScreen.js的结构：

<View>
    <Animated.View /> --> The animated cover photo (includes the animated avatar as well)

    <Animated.FlatList /> --> This renders the list of images you see in the video. And a ListHeaderComponent renders the content from the name to the View of follow numbers
</View


InfoDisplay
包含后续编号
视图
。我知道我必须将其分离，并将其带到
配置文件屏幕
。我还试着用
选项卡定位
设置它的动画，但它没有像我想象的那样工作

你可以想象我的“目标”屏幕就像Twitter的个人资料屏幕，我的关注数字
视图
就像Twitter中的标签视图一样


请帮帮我。我将非常感激
计算跟随视图需要移动的距离，如图所示（设为x）


这里我取500作为补偿。您可以选择任何大于x的数字。（或使用屏幕高度）


即，如果x=200

const translateY = scrollY.interpolate({inputRange:[200, 700], outputRange:[200, 700], extrapolateLeft: 'clamp'});

逻辑是，当跟随视图在滚动时到达顶部时（即移动距离x）。它将以相同的滚动速度开始向下平移

将此translateY提供给后续视图

<Animated.View style={{...styles, transform: [{translateY}]}} />  // your  follow View

//您的跟随视图

我希望这对你有帮助
 计算跟随视图所需移动的距离，如图所示（设为x）


这里我取500作为补偿。您可以选择任何大于x的数字。（或使用屏幕高度）


即，如果x=200

const translateY = scrollY.interpolate({inputRange:[200, 700], outputRange:[200, 700], extrapolateLeft: 'clamp'});

逻辑是，当跟随视图在滚动时到达顶部时（即移动距离x）。它将以相同的滚动速度开始向下平移

将此translateY提供给后续视图

<Animated.View style={{...styles, transform: [{translateY}]}} />  // your  follow View

//您的跟随视图

我希望这对你有帮助
 你能分享最后的结果吗，库兹我没有Twitter应用程序！谢谢你，奥利弗。我在问题中添加了内容，你能分享最终结果吗，库兹我没有Twitter应用程序！谢谢你，奥利弗。我已经添加了问题内容，非常感谢@AswinC的帮助。我将尝试实现它，并对@AswinC的帮助表示感谢。我将尝试实现它并提供更新