Skip to main content

Modal 컴포넌트는 상위 뷰 위에 콘텐츠를 표시하는 기본적인 방법이다.

참조

Props

View Props

View Props를 상속한다.

animated

Deprecated. animationType prop을 대신 사용한다.

animationType

animationType 프로퍼티는 모달이 어떻게 애니메이션되는지 제어한다.

가능한 값:

  • slide: 아래에서 위로 슬라이드되며 나타난다.
  • fade: 서서히 페이드되며 나타난다.
  • none: 애니메이션 없이 바로 나타난다.
타입기본값
enum('none', 'slide', 'fade')none

backdropColor

모달의 backdropColor는 모달 컨테이너의 배경색을 지정한다. 기본값은 white이며, transparentfalse일 때 적용된다. transparenttrue인 경우 이 값은 무시된다.

타입기본값
colorwhite

hardwareAccelerated

Android

hardwareAccelerated 프로퍼티는 기본 윈도우에 하드웨어 가속을 강제로 적용할지 여부를 제어한다.

타입기본값
boolfalse

navigationBarTranslucent 프로퍼티는 모달이 시스템 네비게이션 바 아래로 들어갈지 여부를 결정한다. 단, 네비게이션 바를 반투명하게 만들려면 statusBarTranslucenttrue로 설정해야 한다.

타입기본값
boolfalse

onDismiss
iOS

onDismiss 프로퍼티는 모달이 닫힌 후 호출될 함수를 전달할 수 있게 한다.

타입
function

onOrientationChange
iOS

onOrientationChange 콜백은 모달이 표시된 상태에서 화면 방향이 변경될 때 호출된다. 제공되는 방향은 'portrait' 또는 'landscape' 중 하나다. 이 콜백은 초기 렌더링 시에도 현재 방향과 상관없이 호출된다.

타입
function

onRequestClose

onRequestClose 콜백은 사용자가 안드로이드에서 하드웨어 뒤로 가기 버튼을 누르거나 애플 TV에서 메뉴 버튼을 누를 때 호출된다. 이 필수 속성 때문에 모달이 열려 있는 동안에는 BackHandler 이벤트가 발생하지 않는다는 점을 주의해야 한다. iOS에서는 presentationStylepageSheet 또는 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 프로퍼티는 모달이 시스템 상태 표시줄 아래로 들어갈지 여부를 결정한다.

타입기본값
boolfalse

supportedOrientations
iOS

supportedOrientations 프로퍼티는 모달이 지정된 방향으로 회전할 수 있게 한다. iOS에서는 모달이 앱의 Info.plist 파일에 정의된 UISupportedInterfaceOrientations 필드에 의해 제한된다.

presentationStylepageSheet 또는 formSheet로 설정된 경우, 이 프로퍼티는 iOS에서 무시된다.

타입기본값
enum 배열('portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right')['portrait']

transparent 속성은 모달이 전체 화면을 채울지 여부를 결정한다. 이 값을 true로 설정하면 모달이 투명한 배경 위에 렌더링된다.

타입기본값
boolfalse

visible

visible 속성은 모달의 표시 여부를 결정한다.

타입기본값
booltrue