I am using React Native Tab navigator and I am trying to have my Screen route names as header but with no luck. The fact that the screens are rendered inside the Tab Navigator makes it so their headers are ignored. I have tried setting headerShown=true and many other things with no luck.

This is part of my App.js code:

const AppStack = createStackNavigator({
  Navigation: {
    screen: NavigationScreen,
    navigationOptions: {
    }
  },
  Route: {
    screen: RouteScreen,
    navigationOptions: {
      // headerShown: false
      headerTitle: 'TestTitle'
    }
    },
  Confirm: {
    screen: ConfirmScreen,
    navigationOptions: {
      // headerShown: false
      headerTitle: 'TestTitle'
      
    }
    },
  Find: {
    screen: FindScreen,
    navigationOptions: {
      // headerShown: false
      headerTitle: 'TestTitle'
    }
    },
  Offer: {
    screen: OfferScreen,
    navigationOptions: {
      // headerShown: false
      headerTitle: 'TestTitle'
    }
    },

and here is my Navigation Screen code:

export default function NavigationScreen( {navigation}) {
  return (
    <NavigationContainer>
      <Tab.Navigator
        screenOptions={({ route }) => ({
          tabBarIcon: ({ color, size }) => {
            const icons = {
              Home: 'home',
              Profile: 'account',
              Offer: 'car-hatchback',
              Find: 'magnify'
            };

            return (
              <MaterialCommunityIcons
                name={icons[route.name]}
                color='#E9446A'
                size={30}
              />
            );
          },
        })}
      >
        <Tab.Screen name="Home" component={HomeScreen} />
        <Tab.Screen name="Profile" component={HomeTabScreen} />
        <Tab.Screen name="My Rides" children={()=><MyRidesScreen navigation={navigation}/>}  />
        <Tab.Screen name="Offer" children={()=><OfferScreen navigation={navigation}/>}  />
        <Tab.Screen name="Find" children={()=><FindScreen navigation={navigation}/>}  />
      </Tab.Navigator>
    </NavigationContainer>
  );
}

Any change attempted to the Tab.Screen routes via options is rendered on the bottom tab Names and not the screen header, as the parent screen is always Navigation Screen