ycanvas

完成项

• 渲染系统

• 事件系统

待完成项

• 生命周期

需要做拖拽移动的效果

• 需要哪些数据

• 当前状态(帧)四个点的坐标

• 上一个状态(帧)四个点的坐标

• 当前鼠标的位置

• 是否是按下状态

• 需要哪些事件

• 鼠标按下

• 鼠标按下并且移动

• 鼠标抬起

• 鼠标移除画布

• 注意的点是

• 对于边界问题的处理,比如我这个图形移动的位置不能超出整个画布的大小,超出安边界计算

• 对于是否存在于此路径中的判断,这是前提如果都不在这里面那些事件都不触发(鼠标按下并且移动的事件),单个图形可以用isPointInPath玩,而且这个isPointInPath是拿的最新的路径进行判断的

• 清除指定的图形,而不是清除整体canvas,这就要记录上一次的图形的状态了

• 基本思路

说白了就是拿到最新的位置,然后设置好了四个点进行重新绘制.

主要是重新绘制的时机是在鼠标按下并且移动的事件回调中执行的

然后鼠标按下进行设置按下的状态

鼠标抬起和鼠标移出画布更改按下的状态为未按下