react-native-navigation
react-native-navigation copied to clipboard
setRoot Animations Do Not Work on iOS
🐛 Bug Report
From experimentation with both the playground and my app, it seems that setRoot animations do not work on iOS (on both simulator and physical device). I thought at first it was due to an incorrect implementation in my app, but after cloning master
(v7.30.0) of this repo, I was able to reproduce the issue in the playground app (again, on both simulator and physical device on iOS). More specifically, none of the setRootAnimation
animations work in playground/src/commons/options/Animations.ts
. Instead of showing a slide in/slide out animation as the code intends, the default replace animation is shown
Please see videos below for a demonstration of the issue
To Reproduce
- Open the playground app in Xcode (either playground/ios/playground.xcodeproj or playground/ios/playground.xcworkspace)
- Run the playground app via
npm run start
- Build and run the app in Xcode on either a simulator or on a physical device by pressing the play button
- Once the app has launched, Click the 'Navigation' bottom tab
- Click the 'Set Root' button near the top of the screen
- Here you'll be presented a list of buttons that are meant to showcase the various behaviors of the Navigation.setRoot() method, including custom animations. Press any of these options
- Observe that no animation occurs when navigation from one root to another
Expected behavior
According to the setRootAnimation variable defined in playground/src/commons/options/Animations.ts
. the destination screen should slide in from the right and the source screen should slide out to the left
Actual Behavior
Default replace screen animation is exhibited
Your Environment
*While I observed this issue in both my app and the playground app, the following values refer to those in the playground
- React Native Navigation version: 7.30.0 (cloned directly from master)
- React Native version: 0.69.5
- Platform(s) (iOS, Android, or both?): iOS (not tested on android)
- Device info (Simulator/Device? OS version? Debug/Release?): Physical device = iPhone 13 iOS 15.4.1, Simulator = iPhone 14
Reproducible Demo
The following video demonstrates the issue as shown on physical device. I have also recorded a demo on sim but the file is too large to post here
https://user-images.githubusercontent.com/31458115/200108016-26196255-5852-45bf-bb60-6592c34e75ee.mov
Just clone master and follow the STR above
Are you willing to resolve this issue by submitting a Pull Request?
- ✅ Yes, I have the time, but I don't know how to start. I would need guidance. *I would be a new contributor to the project but am willing and able to help
Same issue here. The "setRoot" animation still not working on iOS in the latest RNN version 7.37.2, React Native 0.72