模态框
模态框组件是在封闭视图之上呈现内容的基本方式。
示例
参考
属性
视图属性
继承自视图属性。
🗑️ animated
请使用 animationType 属性代替。
animationType
animationType 属性控制模态框的动画方式。
可选值:
slide从底部滑入fade淡入显示none无动画直接显示
| 类型 | 默认值 |
|---|---|
枚举('none', 'slide', 'fade') | none |
backdropColor
模态框的背景色(或模态框容器的背景色)。如果未提供且 transparent 为 false,默认为 white。当 transparent 为 true 时此属性被忽略。
| 类型 | 默认值 |
|---|---|
| 颜色 | white |
hardwareAccelerated Android
hardwareAccelerated 属性控制是否强制为底层窗口启用硬件加速。
| 类型 | 默认值 |
|---|---|
| bool | false |
navigationBarTranslucent Android
navigationBarTranslucent 属性确定模态框是否应该显示在系统导航栏之下。但同时 statusBarTranslucent 也必须设置为 true,导航栏才会变为半透明。
| 类型 | 默认值 |
|---|---|
| bool | false |
onDismiss iOS
onDismiss 属性允许传入一个函数,在模态框被关闭后调用。
| 类型 |
|---|
| function |
onOrientationChange iOS
onOrientationChange 回调函数会在模态框显示期间屏幕方向发生变化时调用。传入的方向仅可能为 'portrait' 或 'landscape'。此回调在初始渲染时也会调用,无论当前方向如何。
| 类型 |
|---|
| function |
allowSwipeDismissal iOS
控制模态框是否可以通过向下滑动手势来关闭,这仅在 iOS 有效。
需要实现 onRequestClose 属性来处理关闭。
| 类型 | 默认值 |
|---|---|
| bool | false |
ref
一个 ref 设置器,当组件挂载时将被赋予对应的元素节点。
onRequestClose
当用户在 Android 设备上点击硬件返回键或者在 Apple TV 上的菜单键时,会调用此回调函数。由于这是一个必需属性,注意只要模态框打开,BackHandler 事件将不会被触发。
在 iOS 上,当模态框通过拖拽手势关闭(presentationStyle 为 pageSheet 或 formSheet)时也会调用此回调;当启用 allowSwipeDismissal 后,在关闭模态框后会调用该回调。
| 类型 |
|---|
| function 必需 Android 电视 function iOS |
onShow
onShow 属性允许传入一个函数,在模态框显示后调用。
| 类型 |
|---|
| function |
presentationStyle iOS
presentationStyle 属性控制模态框的呈现风格(通常用于 iPad 或更大尺寸 iPhone)。详情请参阅 https://developer.apple.com/reference/uikit/uimodalpresentationstyle 。
可选值:
fullScreen全屏覆盖pageSheet覆盖一个居中的竖屏宽度视图(仅限更大设备)formSheet覆盖一个居中的窄屏宽度视图(仅限更大设备)overFullScreen全屏覆盖且允许透明背景
| 类型 | 默认值 |
|---|---|
枚举('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 忽略。
| 类型 | 默认值 |
|---|---|
枚举数组('portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right') | ['portrait'] |
transparent
transparent 属性决定模态框是否填充整个视图。设置为 true 会让模态框渲染在透明背景之上。
| 类型 | 默认值 |
|---|---|
| bool | false |
visible
visible 属性决定模态框是否可见。
| 类型 | 默认值 |
|---|---|
| bool | true |