动画在收到正值时从屏幕上消失答案

【问题标题】：Animation comes off the screen when it receives a positive value reactNative动画在收到正值时从屏幕上消失
【发布时间】：2020-06-04 21:36:21
【问题描述】：

当它收到一个正值时屏幕外的动画

为什么它会离开屏幕为了让它留在屏幕上，我必须给它一个负值（例如 -30）

const animation = useRef(new Animated.Value(0)).current;

const left = animation.interpolate({
  inputRange: [0, 1],
  outputRange: [0, 30],
});

const onClick = () => {
  Animated.timing(animation, {
    toValue: 30,
    duration: 1000,
    useNativeDriver: true,
  }).start();
};

return (
  <>
    <View>
      <Animated.View
        style={{
          backgroundColor: "red",
          width: 100,
          height: 100,
          transform: [{ translateX: left }],
          margin: 20,
        }}
      />
    </View>
  </>
);

export default App;

【问题讨论】：

标签： react-native react-animated

【解决方案1】：

const onClick = () => {
    Animated.timing(animation, {
      toValue: 1, //CHANGE THIS TO ONE IN YOUR CODE
      duration: 1000,
      useNativeDriver: true,
    }).start();
  };

您正在对一个达到 30 的值进行插值！但你的输入是 0 到 1！

希望对你有帮助

【讨论】：