跳到主要内容
版本:0.82

Modal

Modal 组件是一种在包裹视图之上展示内容的基本方式。

示例


参考

属性

View 属性

继承自 View 属性


animated

已弃用

请改用 animationType 属性。


animationType

animationType 属性控制模态框如何进行动画显示。

可选值:

  • slide 从底部滑入
  • fade 淡入视图
  • none 不带动画显示
类型默认值
enum('none', 'slide', 'fade')none

backdropColor

模态框的 backdropColor(或模态框容器的背景色)。如果未提供且 transparentfalse,默认值为 white。如果 transparenttrue,则会被忽略。

类型默认值
colorwhite

hardwareAccelerated
Android

hardwareAccelerated 属性控制是否为底层窗口强制启用硬件加速。

类型默认值
boolfalse

navigationBarTranslucent 属性决定模态框是否应显示在系统导航栏下方。不过,statusBarTranslucent 也需要设为 true,才能使导航栏透明。

类型默认值
boolfalse

onDismiss
iOS

onDismiss 属性允许传入一个函数,该函数会在模态框被关闭后调用一次。

类型
function

onOrientationChange
iOS

当模态框显示期间方向发生变化时,会调用 onOrientationChange 回调。传入的方向仅为 portraitlandscape。无论当前方向如何,在初始渲染时也会调用此回调。

类型
function

allowSwipeDismissal
iOS

控制在 iOS 上是否可以通过向下滑动来关闭模态框。 这要求你实现 onRequestClose 属性来处理关闭行为。

类型默认值
boolfalse

ref

挂载时会分配给一个 元素节点 的 ref setter。


onRequestClose

当用户在 Android 上点击硬件返回按钮,或在 Apple TV 上点击菜单按钮时,会调用 onRequestClose 回调。由于这是必需属性,只要模态框处于打开状态,BackHandler 事件就不会被触发。 在 iOS 上,当使用 presentationStylepageSheetformSheet 的拖拽手势关闭 Modal 时,会调用此回调。启用 allowSwipeDismissal 后,关闭模态框之后也会调用此回调。

类型
function
必需
Android
TV

function
iOS

onShow

onShow 属性允许传入一个函数,该函数会在模态框显示后调用一次。

类型
function

presentationStyle
iOS

presentationStyle 属性控制模态框的显示方式(通常用于 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 属性决定模态框是否应显示在系统状态栏下方。

类型默认值
boolfalse

supportedOrientations
iOS

supportedOrientations 属性允许模态框旋转到所指定的任意方向。在 iOS 上,模态框仍会受应用 Info.plist 中 UISupportedInterfaceOrientations 字段的限制。

备注

presentationStylepageSheetformSheet 时,此属性在 iOS 上会被忽略。

类型默认值
array of enums('portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right')['portrait']

transparent

transparent 属性决定模态框是否会填充整个视图。将其设为 true 时,模态框会以透明背景渲染。

类型默认值
boolfalse

visible

visible 属性决定模态框是否可见。

类型默认值
booltrue