Hide BottomTab, change Textcolor

hi everyone, i´m not that experienced (coding beginner), and have a problem with my first expo app in managed workflow. I created a new Project with example screens, and need to hide one of those, because this should be shown at the start of the app, and with a button its possible to navigate to home, where the rest of the app (with BottomTabNavigator) is shown. i need to hide the Button “Seed” in the bottombar. also, if i change the color in colors.js, the iconcolor changes, but the text stays blue. how can i change this?

thanks for your help!


const BottomTab = createBottomTabNavigator();
const INITIAL_ROUTE_NAME = 'Seed';



export default function BottomTabNavigator({ navigation, route }) {
  // Set the header title on the parent stack navigator depending on the
  // currently active tab. Learn more in the documentation:
  // https://reactnavigation.org/docs/en/screen-options-resolution.html
  navigation.setOptions({ headerTitle: getHeaderTitle(route)});
  
  return (
    
    <BottomTab.Navigator initialRouteName={INITIAL_ROUTE_NAME}>
      <BottomTab.Screen
        name="Home"
        component={HomeScreen}
        options={{
        title: 'Home',
        tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-home" />,
          
      }}
      />
      <BottomTab.Screen
        name="Wallet"
        component={Wallet}
        options={{
        title: 'Wallet',
        tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-wallet" />,
      }}
      />
      <BottomTab.Screen
        name="Receive"
        component={ReceiveScreen}
        options={{
        title: 'Receive',
        tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-arrow-down" />,
      }}
      />
      <BottomTab.Screen
        name="Payment"
        component={PaymentScreen}
        options={{
        title: 'Payment',
        tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-paper-plane" />,
      }}
      />
      <BottomTab.Screen
        name="Settings"
        component={Settings} 
        options={{
        title: 'Settings',
        tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-settings" />,
      }}
      />
      <BottomTab.Screen
        name="Seed"
        component={Seed} 
        options={{
          
        }}
          
      
      />
    </BottomTab.Navigator>    
  );
   
}

function getHeaderTitle(route) 
{

EDIT: i found the solution after two days to hide the tab! Now i only need the solution to change the label color.

Here is the solution i found:


const BottomTab = createBottomTabNavigator();
const INITIAL_ROUTE_NAME = 'Seed';




export default function BottomTabNavigator({ navigation, route }) {
  
  // Set the header title on the parent stack navigator depending on the
  // currently active tab. Learn more in the documentation:
  // https://reactnavigation.org/docs/en/screen-options-resolution.html
  navigation.setOptions({ headerTitle: getHeaderTitle(route)});
  
  return (
    <BottomTab.Navigator initialRouteName={INITIAL_ROUTE_NAME} tabBar={props => <BottomTabBar {...props} state={{...props.state, routes: props.state.routes.slice(0,5)}}></BottomTabBar>}>

       <BottomTab.Screen name="Home" component={HomeScreen} 
           options={{
           title: 'Home',
           tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-home" />,
           }}></BottomTab.Screen> 

       <BottomTab.Screen name="Wallet" component={Wallet}
           options={{
           title: 'Wallet',
           tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-wallet" />,
           }}></BottomTab.Screen>

       <BottomTab.Screen name="Receive" component={ReceiveScreen}
           options={{
           title: 'Receive',
           tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-arrow-down" />,
           }}></BottomTab.Screen>

       <BottomTab.Screen name="Payment" component={PaymentScreen} 
           options={{
           title: 'Payment',
           tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-paper-plane" />,
           }}></BottomTab.Screen>

       <BottomTab.Screen name="Settings" component={Settings}
           options={{
           title: 'Settings',
           tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-settings" />,
           }}></BottomTab.Screen>

       <BottomTab.Screen name="Seed" component={Seed} 
        options={{
        tabBarVisible: false
        }}></BottomTab.Screen>

    </BottomTab.Navigator>
     
     );
      
   }

This topic was automatically closed 20 days after the last reply. New replies are no longer allowed.