React Navigation

Hello Friends 👋, Welcome To Infinitbility! ❤️ This tutorial will help you to add icon and image in you react navigation bottom tabs, here we are using React navigation 6. Want React Navigation stack and bottom tabs combine example? https://infinitbility.github.io/how-to-create-stack-navigation-with-tab-navigation-in-react-navigation Let start today tutorial How to add icon in bottom tab navigation react native? BottomTabNavigator with image First, we will see how can we use in react navigation bottom tabs....

Hello Friends 👋, Welcome To Infinitbility! ❤️ This tutorial will help you to remove back button from your react navigation header bar, here we are using react navigation version 6.x. Let start today tutorial How to remove back button in react navigation? React Navigation provides headerLeft options to show your custom Ui in header bar but you can also use for remove back button when you pass null on it....

Hello Friends 👋, Welcome To Infinitbility! ❤️ This tutorial will help you to create bottom tab navigation with in stack navigation using react navigation in react native, here we are using react navigation version 6.x. Let start today tutorial How to create stack navigation with tab navigation in react navigation? Here full source code of tutorial https://github.com/infinitbility/react-navigation-stack-and-tab-example/tree/master Installation Now, we have to install required react navigation packages, as well as our stack and tab mavigation....

Hello Friends, Welcome To Infinitbility! Many people want to disable or block the drawer on a specific drawer navigation screen and you are also one of those then follow the below example to save your hour. React Navigation blocked drawer when use drawerLockMode you can’t access the drawer anymore Note: you can’t use openDrawer() and closeDrawer() also example : { screen : ExampleScreen, navigationOptions: ({navigation}) => ( { drawerLockMode: 'locked-closed' } ) }, React Navigation disable gesture disable gesture only affect gestures only like swipe left and many more....

Hello Friends, Welcome To Infinitbility! Many times we want to know the current route name & index for different purposes. here we the simplest way to get the current route name from react-navigation. You get the below example to get the current index & current route name. // for current index let index = this.props.navigation.state.index; // for current route name let routeName = this.props.navigation.state.routes[index].key; For React, navigation v5 Users have the option to get the current route name using useRoute()....