2012-03-20 13 views
3

キネティックスで画像を反転しますか?

var imageObj = new Image(); 
imageObj.onload = function(){ 
    imageF = new Kinetic.Image({ 
     x: 0, 
     y: 0, 
     scale: (100,100), 
     image: imageObj, 
     name: "fluffy", 
    }); 
    layer.add(imageF); 
    stage.add(layer); 
    stage.start(); 
    } 
imageObj.src = "Flutter_Fluffy_100.png"; 

ここで定義されており、私はそれがランニング中に特定の時間に(水平方向)を反転持ってできるようにしたいと私は、私のコードでイメージを持っています。私は、元のイメージを元に戻したものに変更しようとしましたが、イメージの複製、位置の再設定、多くの問題が発生しました。この方法で作成して使用するイメージを反転する方法はありますか?ありがとう!

答えて

10

これは何をしたい、おそらくです:

//imageF.scale.y =-1; 
imageF.scale.x =-1; 

それはここで実証されています: http://www.html5canvastutorials.com/kineticjs/html5-canvas-kineticjs-scale-animation-tutorial/

それはほとんど同じイメージを持つのです。 http://randompast.github.io/randomtests/kineticjs/FlipImage-Demo.html

編集:固定リンク

+5

ちょうど混乱を避けるために、私はKineticJS APIが少しsiを変更したことを言及したいと思いますこの回答が掲載されました。水平スケールは次のように設定できます:imageF.setScale({x:-1}); –

関連する問題