通过bindSheet属性为组件绑定半模态页面,在组件插入时可通过设置自定义或默认的内置高度确定半模态大小。
说明
从API Version 10开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
不支持路由跳转。
bindSheet
bindSheet(isShow: Optional, builder: CustomBuilder, options?: SheetOptions)
给组件绑定半模态页面,点击后显示模态页面。
元服务API: 从API version 11开始,该接口支持在元服务中使用。
系统能力: SystemCapability.ArkUI.ArkUI.Full
参数:
参数名 | 类型 | 必填 | 说明 |
---|---|---|---|
isShow | Optional | 是 | 是否显示半模态页面。从API version 10开始,该参数支持[$$]双向绑定变量。 |
builder | [CustomBuilder] | 是 | 配置半模态页面内容。 |
options | [SheetOptions] | 否 | 配置半模态页面的可选属性。 |
说明
-
在非双向绑定情况下,以拖拽方式关闭半模态页面不会改变isShow参数的值。
-
为了使isShow参数值与半模态界面的状态同步,建议使用[$$]双向绑定isShow参数。
-
在半模态单挡位向上拖拽或是多挡位上滑换挡情况下,内容在拖拽结束或换挡结束后更新显示区域。
-
半模态是一个严格和宿主节点绑定在一起的弹窗。若是想实现类似“页面显示的瞬间就弹出半模态”的效果,请确认宿主节点是否已挂载上树。若宿主节点还没上树就将isShow置为true,半模态将不生效。建议使用[onAppear]函数,确保在宿主节点挂载后再显示半模态。
尤其是 [SheetMode] = EMBEDDED 时,除宿主节点外,还需确保对应的页面节点成功挂载。
-
半模态页面的离场动效不支持打断,动效执行期间无法响应其他手势动作。目前离场动效使用[弹簧曲线],该动画曲线存在视觉上并不明显的拖尾动画。因此,在半模态退出时,视觉上半模态页面已经消失,但此时动效可能还未结束,若想再次点击拉起半模态页面则不会响应。需要等动效完全结束后,才可以再次拉起。
SheetOptions
继承自[BindOptions]。
名称 | 类型 | 必填 | 描述 |
---|---|---|---|
height | [SheetSize] | [Length] | 否 |
detents11+ | [([SheetSize] | [Length]), ( [SheetSize] | [Length])?, ([SheetSize] |
preferType11+ | [SheetType] | 否 | 半模态页面的样式。**说明:**半模态在不同屏幕宽度所支持的显示类型:1. 宽度 < 600vp:底部。2. 600vp <= 宽度 < 840vp:底部、居中。3. 宽度 >= 840vp:底部、居中、跟手。元服务API: 从API version 12开始,该接口支持在元服务中使用。 |
showClose11+ | boolean | [Resource] | 否 |
dragBar | boolean | 否 | 是否显示控制条。**说明:**半模态面板的detents属性设置多个不同高度并且设置生效时,默认显示控制条。否则不显示控制条。元服务API: 从API version 11开始,该接口支持在元服务中使用。 |
blurStyle11+ | [BlurStyle] | 否 | 半模态面板的模糊背景。默认无模糊背景。元服务API: 从API version 12开始,该接口支持在元服务中使用。 |
maskColor | [ResourceColor] | 否 | 半模态页面的背景蒙层颜色。元服务API: 从API version 11开始,该接口支持在元服务中使用。 |
title11+ | [SheetTitleOptions] | [CustomBuilder] | 否 |
enableOutsideInteractive11+ | boolean | 否 | 半模态所在页面是否允许交互。**说明:**设置为true时允许交互,不显示蒙层;设置为false时不允许交互,显示蒙层;若不进行设置,默认底部弹窗与居中弹窗不允许交互,跟手弹窗允许交互。当设置为true时,maskColor设置无效。元服务API: 从API version 12开始,该接口支持在元服务中使用。 |
shouldDismiss11+ | (sheetDismiss: [SheetDismiss]) => void | 否 | 半模态页面交互式关闭回调函数。**说明:**当用户执行下拉关闭/back事件/点击蒙层关闭/关闭按钮关闭交互操作时,如果注册该回调函 |