React native 하단바 추가하는법

import {createBottomTabNavigator } from "@react-navigation/bottom-tabs"
import {NavigationContainer } from "@react-navigation/native"

// 하단바에 들어갈 아이콘 이미지
import img_post from "../source/post.png"
import img_user from "../source/user.png"

const BottomTab = createBottomTabNavigator();

function App(){
  return(
    <View style={{flex: 1}}> 
      <View>
        <Text>Test</Text>
      </View>
      <NavigationContainer>
        <BottomTab.Navigator initialRouteName="Post" screenOptions={{
          headerShown: false, // 헤더 타이틀 없애기
        }}>
          <BottomTab.Screen name="Post" component={Post} options={{tabBarIcon: () => {
            return <Image source={img_post} style={{width: 20, height: 20}}></Image>
          }}}/>
          <BottomTab.Screen name="Home" component={Home} options={{tabBarIcon: () => {
            return <Image source={img_user} style={{width: 20, height: 20}}></Image>
          }}}/>
        </BottomTab.Navigator>
      </NavigationContainer>
    </View>
  );
}

 

결과 :