Modal
Modal 组件是一种在封闭视图上方呈现内容的基本方式。
示例
参考
属性
View 属性
继承 View 属性。
animated
已弃用。 请使用
animationType属性代替。
animationType
animationType 属性控制 modal 如何动画。
可能的值:
slide从底部滑入fade淡入视图none出现时不带动画
| 类型 | 默认值 |
|---|---|
enum('none', 'slide', 'fade') | none |
backdropColor
Modal 的 backdropColor(或 modal 容器的背景颜色)。如果未提供且 transparent 为 false,则默认为 white。如果 transparent 为 true,则忽略此属性。
| 类型 | 默认值 |
|---|---|
| 颜色 | 白色 |
hardwareAccelerated Android
hardwareAccelerated 属性控制是否强制底层窗口进行硬件加速。
| 类型 | 默认值 |
|---|---|
| 布尔值 | false |
navigationBarTranslucent Android
navigationBarTranslucent 属性决定你的 modal 是否应该位于系统导航栏下方。但是,也需要将 statusBarTranslucent 设置为 true 才能使导航栏半透明。
| 类型 | 默认值 |
|---|---|
| 布尔值 | false |
onDismiss iOS
onDismiss 属性允许传递一个函数,该函数将在 modal 被关闭后调用。
| 类型 |
|---|
| 函数 |
onOrientationChange iOS
onOrientationChange 回调在 modal 显示时方向发生变化时调用。提供的方向仅为 'portrait' 或 'landscape'。无论当前方向如何,此回调也会在初始渲染时调用。
| 类型 |
|---|
| 函数 |
onRequestClose
onRequestClose 回调在用户在 Android 上点击硬件返回按钮或在 Apple TV 上点击菜单按钮时调用。由于此属性是必需的,请注意只要 modal 打开,BackHandler 事件就不会被发出。
在 iOS 上,当 presentationStyle 为 pageSheet or formSheet 时,如果使用拖动手势关闭 Modal,则会调用此回调。
| 类型 |
|---|
| 函数 必需 Android TV 函数 iOS |
onShow
onShow 属性允许传递一个函数,该函数将在 modal 显示后调用。
| 类型 |
|---|
| 函数 |
presentationStyle iOS
presentationStyle 属性控制 modal 如何出现(通常在较大的设备上,如 iPad 或 plus 尺寸的 iPhone)。详见 https://developer.apple.com/reference/uikit/uimodalpresentationstyle。
可能的值:
fullScreen完全覆盖屏幕pageSheet覆盖居中的肖像宽度视图(仅在较大设备上)formSheet覆盖居中的窄宽度视图(仅在较大设备上)overFullScreen完全覆盖屏幕,但允许透明
| 类型 | 默认值 |
|---|---|
enum('fullScreen', 'pageSheet', 'formSheet', 'overFullScreen') | 如果 transparent={false} 则为 fullScreen如果 transparent={true} 则为 overFullScreen |
statusBarTranslucent Android
statusBarTranslucent 属性决定你的 modal 是否应该位于系统状态栏下方。
| 类型 | 默认值 |
|---|---|
| 布尔值 | false |
supportedOrientations iOS
supportedOrientations 属性允许 modal 旋转到任何指定的方向。在 iOS 上,modal 仍然受限于 app 的 Info.plist 的 UISupportedInterfaceOrientations 字段中指定的内容。
当使用
pageSheet或formSheet的presentationStyle时,此属性将被 iOS 忽略。
| 类型 | 默认值 |
|---|---|
枚举数组 ('portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right') | ['portrait'] |
transparent
transparent 属性决定你的 modal 是否填满整个视图。将其设置为 true 将在透明背景上渲染 modal。
| 类型 | 默认值 |
|---|---|
| 布尔值 | false |
visible
visible 属性决定你的 modal 是否可见。
| 类型 | 默认值 |
|---|---|
| 布尔值 | true |