How to use the react-native-web.Animated.timing function in react-native-web

To help you get started, we’ve selected a few react-native-web examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github Beven91 / react-native-on-web / packages / react-native-on-web / src / Components / Modal / Modal.js View on Github external
slideAnimation() {
    let toValue = this.props.visible ? 1 : 0;
    // circle,cubic,ease,in,inOut,out,linear
    return Animated.timing(this.translateX, { toValue: toValue, duration: 260, easing: Easing.inOut(Easing.ease) });
  }
github alloy / relational-theory / app / containers / react-native-web / artist / inverted_button.tsx View on Github external
componentDidUpdate(prevProps: any, prevState: any) {
    if (this.props.selected !== prevProps.selected) {
      const duration = AnimationDuration
      Animated.parallel([
        Animated.timing(this.state.textOpacity, { toValue: 1, duration }),
        Animated.timing(this.state.backgroundColor, { toValue: this.props.selected ? 1 : 0, duration }),
      ]).start(this.props.onSelectionAnimationFinished)
    }
  }
github Beven91 / react-native-on-web / packages / react-native-on-web / src / Components / ToastAndroid / ToastAndroid.js View on Github external
scaleAnimation() {
    return Animated.timing(this.state.scale, { toValue: this.state.toScale, duration: 200 });
  }
github alloy / relational-theory / app / containers / react-native-web / artist / inverted_button.tsx View on Github external
componentDidUpdate(prevProps: any, prevState: any) {
    if (this.props.selected !== prevProps.selected) {
      const duration = AnimationDuration
      Animated.parallel([
        Animated.timing(this.state.textOpacity, { toValue: 1, duration }),
        Animated.timing(this.state.backgroundColor, { toValue: this.props.selected ? 1 : 0, duration }),
      ]).start(this.props.onSelectionAnimationFinished)
    }
  }
github Beven91 / react-native-on-web / packages / react-native-on-web / src / Components / Modal / Modal.js View on Github external
fadeAnimation() {
    let toValue = this.props.visible ? 1 : 0;
    return Animated.timing(this.opacity, { toValue: toValue, duration: 300 });
  }