跳到主要内容

空间缩放(Spatial Magnify)

概述

表示完成了一次对空间目标的双手「选择、激活、持续」动作,并产生缩放效果。无论这种交互是通过间接的「注视 + 捏合」完成,还是通过直接触摸完成

触发条件

目标触发时机
空间化 2D HTML 元素在自身内容占据的 3D 空间位置被「捏住不放」后触发这套事件。
3D 容器元素在自身可交互内容占据的 3D 空间位置被「捏住不放」后触发这套事件。

心智模型

双手之间的连线(相当于一个真实物体)可以在 3D 空间中做拉伸。

事件类型名称

阶段DOM 事件
缩放持续中spatialmagnify
缩放结束spatialmagnifyend

React 用法

阶段JSX 属性
缩放持续中onSpatialMagnify
缩放结束onSpatialMagnifyEnd

原生 DOM 用法

当前限制

WebSpatial SDK 现阶段不允许在 DOM 元素(包括来自 Ref 的元素)上直接监听空间事件。

事件生命周期

「选择」过程中不触发事件;捏住不放激活后,保持动作会持续触发 spatialmagnify,松开后触发 spatialmagnifyend

SpatialMagnifyEvent 事件数据

字段取值含义
magnification百分比风格的数字,比如 1 表示 100%,1.5 表示 150%。相对于初始状态的缩放量。

SpatialMagnifyEndEvent 事件数据

没有额外数据

spatialmagnifyend 回调拿到的 SpatialMagnifyEndEvent 对象没有额外属性。