Comments (21)
Agreed, what we implemented was slightly different to what is being requested here to be fair, we implemented callbacks for all view lifecycle methods: viewWillAppear
, viewDidAppear
, viewWillDissapear
, viewDidDissapear
which gives more info than this, but you're correct this is achievable right now :)
from react-native-navigation.
We added bottomTabSelected
event which you can to globally. It returns the indices of the newly selected and the unselected tabs.
import {
NativeAppEventEmitter,
DeviceEventEmitter,
Platform
} from 'react-native';
export default class TabSelectedListener {
constructor(tabs) {
this.tabs = tabs;
}
register() {
const emitter = this.getEventEmitter();
this.eventSubscription = emitter.addListener('bottomTabSelected', (event) => {
console.log('tabSelected ', `selected: ${event.selectedTabIndex} unselected: ${event.unselectedTabIndex}`);
});
}
unregister() {
if (this.eventSubscription) {
this.eventSubscription.remove();
}
}
getEventEmitter() {
return Platform.OS === 'android' ? DeviceEventEmitter : NativeAppEventEmitter;
}
}
from react-native-navigation.
@Kureev This is the final implementation for the current scope, so lets close the issue for now as it has been addressed. Thanks for sorting things out 👍
from react-native-navigation.
+1
from react-native-navigation.
+1
from react-native-navigation.
Actually this would be really good - I have a tab that opens up a photo gallery or camera (like instagram). I just really need to find out which is the active tab, I've done it before using JS only but I have decided that the only way forward is with react-native is with react-native-controllers/react-native-navigation (from Wix!!). I can wait.
from react-native-navigation.
This feature is at the top of our list. Will be added soon, after the Android version matures a bit.
from react-native-navigation.
+1 Desperately need this. Are there any current workarounds to get the active tab or when the tab presses/changes?
from react-native-navigation.
+1
from react-native-navigation.
+1
from react-native-navigation.
+1
from react-native-navigation.
+1
from react-native-navigation.
Check out our branch here for a quick and easy implementation: https://github.com/3sidedcube/react-native-navigation/tree/feature/view_lifecycle
Happy to pull request it, but it's built on top of a fork that we're already waiting on a large pull request to go through on so will have to wait for that first!
from react-native-navigation.
Any update on this guys?
from react-native-navigation.
@Jaafar-abusair I believe the team at wix will be merging the branch that our view_lifecycle
branch was built on top of fairly soon, once they have done so we'll submit a PR for this logic :) It's fairly small and simple to implement, so wouldn't be too long I guess :D
from react-native-navigation.
I think this can also be achieved right now by using the bottomTabSelected
event for bottom tabs and tabSelected
event for top tabs. When the application is started, the first screen is the selected tab. Afterward, you can listen on one these two events depending on your layout to keep track of the currently selected tab.
from react-native-navigation.
@varungupta85 how to listen to bottomTabSelected?
from react-native-navigation.
@Jaafar-abusair https://github.com/wix/react-native-navigation/issues/648#issuecomment-271718783
from react-native-navigation.
+1
from react-native-navigation.
It seems this issue can be closed by #16 (comment).
Do we need to implement something else in the scope of it?
from react-native-navigation.
@guyca Just wondering why this isn't working with the bottomTabReselected
event?
Just trying to use it so I can reset the screen if they have navigated 2-3 child screens down and tap the active nav icon again. Should reset to the top screen.
from react-native-navigation.
Related Issues (20)
- RN 0.74 New Architecture Support HOT 7
- App crashes with more than 5 tabs
- Incorrect rendering order of initial tab
- Xcode 15 RN 0.59 error: UIViewController is missing its initial trait collection populated during initialization HOT 3
- Title and subtitle test ID's
- ReactTextShadowNode.UNSET is not available on RN 0.74.1 HOT 13
- Getting Execution failed for task ':react-native-navigation:compileReactNative71DebugJavaWithJavac HOT 4
- 底部导航栏频繁修改iconColor反应慢
- We need Some attention to the Keyboard UI problem
- Bottom Tab should render customizable component (not just icon properties) HOT 1
- Align Navigation.getLaunchArgs() for Android and iOS
- Overflowed part of the right topBarButton is not visible
- Upgrade from 0.64.1 to 0.74.1. Do you have a good guide with all necessary steps? HOT 17
- min SDK version
- "No package name found" HOT 1
- I want to add gif in bottom tabs HOT 1
- Getting Execution failed for task ':react-native-navigation:compileReactNative71DebugJavaWithJavac'. HOT 2
- bottomTabs.currentTabId is not triggered on IOS
- React Native 0.75.x HOT 1
- Diference in behavior from android vs iOS for the `RNN.ComponentWillAppear` event
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 react-native-navigation.