Open enguerranws opened 4 years ago
Hi,
I need to make this confetti animation go below the device viewport. Right now, the confettis stops at the bottom of the screen, and disappear.
I would do it with custom styles, but I can't get it work :/ Digging in the code, I found a value that we could use, in confetti.js:
componentDidMount() { let {duration, index} = this.props; Animated.timing(this._yAnimation, { duration: duration + this.randomIntValue(duration * .2, duration * -.2), toValue: windowHeight + 1.25, // <=== here useNativeDriver: true }).start(this.props.onAnimationComplete); }
Maybe we could change it to:
componentDidMount() { let {duration, yDelta} = this.props; Animated.timing(this._yAnimation, { duration: duration + this.randomIntValue(duration * .2, duration * -.2), toValue: windowHeight + yDelta, useNativeDriver: true }).start(this.props.onAnimationComplete); }
With the relevant defaultProps:
Confetti.defaultProps = { duration: 6000, colors: [ "rgb(242.2, 102, 68.8)", "rgb(255, 198.9, 91.8)", "rgb(122.4, 198.9, 163.2)", "rgb(76.5, 193.8, 216.7)", "rgb(147.9, 99.4, 140.2)" ], size: 1, bsize: 1, yDelta: 1.25, }
I'm not sure about the naming (yDelta is probably not the best param name). However I have a branch ready to push.
I'm not sure that repo is still maintained. However, I forked it so we can still work on it : https://github.com/enguerranws/react-native-confetti/
Hi,
I need to make this confetti animation go below the device viewport. Right now, the confettis stops at the bottom of the screen, and disappear.
I would do it with custom styles, but I can't get it work :/ Digging in the code, I found a value that we could use, in confetti.js:
Maybe we could change it to:
With the relevant defaultProps:
I'm not sure about the naming (yDelta is probably not the best param name). However I have a branch ready to push.