-
-
Notifications
You must be signed in to change notification settings - Fork 1.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix spring bug with extra type verification #4512
Conversation
I need this change, please 馃憤 |
I have found a issue when we set stiffness to 0: Screen.Recording.2023-06-06.at.12.07.51.movReprocodeimport Animated, {
useSharedValue,
withTiming,
withSpring,
useAnimatedStyle,
Easing,
} from 'react-native-reanimated';
import { View, Button } from 'react-native';
import React from 'react';
export default function AnimatedStyleUpdateExample(): React.ReactElement {
const randomWidth = useSharedValue(10);
const style = useAnimatedStyle(() => {
return {
width: withSpring(randomWidth.value, { duration: 1000, stiffness: 0 }),
};
});
return (
<View
style={{
flex: 1,
flexDirection: 'column',
}}>
<Animated.View
style={[
{ width: 100, height: 80, backgroundColor: 'black', margin: 30 },
style,
]}
/>
<Button
title="toggle"
onPress={() => {
randomWidth.value = Math.random() * 300 + 50;
}}
/>
</View>
);
} |
@@ -112,6 +136,7 @@ export function withSpring( | |||
animation: SpringAnimation | |||
) { | |||
return ( | |||
previousAnimation?.startTimestamp && |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I ask just in case 馃槄 Do you know that, when startTimestamp
will be equal 0
then previousAnimation?.startTimestamp = false
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes I do, we have already identical assertion in timing.ts
src/reanimated2/animation/spring.ts
Outdated
else { | ||
animation.current = toValue; | ||
animation.lastTimestamp = 0; | ||
console.log('STOP'); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
we need to remove this console.log
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can we add the line below to eslint config? I've tested it and it works good
'no-console': ['error', { allow: ['warn', 'error'] }],
@@ -56,6 +73,16 @@ export function withSpring( | |||
return true; | |||
} | |||
|
|||
if (config.isWrongConfig) { | |||
// We don't animate wrong config | |||
if (config.useDuration) return false; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is it possible to have invalid configuration when we computing duration? 馃
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, so I've added conditional to instantly return 0 in such a case.
4163f0b
to
40eb055
Compare
40eb055
to
a173ee7
Compare
@@ -56,6 +78,15 @@ export function withSpring( | |||
return true; | |||
} | |||
|
|||
if (config.configIsInvalid) { | |||
// We don't animate wrong config | |||
if (config.useDuration) return false; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I am afraid if this condition could be a cause of infinity loop. I think that we should end the animation here, why you want to continue animation?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To wait the duration time.
Summary
There is a need to check if velocity from previous animation is undefined.
(Hopefully such a bugs will be soon reported by typescript 馃槉)
Closes #4510
Screen.Recording.2023-05-31.at.14.58.58.mov
Screen.Recording.2023-05-31.at.14.55.20.mov