How to remove fullwidth tab in createMaterialTopTabNavigator

Question

I'm having a hard time how to remove the fullwidth tab in createMaterialTopTabNavigator. I'm using this library https://reactnavigation.org/docs/material-top-tab-navigator/

Current output:

Expected output:

I appreciate your help on this!

Answer 1

Try something like this

<Tab.Navigator
    tabBarOptions={{
      style: { alignItems: 'flex-start' },
      tabStyle: { alignItems: 'center', width: 100 },
      indicatorStyle: { width: 100 },
    }}>
    <Tab.Screen name="Home" component={HomeScreen} />
    <Tab.Screen name="Settings" component={SettingsScreen} />
</Tab.Navigator>

See here