问题描述
我创建了一个平面列表,该列表的中心是屏幕中间的滑动动画,允许用户在x轴上滑动。我想存储用户滑动组件多远的值,然后再对该数字进行操作。问题是当我调用setSwipedistance并尝试以某种状态存储dx时,组件/平面列表卡在该位置。例如,如果用户从初始点向左或向右滑动100个单位,而不是弹回值0(初始点),则它现在停留在100上。我知道如果只删除setSwipedistance(dx ),但我需要状态中的数字来刷新我的单位列表。
关于如何完成动画和存储值的任何想法吗?
const DayView = () => {
const pan = useRef(new Animated.ValueXY()).current;
const [swipedistance,setSwipedistance] = useState(0);
const panResponder = useRef(
PanResponder.create({
onMoveShouldSetPanResponder: () => true,onPanResponderMove: Animated.event([
null,{ dx: pan.x,dy: pan.y },],{ useNativeDriver: false }),onPanResponderRelease: (e,{ dx }) => {
// eslint-disable-next-line no-console
Animated.spring(pan,{ tovalue: { x: 0,y: 0 },useNativeDriver: false }).start();
setSwipedistance(dx);
},}),).current;
return (
<View>
<Animated.FlatList
data={lessons}
renderItem={renderEvent}
keyExtractor={(item) => item.id.toString()}
onRefresh={() => fetchLessons(date)}
refreshing={refreshList}
style={{
transform: [{ translateX: pan.x }],}}
{...panResponder.panHandlers}
/>
</View>
);
};
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)