2

x=0 から x=400 までの画像をアニメーション化するのに問題があります。私はeaseljsとtweenjsを使用しています。ここに私のコードがあります: Javascript:

<!doctype html>
<html>
<head>
    <title></title>
    <script src="js/easeljs-0.4.1.min.js"></script>
    <script src="js/tweenjs-0.2.0.min.js"></script>

    <script type="text/javascript">
        function init() {
            var canvas = document.getElementById("canvas");
            var stage = new Stage(canvas);
            var img=new Image();

            img.src="http://exampledomain.com/exampleimage.jpg";
            img.onload = function(e){
                var title = new Bitmap(e.target);
                stage.addChild(title);
                stage.update();
            }
            var tween = Tween.get(img).to({x:400},400).call(tweenComplete);
        }

        function tweenComplete(){
            alert('done');
        }
    </script>
</head>
<body onload="init();">
    <canvas id="canvas" width="430" height="446"></canvas>
</body>
</html>

400ミリ秒後にアラートが開きますが、画像は1ピクセル移動しないため、トゥイーンが開始することを確認してください。

4

3 に答える 3

1

コードを壊すためにいくつかの小さなことが共謀しているようです。

まず、ちょっとした競合状態です。ビットマップを適切に作成し、 でステージに追加しますが、その直後img.onload()のコードは、ビットマップが作成/追加される前を含め、いつでも実行できます。var tween = ...

行を関数var tween = ...の最後に移動し、を変更して、イメージの代わりにビットマップを操作できるようにします。img.onloadget(img)get(title)

最後に、ステージが更新されるようにティッカーを動かす必要があります。の最後で次のようなことを試してくださいinit():

Ticker.addListener(stage);

[CreateJS の新しいバージョンを使用している場合は、namespace/prepend "createjs." を追加する必要があります。ステージ、ビットマップ、ティッカーなどの使用に]

于 2012-09-18T19:58:35.237 に答える
1

内部の画像ではなく、ビットマップをアニメーション化する必要があります。作成した Bitmap インスタンスへの参照を保存し、代わりにその x/y を設定します。

于 2013-02-22T21:48:49.017 に答える
0

アニメーション化する場所からのタイル（画像）の初期 x、y 座標を設定します。トゥイーンで get(img) にもかかわらず get(title) として画像オブジェクトのタイトルを使用し、また、連続更新のためにティッカーを使用します。

于 2014-07-09T12:58:01.780 に答える