在easeljs/tweenjs 中手动旋转

Posted

技术标签:

【中文标题】在easeljs/tweenjs 中手动旋转【英文标题】:Manual rotation in easeljs/tweenjs 【发布时间】:2018-10-27 17:16:59 【问题描述】:

我在手动旋转对象时遇到了问题。我想要的是当一个人双击该对象时,它会旋转 20 次(任一侧,我都不挑剔)一次。如果他们再次单击,它会再次旋转 20。但是,它现在根本不会旋转(双击或不旋转)。我在这里做错了什么?

var tri2 = new createjs.Shape();
tri2.graphics.beginStroke("#000").beginFill('#000').drawPolyStar(0, 0, 50, 3, 0, 270);

var draggerTri2 = new         createjs.Container();

draggerTri2.x = Math.random()*100;
draggerTri2.y = Math.random()*100;
draggerTri2.addChild(tri2);  

stage.addChild(draggerTri2);

draggerTri2.on("pressmove",function move(evt) 

evt.currentTarget.x = evt.stageX;
evt.currentTarget.y = evt.stageY;

stage.update();   

);

draggerTri2.on("dblclick", function rotate(evt) 

var tween2 = new TWEEN.Tween(draggerTri2,dataset)
          .to(left: "-20", 2000)
      .repeat(0)
      .onUpdate(function(draggerTri2)
        draggerTri2.left = Math.round(draggerTri2.left);
      )
     .start()

stage.update();   

 );

  stage.update();

Codepen 链接:https://codepen.io/AoifeMcNeill/pen/XqyWej?editors=0010

【问题讨论】:

【参考方案1】:

您的补间代码不是 TweenJS 代码。如果你双击,你会得到一个没有定义 TWEEN 的控制台错误。

TweenJS 代码如下所示:

draggerTri2.on("dblclick", function rotate(evt) 
  var tween2 = createjs.Tween.get(draggerTri2, override:true)
  .to(rotation:draggerTri2.rotation+20, 2000)
  .on("change", function(event)
    var tween = event.target,
        draggerTri2 = tween.target;
    draggerTri2.rotation = Math.round(draggerTri2.rotation);
    stage.update();  // Only do this if nothing else is updating your stage
  );
);

您还可以使用RelativePlugin 相对于当前旋转而不是绝对数字进行旋转:

RelativePlugin.install();
var tween2 = createjs.Tween.get(draggerTri2, override:true)
    .to(rotation:"+20", 2000);

【讨论】:

谢谢!在过去的 3 个月里,我刚刚开始学习 createjs [及其'easeljs 子库],并且最近才开始使用 Tweenjs 一个,并且没有大量的文档,所以有点迷失了。我把这个作为答案。 我们试图在网站(和 Github)上包含大量文档,以及示例,甚至一些教程。有兴趣知道什么样的材料会更有帮助 - 让我们知道github.com/CreateJS/EaselJS/issues 或reddit.com/r/createjs

以上是关于在easeljs/tweenjs 中手动旋转的主要内容,如果未能解决你的问题,请参考以下文章

eas启动服务器时非法组件

EAS WebService部署

使用 EAS 反应原生 Expo 环境变量

如何使用事件来计算 eas 中重复事件的结束日期

金蝶eas crm 无法完整打开

使用 Core Graphics 以 30-60 fps 手动移动/旋转物体