Comments (8)
@hedgerwang created a great example how to keep Scene's mounted with tab bar items today.
facebook/react-native@1dc33b5#diff-4447daf3edd577198f620da6f8ac5cc0R256
For me this can be closed.
from navigation-rfc.
That is correct. Transitioner
and AnimatedView
(deprecated) use style interpolators to animate a scene in and out. Your components that are off-screen are not unmounted unless you explicitly remove the route
that renders that particular scene
from navigationState
.
@hedgerwang killed the old examples in UIExplorer. Here's a newer example he recently pushed that uses NavigationCardStack
.
@ptomasroos What React Native version are you using? NavigationExperimental is a moving target and I recommend you upgrade to v0.28.0-rc.0 and see if that helps. You should not be losing component state i.e scroll position. These issues were addressed in #61.
🍺
from navigation-rfc.
Thanks for your efforts for explaining and responding! I will upgrade!
from navigation-rfc.
This is likely a dupe of #61. 🤔
Update—
I believe @hedgerwang is working on this. Does this fix your issue? facebook/react-native#81c62c5f
from navigation-rfc.
We're facing this problems as well.
How would one go about keeping certain scene's / routes always mounted on a tabbar for instance between tab switching @hedgerwang @ericvicenti ? Very well known behaviour which was supported in Navigator.
from navigation-rfc.
@ptomasroos Are you losing component state when you set index
to a different route
? Here's a sample implementation of a tabs reducer that keeps components mounted across tab switches. There's also a sample app in the repo if you want to see it in action.
If you can tell me how to reproduce the issue you're having, I might be able to help.
🍺
from navigation-rfc.
I think it's more the issue that render()
method of the Navigator (in official UIExplorer examples) uses plain View and just {this.renderTab}
kind of thing, which will unmount the component on tab change anyway.
I've been successfully using react-native-tab-navigator
to handle tabs instead and that's been working well.
from navigation-rfc.
@jmurzy images gets removed and causes redownloading of images on switching tabs. Very noticeable. Instead vs being on a stack and going back one scene where the underlying Card is displayed already rendered.
Another thing how this is noticed is that scroll position of a list view is 'forgotten' between switching tabs because its unmounted. Hence I would like to avoid the unmounting :)
from navigation-rfc.
Related Issues (20)
- In RootContainer, cannot center child elements vertically HOT 1
- Navbar and child component communication
- Modify styling of NavigationHeader HOT 12
- Create an API similar to ExNavigator HOT 2
- renderOverlay receives wrong scene after replace
- Visual Update not occurring despite everything happening correctly
- Nested StackReducers and BackAction HOT 6
- How to overlay on top of NavigationHeader? HOT 1
- onBack instead of onNavigate? HOT 3
- Breaking changes HOT 3
- What would be the right way for scene know it's in focus? HOT 3
- Is Navigation.Header always 64 pixels tall? HOT 2
- Is there any way i can add background image on Navigation bar (NavigationHeader) ? HOT 9
- Position / Progress role in the transition from one scene to another HOT 7
- Stack Reducer & Tabs Reducer HOT 2
- Link to example in doc is broken HOT 1
- Detect scene change? HOT 3
- Update docs to reflect renderOverlay is now renderHeader HOT 2
- Guide incomplete?
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from navigation-rfc.