如何检查用户是否在react native中滚动到顶部

Question

我面临一个问题，当用户开始滚动时，我需要将标题文本的位置从左更改为中心，如果用户滚动到顶部，则需要将标题文字的位置从右更改为左。但我找不到解决方案。我使用的是滚动视图，里面有很多内容。有人能告诉我怎么做吗？

Answer 1

您可以在这里找到解决方案：

点击此处

<ScrollView
onScroll={({nativeEvent})=>{
if(isCloseToTop(nativeEvent)){
//do something
}
if(isCloseToBottom(nativeEvent)){
//do something
}
}}
>
...contents
</ScrollView>

isCloseToBottom({layoutMeasurement, contentOffset, contentSize}){
return layoutMeasurement.height + contentOffset.y >= contentSize.height - 20;
}

ifCloseToTop({layoutMeasurement, contentOffset, contentSize}){
return contentOffset.y == 0;
}

Answer 2

尝试这种方式

import React, { useState, useEffect } from "react";
function Example() {
const [scrollPosition, setScrollPosition] = useState(-1);
useEffect(() => {
// console.log("scrollPosition: ", scrollPosition);
if (scrollPosition === 0) {
// condition is true when scroll on top
}
}, [scrollPosition]);
const getscrollposition = (e) => {
const y = e.nativeEvent.contentOffset.y;
setScrollPosition(y);
};
return (
<ScrollView
onMomentumScrollEnd={getscrollposition}
scrollEventThrottle={16}
>
.....
</ScrollView>
);
}