跳到主要内容

模态框

模态框组件是在封闭视图之上呈现内容的基本方式。

示例


参考

属性

视图属性

继承自视图属性


🗑️ animated

已废弃

请使用 animationType 属性代替。


animationType

animationType 属性控制模态框的动画方式。

可选值:

  • slide 从底部滑入
  • fade 淡入显示
  • none 无动画直接显示
类型默认值
枚举('none', 'slide', 'fade')none

backdropColor

模态框的背景色(或模态框容器的背景色)。如果未提供且 transparentfalse,默认为 white。当 transparenttrue 时此属性被忽略。

类型默认值
颜色white

hardwareAccelerated
Android

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

类型默认值
boolfalse

navigationBarTranslucent 属性确定模态框是否应该显示在系统导航栏之下。但同时 statusBarTranslucent 也必须设置为 true,导航栏才会变为半透明。

类型默认值
boolfalse

onDismiss
iOS

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

类型
function

onOrientationChange
iOS

onOrientationChange 回调函数会在模态框显示期间屏幕方向发生变化时调用。传入的方向仅可能为 'portrait''landscape'。此回调在初始渲染时也会调用,无论当前方向如何。

类型
function

allowSwipeDismissal
iOS

控制模态框是否可以通过向下滑动手势来关闭,这仅在 iOS 有效。 需要实现 onRequestClose 属性来处理关闭。

类型默认值
boolfalse

ref

一个 ref 设置器,当组件挂载时将被赋予对应的元素节点


onRequestClose

当用户在 Android 设备上点击硬件返回键或者在 Apple TV 上的菜单键时,会调用此回调函数。由于这是一个必需属性,注意只要模态框打开,BackHandler 事件将不会被触发。 在 iOS 上,当模态框通过拖拽手势关闭(presentationStylepageSheetformSheet)时也会调用此回调;当启用 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 属性确定模态框是否应该显示在系统状态栏之下。

类型默认值
boolfalse

supportedOrientations
iOS

supportedOrientations 属性允许模态框旋转到指定的屏幕方向列表。在 iOS 上,模态框的旋转依然受应用 Info.plist 中 UISupportedInterfaceOrientations 字段限制。

备注

当使用 presentationStylepageSheetformSheet 时,此属性会被 iOS 忽略。

类型默认值
枚举数组('portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right')['portrait']

transparent

transparent 属性决定模态框是否填充整个视图。设置为 true 会让模态框渲染在透明背景之上。

类型默认值
boolfalse

visible

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

类型默认值
booltrue