리액트 네이티브 노치 영역 구분하기

SafeAreaView를 사용하면 아이폰 노치 영역을 구분지어 줄 수 있다.

import React from 'react';
import {Button, SafeAreaView, StyleSheet, Text, TextInput, View} from 'react-native';

function App() {
  return (
    <SafeAreaView>
      <View style={styles.container}>
        <Text>텍스트</Text>
        <Button title="버튼이름" onPress={() => console.log('클릭됨!')} />
        <TextInput />
      </View>
    </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  container: {
    marginTop: 50,
    backgroundColor: 'red',
    margin:10
  },
});

export default App;