그리고 screenOptions Props를 지워주세요.

screens/MainScreen.js - Tab.Navigator

<Tab.Navigator
  initialRouteName="Home"
  tabBarOptions={{
    showIcon: true,
}}>

▲ 그림 5-25 머티리얼 하단 탭 내비게이터

이 내비게이터에서는 활성화된 탭의 이름이 아이콘 하단에 나타나며, 색상이 진해집니다. 그리고 활성화된 탭에 따라 탭 바의 배경색을 변경할 수도 있습니다. 배경색을 한번 바꿔볼까요? 다음과 같이 코드를 수정해보세요.