React Native Navigation 5.0 底部选项卡 - 如何更改字体大小？

Question

有没有办法改变React Native Navigation 5.0中下面两个“name”道具的字体大小？

const Tab = createBottomTabNavigator();

export const Nav = () => {
  return (
    <NavigationContainer>
      <Tab.Navigator>
        <Tab.Screen name="Game" component={HomeStackScreen} />
        <Tab.Screen name="Map" component={SettingsStackScreen} />
      </Tab.Navigator>
    </NavigationContainer>
  );
};

Answer 1

将 tabBoarOptions 添加到您的代码中，如下所示。

const Tab = createBottomTabNavigator();

export const Nav = () => {
  return (
    <NavigationContainer>
      <Tab.Navigator
          labelStyle: {
            fontSize: 10,
            fontFamily:'GothamBook'
           
          },>
    <Tab.Screen name="Game" component={HomeStackScreen} />
    <Tab.Screen name="Map" component={SettingsStackScreen} />
  </Tab.Navigator>
</NavigationContainer>

）； };

Answer 2

<Tab.Screen
    name="About"
    component={About}
    options={{
      headerShown: false,
      tabBarLabelStyle: {
        fontSize: 13,
      },
      tabBarIcon: ({ color, size }) => (
        <AntDesign name="infocirlceo" size={24} color="black" />
      ),
    }}
  />

Answer 3

已在问题 #21 中解决。都好 ：） https://github.com/ptomasroos/react-native-tab-navigator/issues/21