跳到主要内容
版本:0.79

模态框

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
安卓
​

hardwareAccelerated 属性控制是否强制底层窗口进行硬件加速。

类型默认值
布尔值false

navigationBarTranslucent 属性决定你的 modal 是否应该位于系统导航栏下方。但是,也需要将 statusBarTranslucent 设置为 true 才能使导航栏半透明。

类型默认值
布尔值false

onDismiss
iOS
​

onDismiss 属性允许传递一个函数,该函数将在 modal 被关闭后调用。

类型
函数

onOrientationChange
iOS
​

onOrientationChange 回调在 modal 显示时方向发生变化时调用。提供的方向仅为 'portrait' 或 'landscape'。无论当前方向如何,此回调也会在初始渲染时调用。

类型
函数

onRequestClose​

当用户在 Android 上按下硬件返回按钮,或在 Apple TV 上按下菜单按钮时,会调用 onRequestClose 回调。由于这个必需属性的存在,请注意,只要 modal 处于打开状态,BackHandler 事件就不会触发。 在 iOS 上,当使用 presentationStyle 为 pageSheet 或 formSheet 时,通过拖拽手势关闭 Modal 时会调用此回调

类型
函数
必需
安卓
电视

函数
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
安卓
​

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