MoveEvent
移动事件,一般用于视窗交互中平移视图。
- 移动端: 双指滑动
- 触摸板: 双指滑动
- 鼠标: 滚轮(纵向平移),Shift + 滚轮(横向平移),鼠标中键 + 拖拽 (自由移动)
- 拖拽: 拖拽元素到达视图边界时,会自动平移视图,以实现向外拖拽
事件名称
MoveEvent.START
开始移动事件
move.start
MoveEvent.MOVE
移动事件
move
MoveEvent.END
结束移动事件
move.end
关键属性
moveX: number
此次移动事件偏移的 X 轴距离(世界坐标)
moveY: number
此次移动事件偏移的 Y 轴距离(世界坐标)
坐标转换方法
moveX, moveY 属性的坐标转换。
getPageMove ( ): IPointData
获取在 page 坐标系中的偏移距离。
getInnerMove ( target?: UI
): IPointData
获取相对于 target 内部坐标 的偏移距离,target 不存在时为当前侦听元素。
getLocalMove ( relative?: UI
): IPointData
获取相对于 target 本地坐标 的偏移距离,target 不存在时为当前侦听元素。
继承
DragEvent
API
MoveEvent
示例
ts
import { Leafer, Rect, MoveEvent } from 'leafer-ui'
const leafer = new Leafer({
view: window,
type: 'draw'
})
const rect = new Rect({ x: 100, y: 100, fill: '#32cd79', draggable: true })
leafer.add(rect)
leafer.on(MoveEvent.MOVE, function (e: MoveEvent) {
leafer.moveWorld(e.moveX, e.moveY)
})