2017-07-27 192 views
0

正在使用Adobe Animate CC(HTML5)制作停车场项目。 我已经进入我的画布汽车和它的车轮。通过下面的命令,我可以通过按下键盘箭头左右旋转车轮。Createjs中的最大旋转(adobe animate cc)

document.onkeydown = keyHandler.bind(this); 
function keyHandler(event) { 

var e = event||window.event; 
//left 
if(e.keyCode == 37) { 
    this.car.wheels3.rotation-=2; 

但我想使其在一定的旋转比旋转,像汽车rotates.I想我必须作出一个方法的实际轮,但我不知道如何使用旋转属性与方法我想创造。任何想法/帮助表示赞赏。

回答

0

你需要轮动画实际上是:

createjs.Tween.get(car.wheel,{loop:true,override:true}).to({rotation:"360"}, 1000); 
//or 
createjs.Tween.get(car.wheel,{loop:true,override:true}).to({rotation:"-360"}, 1000); 

更新,根据新的情况:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Example</title> 
<script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script> 
<script> 
function init() 
{ 
    var stage = new createjs.Stage("canvas"); 
    createjs.Ticker.setFPS(24); //set some FPS 
    createjs.Ticker.addEventListener("tick", stage); //set autiomatic refresh 

    //let's draw something like wheels, with registration point somewhere in the middle :) 
    var wheels=new createjs.Shape(); 
    wheels.graphics.beginFill("#CCCCCC").drawRect(-100,0,20,50); 
    wheels.graphics.beginFill("#CCCCCC").drawRect(-100,15,200,20); 
    wheels.graphics.beginFill("#CCCCCC").drawRect(100,0,20,50); 
    stage.addChild(wheels); 


    wheels.x=200; 
    wheels.y=100; 


    document.addEventListener("keydown", onKeyDown); 

    var wheelsInitialRotation=wheels.rotation; //save whells initial rotation 
    var maximumAngleForRotation=20; //set maximum angle 

    function onKeyDown(e) 
    { 
     var amount; 
     e = e || window.event; 

     switch(e.keyCode) 
     { 
      //right 
      case 39: 
       amount=2; 
       break; 
      //left 
      case 37: 
       amount=-2; 
       break; 
      //all other 
      default: 
       amount=0; 

     } 

     //check is new angle is not more or less then allowed :) 
     if(!(wheels.rotation+amount>wheelsInitialRotation+maximumAngleForRotation || wheels.rotation+amount<wheelsInitialRotation-maximumAngleForRotation)) 
     { 
      wheels.rotation+=amount; 
     } 



    } 


} 
</script> 
</head> 
<body onload="init();"> 
    <canvas id="canvas" width="400" height="400"></canvas> 
</body> 
</html> 
+0

createjs.Tween.get意味着正在创建一个类? –

+0

TweenJS是CreateJS库的一部分,它用于动画,请点击此处查看:http://www.createjs.com/tweenjs – gMirian

+0

get方法意味着返回一个新的补间实例,并指定您指定的属性在@gMirian代码的情况下,'loop'和'override')。 – CrisMVP3200

相关问题