在Adobe Animate 中实现在 Html5 Canvas 中拖动动画元素

可以先参考:关于Adobe Animate CC的一些观点

在Animate制作H5交互内容中,让一个元素能够被鼠标拖动,是以个常用的功能,但是在当前的An版本中,没有关于生成Html Canvas交互的CreateJS api手册,也没有像as3里的拖放、触控和拖动代码片段。不过,既然导出的H5是基于js交互的,那么就可以使用js的方式来解决:

//dragableCar 是一要拖动的原件
this.dragableCar.addEventListener("pressmove", followFinger.bind(this));

function followFinger() {
    console.log("X:"+this.parent.mouseX + " Y:"+this.parent.mouseY);
    //转换外界坐标到本地坐标
    var newPoint = this.globalToLocal(this.parent.mouseX,this.parent.mouseY);
    console.log("X:"+newPoint.x + " Y:"+newPoint.y);
    this.dragableCar.x = newPoint.x;
    this.dragableCar.y = newPoint.y;
}

注:暂不支持在手机上用手拖动

发表评论

电子邮件地址不会被公开。 必填项已用*标注