Modal 컴포넌트는 상위 뷰 위에 콘텐츠를 표시하는 기본적인 방법이다.
참조
Props
View Props
View Props를 상속한다.
animated
Deprecated.
animationTypeprop을 대신 사용한다.
animationType
animationType 프로퍼티는 모달이 어떻게 애니메이션되는지 제어한다.
가능한 값:
slide: 아래에서 위로 슬라이드되며 나타난다.fade: 서서히 페이드되며 나타난다.none: 애니메이션 없이 바로 나타난다.
| 타입 | 기본값 |
|---|---|
enum('none', 'slide', 'fade') | none |
backdropColor
모달의 backdropColor는 모달 컨테이너의 배경색을 지정한다. 기본값은 white이며, transparent가 false일 때 적용된다. transparent가 true인 경우 이 값은 무시된다.
| 타입 | 기본값 |
|---|---|
| color | white |
hardwareAccelerated
hardwareAccelerated 프로퍼티는 기본 윈도우에 하드웨어 가속을 강제로 적용할지 여부를 제어한다.
| 타입 | 기본값 |
|---|---|
| bool | false |
navigationBarTranslucent Android
navigationBarTranslucent 프로퍼티는 모달이 시스템 네비게이션 바 아래로 들어갈지 여부를 결정한다. 단, 네비게이션 바를 반투명하게 만들려면 statusBarTranslucent도 true로 설정해야 한다.
| 타입 | 기본값 |
|---|---|
| bool | false |
onDismiss iOS
onDismiss 프로퍼티는 모달이 닫힌 후 호출될 함수를 전달할 수 있게 한다.
| 타입 |
|---|
| function |
onOrientationChange iOS
onOrientationChange 콜백은 모달이 표시된 상태에서 화면 방향이 변경될 때 호출된다. 제공되는 방향은 'portrait' 또는 'landscape' 중 하나다. 이 콜백은 초기 렌더링 시에도 현재 방향과 상관없이 호출된다.
| 타입 |
|---|
| function |
onRequestClose
onRequestClose 콜백은 사용자가 안드로이드에서 하드웨어 뒤로 가기 버튼을 누르거나 애플 TV에서 메뉴 버튼을 누를 때 호출된다. 이 필수 속성 때문에 모달이 열려 있는 동안에는 BackHandler 이벤트가 발생하지 않는다는 점을 주의해야 한다. iOS에서는 presentationStyle이 pageSheet 또는 formSheet일 때, 드래그 제스처로 모달을 닫을 때 이 콜백이 호출된다.
| 타입 |
|---|
| function 필수 안드로이드 TV function iOS |
onShow
onShow 프로퍼티는 모달이 표시된 후에 호출될 함수를 전달할 수 있게 해준다.
| 타입 |
|---|
| function |
presentationStyle iOS
presentationStyle 속성은 모달이 어떻게 나타날지 제어한다. 주로 iPad나 플러스 사이즈 iPhone 같은 대형 기기에서 사용된다. 자세한 내용은 https://developer.apple.com/reference/uikit/uimodalpresentationstyle에서 확인할 수 있다.
가능한 값:
fullScreen: 화면 전체를 덮는다.pageSheet: 세로 화면 너비에 맞춰 가운데 정렬한다. (대형 기기에서만 가능)formSheet: 좁은 너비의 화면에 맞춰 가운데 정렬한다. (대형 기기에서만 가능)overFullScreen: 화면 전체를 덮지만, 투명도를 허용한다.
| 타입 | 기본값 |
|---|---|
enum('fullScreen', 'pageSheet', 'formSheet', 'overFullScreen') | fullScreen (만약 transparent={false}인 경우)overFullScreen (만약 transparent={true}인 경우) |
statusBarTranslucent Android
statusBarTranslucent 프로퍼티는 모달이 시스템 상태 표시줄 아래로 들어갈지 여부를 결정한다.
| 타입 | 기본값 |
|---|---|
| bool | false |
supportedOrientations iOS
supportedOrientations 프로퍼티는 모달이 지정된 방향으로 회전할 수 있게 한다. iOS에서는 모달이 앱의 Info.plist 파일에 정의된 UISupportedInterfaceOrientations 필드에 의해 제한된다.
presentationStyle이pageSheet또는formSheet로 설정된 경우, 이 프로퍼티는 iOS에서 무시된다.
| 타입 | 기본값 |
|---|---|
enum 배열('portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right') | ['portrait'] |
transparent 속성은 모달이 전체 화면을 채울지 여부를 결정한다. 이 값을 true로 설정하면 모달이 투명한 배경 위에 렌더링된다.
| 타입 | 기본값 |
|---|---|
| bool | false |
visible
visible 속성은 모달의 표시 여부를 결정한다.
| 타입 | 기본값 |
|---|---|
| bool | true |