Search code examples
react-nativeexpotabbar

How to make TabBar without Icons?


I made the tabBar as below.

enter image description here

I am using react-native with expo. But I want to remove icons from tabBar as it having only texts. my tabBar code looks like below. How can I remove icons from tabBar?

<Tabs.Navigator
  screenOptions={{
      headerShown: false,
      tabBarActiveTintColor: `${colors.vivid}`,
      tabBarActiveBackgroundColor: `${colors.light}`,
      tabBarStyle: {
          backgroundColor: "white",
          height: 60,
      },
      tabBarLabelStyle: {
          fontFamily: "Katuri",
          fontSize: 18,
      },
  }}
>
    <Tabs.Screen
      name="사진"
      options={{
          tabBarIcon: ({ focused, color, size }) => (
            <Ionicons name={"camera"} color={color} size={18} />
          ),
      }}

Solution

  • Return null for tabBarIcon in options props.

    <Tabs.Screen 
      name="사진" 
      options={{ tabBarIcon: ({ focused, color, size }) => null }}