timomeh / react-native-material-bottom-navigation

💅🔧👌 a beautiful, customizable and easy-to-use material design bottom navigation for react-native
MIT License
709 stars 127 forks source link

onTabChange called when navigate() called - React Navigation v2.0.1 #88

Closed victorkvarghese closed 6 years ago

victorkvarghese commented 6 years ago

Current Behaviour

onTabChange is getting called when a navigate() action is called (From one StackNavigator to another StackNavigator) This happens only when i'm using react-navigation v2.0.1 . this callback is not getting called v1.5.11.

Expected Behavior

onTabChange should only call when tab is changed or Pressed. This callback shouldn't work when a simple navigate action is called

How to reproduce

<BottomNavigation
                    activeTab={1}
                    labelColor={AppStyles.color.COLOR_TINT}
                    rippleColor="black"
                    activeLabelColor={AppStyles.color.COLOR_RED_MAIN}
                    shifting={false}
                    style={styles.bottomNav}
                    onTabChange={this.onTabChange}
                >
{..tabs}
</BottomNavigation>

Your Environment

software version
react-native-material-bottom-navigation 0.9.0
react-navigation 2.0.1
react-native 0.54.2
node 8.8.1
npm or yarn 5.4.2
timomeh commented 6 years ago

Thanks for submitting! Could you please provide a more detailed example on how you use the Bottom Navigation together with react-navigation? I'm a bit surprised that your example uses < BottomNavigation />, since you would normally use NavigationComponent for react-navigation.

timomeh commented 6 years ago

I'll put this on hold since v1.0.0 doesn't contain out-of-the-box support for React Navigation anymore. Read more about the details here.

victorkvarghese commented 6 years ago

I upgraded to v1.0.0 and added the logic on onTabPress . Now the callback is working as expected without any bugs.

But regarding the old version I was not using navigationComponent. I need custom bottom component so that has a collapsing sheet above .. I was using the onTabChange callback to manually change the screens in the stack.. (But this callback was acting weird when i switched to react navigation v.2.1) in . v0.9.0

timomeh commented 6 years ago

Ah, interesting, you implemented the Bottom Navigation without the NavigationComponent – that's actually great to hear. It's also great to hear that you directly updated to v1.0.0 and it worked. 🙂

I'm closing this issue since the callback is now working as expected. 🎉