从ScrollView的ScrollY位置有条件触发Animated.timing

Question

我为整个应用程序的屏幕创建了一个模板。该模板利用动画标题组件来响应 ScrollView 内容的滚动位置。

我可以使用这个scrollY变量来插入项目，但我不知道如何使用该变量来触发Animated.timing事件。

简单来说：

• if (ScrollY > 30) do Animated.timing one
• if (ScrollY < 30) do Animated.timing Two

现在我已经创建了一个不充分的使用 Animated.event() 侦听器 的解决方法：

<ScrollView
onScroll={Animated.event(
  [{ nativeEvent: { contentOffset: { y: scrollListener } } }],
  {
    listener: (event) => {
      handleScroll(event);
    },
  }
)}
 ...

handleScroll(event) 控制 Animated.timing 事件数组，每个事件都会操作有条件地从 setScrollPosition() useState 变量：

const [scrollPosition, setScrollPosition] = useState(0);
const fixedHeaderTranslatePosition = useRef(new Animated.Value(4)).current;

const handleScroll = (event) => {

setScrollPosition(
  event.nativeEvent.contentOffset.y +
    (Platform.OS === 'ios' ? HEADER_MAX_HEIGHT : 0)
);

if (scrollPosition > 30 && headerType === 'Animated') {
  Animated.timing(fixedHeaderTranslatePosition, {
    toValue: 0,
    useNativeDriver: true,
  }).start();

...

}

虽然我的努力确实创建了一个功能组件，但存在一些小问题。 首先，event.nativeEvent.contentOffset.y 似乎会导致 Android 设备出现延迟。这在 fixedHeaderTranslatePosition 中最为明显。

此外，从逻辑上讲，利用 Animated.event 中已声明的 scrollListener 会更有意义。所以我的问题是：如何在 handleScroll() 中使用 ScrollY 变量 (scrollListener)？