HeaderlessScreen을 다음과 같이 수정해보세요.
screens/HeaderlessScreen.js
import React from 'react'; import {View, Text, Button} from 'react-native'; import {SafeAreaView} from 'react-native-safe-area-context'; function ({navigation}) { return ( <SafeAreaView> <View> <Text>Header가 없네?</Text> <Button onPress={() => navigation. ()} title="뒤로가기" /> </View> </SafeAreaView> ); } export default HeaderlessScreen;
다시 확인해볼까요? 이제 iOS에서도 StatusBar 영역을 침범하지 않고 화면이 잘 나타나죠?
▲ 그림 5-14 SafeAreaView 적용