通过bindContentCover属性为组件绑定全屏模态页面,在组件插入和删除时可通过设置转场参数ModalTransition显示过渡动效。
说明
从API Version 10开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
不支持横竖屏切换。
不支持路由跳转。
bindContentCover
bindContentCover(isShow: Optional, builder: CustomBuilder, options?: ContentCoverOptions)
给组件绑定全屏模态页面,点击后显示模态页面。模态页面内容自定义,显示方式可设置无动画过渡,上下切换过渡以及透明渐变过渡方式。
元服务API: 从API version 11开始,该接口支持在元服务中使用。
系统能力: SystemCapability.ArkUI.ArkUI.Full
参数:
参数名 | 类型 | 必填 | 说明 |
---|---|---|---|
isShow | Optional | 是 | 是否显示全屏模态页面。从API version 10开始,该参数支持[$$]双向绑定变量。 |
builder | [CustomBuilder] | 是 | 配置全屏模态页面内容。 |
options | [ContentCoverOptions] | 否 | 配置全屏模态页面的可选属性。 |
ContentCoverOptions
继承自[BindOptions]。
名称 | 类型 | 必填 | 描述 |
---|---|---|---|
modalTransition | [ModalTransition] | 否 | 全屏模态页面的转场方式。元服务API: 从API version 11开始,该接口支持在元服务中使用。 |
onWillDismiss12+ | Callback<[DismissContentCoverAction]> | 否 | 全屏模态页面交互式关闭回调函数。**说明:**当用户执行back事件关闭交互操作时,如果注册该回调函数,则不会立刻关闭。在回调函数中可以通过reason得到阻拦关闭页面的操作类型,从而根据原因选择是否关闭全屏模态页面。在onWillDismiss回调中,不能再做onWillDismiss拦截。元服务API: 从API version 12开始,该接口支持在元服务中使用。 |
transition12+ | [TransitionEffect] | 否 | 全屏模态页面的转场方式。元服务API: 从API version 12开始,该接口支持在元服务中使用。 |
DismissContentCoverAction12+类型说明
元服务API: 从API version 12开始,该接口支持在元服务中使用。
名称 | 类型 | 必填 | 描述 |
---|---|---|---|
dismiss | function | 是 | 全屏模态页面关闭回调函数。开发者需要退出页面时调用。 |
reason | [DismissReason] | 是 | 返回本次拦截全屏模态页面退出的事件原因。 |
示例
示例1
全屏模态无动画转场模式下,自定义转场动画。
// xxx.ets
@Entry
@Component
struct ModalTransitionExample {
@St