kineticjs - 在 KineticJS 中 Shape 类的哪些属性是可转换的

Question

我不太清楚ShapeClass 中的哪些属性可以在KineticJSlib 中转换。任何关于主观的观点都会非常有帮助。

Answer 1

最初我问这个问题是因为我意识到我不能补间 aShape的fill属性，

然而，经过一番搜索，我发现了一个关于snorkl的快速实验，这让我看到了如何使用 greensock 著名的TweenMax对其进行动画处理

所以这就是我能够设置的，我会为你们把它放在 jsfiddle 上，但我不会为找到 TweenMax 和 Kinetic 的 CDN 版本而烦恼。

var stage = new Kinetic.Stage({
    container: 'canvasContainer',   //Some div's id on your page
    width: 800,
    height: 600
});

var layer = new Kinetic.Layer();

var circle = new Kinetic.Circle({
    x: 0,
    y: 0,
    radius: 50,
    fill: "#FF0000",
});

layer.add(circle);


TweenMax.to(circle, 1, {
    setX: 100,      //notice the camelType
    setY: 100,      //tweenMax translates setProperty to, circle.Property(tweened value)

    colorProps:{    //if you want to tween colour use colorProps
        setFill: randomRGB()
    }
});

TweenLite.ticker.addEventListener("tick", go);


function go() {
  layer.draw(); //redraws after each calculation
}

希望能帮助到你