如何在React Native中创建自定义可折叠标头？

Question

以下是我要实现的演示屏幕。

因此，我想做的是，当我向上滑动绿色区域时，我希望黄色区域与之同时向上移动，以及下面的蓝色框区域（FlatList在我的情况下）。

当黄色区域最终被隐藏时，我希望绿色区域停留在屏幕顶部，并且用户可以在下面的蓝色框区域中滚动。

如何使用API PanResponder和AnimatedAPI？据我所知，可以使用插值来完成，但是在这种情况下我无法获得逻辑。