-
Notifications
You must be signed in to change notification settings - Fork 24.8k
Description
Is this a bug report?
Yes
Have you read the Contributing Guidelines?
Yes
Environment
Environment:
OS: macOS Sierra 10.12.6
Node: 8.6.0
Yarn: Not Found
npm: 5.3.0
Watchman: 4.9.0
Xcode: Xcode 9.0 Build version 9A235
Android Studio: Not Found
Packages: (wanted => installed)
react: ^16.0.0-alpha.12 => 16.0.0-alpha.12
react-native: ^0.48.4 => 0.48.4
Target Platform: iOS (11.0)
Steps to Reproduce
Create two animated Text components with
const AnimatedText = Animated.createAnimatedComponent(
styled.Text``
)
Use two Animated.Value
which you've gotten by interpolating one Animated.Value
provided by a react-native-interactable in two different ways. Then use those two values to animate the opacity of two of those AnimatedText
components, like that (I've only tried it with native animations).
Expected Behavior
I expected the first text to disappear, while the second one appears. When the second one is fully visible, it should start disappearing again and the first one should reappear.
Actual Behavior
One of the texts behaves as expected, while the second one doesn't get animated (it depends on which starts with a higher opacity - the one which does will work as expected, the other one won't get animated at all).
Reproducible Demo
Quiet hard to set up. I've tried creating a snack with an easy animation using Animated.timing(), but using this the bug doesn't reproduce. In addition Snack doesn't support react-native-interactable. It also does not appear on Android and the animation works if I change the opacity of a view wrapping the text, meaning that it should not be a react-native-interactable bug.
If there's something willing to have a closer look at this, I'm willing to create an example project and publish it on github.
Greetings
DragonRaider5