模态框
Modal 组件是一种在包裹视图之上展示内容的基本方式。
示例
参考
属性
View 属性
继承 View 属性。
🗑️ animated
:::warning 已弃用
请改用 animationType 属性。
:::
animationType
animationType 属性控制 modal 的动画方式。
可选值：
slide从底部滑入fade淡入视图none不带动画显示
| 类型 | 默认值 |
|---|---|
enum('none', 'slide', 'fade') | none |
backdropColor
modal 的 backdropColor（或 modal 容器的背景色）。如果未提供且 transparent 为 false，默认为 white。当 transparent 为 true 时忽略此项。
| 类型 | 默认值 |
|---|---|
| color | white |
hardwareAccelerated Android
hardwareAccelerated 属性控制是否为底层窗口强制启用硬件加速。
| 类型 | 默认值 |
|---|---|
| bool | false |
navigationBarTranslucent Android
navigationBarTranslucent 属性决定你的 modal 是否应显示在系统导航栏之下。不过，还需要将 statusBarTranslucent 设为 true，才能使导航栏透明。
| 类型 | 默认值 |
|---|---|
| bool | false |
onDismiss iOS
onDismiss 属性允许传入一个函数，该函数会在 modal 被关闭后调用一次。
| 类型 |
|---|
| function |
onOrientationChange iOS
当 modal 显示期间方向发生变化时，会调用 onOrientationChange 回调。提供的方向只会是 'portrait' 或 'landscape'。无论当前方向如何，在初始渲染时也会调用此回调。
| 类型 |
|---|
| function |
allowSwipeDismissal iOS
控制是否可以在 iOS 上通过向下滑动来关闭 modal。
这要求你实现 onRequestClose 属性来处理关闭逻辑。
| 类型 | 默认值 |
|---|---|
| bool | false |
ref
挂载时会被赋值为一个 元素节点 的 ref setter。
onRequestClose
当用户在 Android 上点击硬件返回按钮，或在 Apple TV 上点击菜单按钮时，会调用 onRequestClose 回调。由于这是必需属性，请注意，只要 modal 处于打开状态，BackHandler 事件就不会被触发。
在 iOS 上，当使用 presentationStyle 为 pageSheet 或 formSheet 时，通过拖拽手势关闭 Modal 会调用此回调。启用 allowSwipeDismissal 后，此回调会在关闭 modal 之后调用。
| 类型 |
|---|
| function 必需 Android 电视 function iOS |
onShow
onShow 属性允许传入一个函数，该函数会在 modal 显示后调用一次。
| 类型 |
|---|
| function |
presentationStyle iOS
presentationStyle 属性控制 modal 的显示方式（通常用于 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 属性决定你的 modal 是否应显示在系统状态栏之下。
| 类型 | 默认值 |
|---|---|
| bool | false |
supportedOrientations iOS
supportedOrientations 属性允许 modal 旋转到所指定的任一方向。在 iOS 上，modal 仍然会受到应用 Info.plist 中 UISupportedInterfaceOrientations 字段的限制。
当 presentationStyle 为 pageSheet 或 formSheet 时，此属性在 iOS 上会被忽略。
| 类型 | 默认值 |
|---|---|
array of enums('portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right') | ['portrait'] |
transparent
transparent 属性决定你的 modal 是否会填满整个视图。将其设为 true 会让 modal 在透明背景上渲染。
| 类型 | 默认值 |
|---|---|
| bool | false |
visible
visible 属性决定你的 modal 是否可见。
| 类型 | 默认值 |
|---|---|
| bool | true |