Hello
For some reason, it seems that an Animated.View does not animate opacity when the animated value starts from 1 when using the native driver. When using 1.1 or 0.9 (instead of exactly 1) - or when not using the native driver - the animation works fine.
Steps To Reproduce
- Have an animated value that goes from 1 to 0, as in the code below:
...
this.anim = new Animated.Value(1);
...
Animated.timing(this.anim, {
duration: Constants.animation.duration,
toValue: 0,
useNativeDriver: true,
}).start();
- Use the animated value as the opacity of an
Animated.View. Something like:
<Animated.View style={{ opacity: this.anim }}>
<Text>{text}</Text>
</Animated.View>
I'd expect the Animated View to fade out when the animation runs, but no opacity change happens.
If a number larger or smaller than 1 is used, the animation works. Not reproducible on iOS.
Snack:
https://snack.expo.io/H1jsre_kB
React Native version:
info
React Native Environment Info:
System:
OS: macOS 10.14.5
CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
Memory: 91.55 MB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 10.16.0 - ~/.nvm/versions/node/v10.16.0/bin/node
Yarn: 1.16.0 - /usr/local/bin/yarn
npm: 6.9.0 - ~/.nvm/versions/node/v10.16.0/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
Android SDK:
API Levels: 23, 25, 26, 27, 28
Build Tools: 26.0.0, 26.0.2, 26.0.3, 27.0.3, 28.0.0, 28.0.2, 28.0.3
System Images: android-27 | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.4 AI-183.6156.11.34.5522156
Xcode: 10.2.1/10E1001 - /usr/bin/xcodebuild
npmPackages:
react: 16.8.3 => 16.8.3
react-native: 0.59.8 => 0.59.8
npmGlobalPackages:
react-native-cli: 2.0.1
Hello
For some reason, it seems that an
Animated.Viewdoes not animate opacity when the animated value starts from 1 when using the native driver. When using 1.1 or 0.9 (instead of exactly 1) - or when not using the native driver - the animation works fine.Steps To Reproduce
Animated.View. Something like:I'd expect the Animated View to fade out when the animation runs, but no opacity change happens.
If a number larger or smaller than 1 is used, the animation works. Not reproducible on iOS.
Snack:
https://snack.expo.io/H1jsre_kB
React Native version: