0

を扱う問題がありますcanvas。

kineticモバイルイベント（特にドラッグ可能）を使用したいのですが、同時に関数も使用したいと思いますclip()。

これが私のコードです:

<!DOCTYPE HTML>
<html>
  <head>
    <style>
      canvas {
        border: 1px solid #9C9898;
      }
    </style>
    <script src="kinetic-v3.9.4.js"></script>
    <script>
      window.onload = function() {
        var stage = new Kinetic.Stage({
          container: "container",
          width: 708,
          height: 500
        });
        var layer = new Kinetic.Layer();

        var circle1 = new Kinetic.Circle({
          x: 150,
          y: 150,
          radius: 75,
          fill: "red",
          draggable: true
        });

        var circle2 = new Kinetic.Circle({
          x: 350,
          y: 150,
          radius: 75,
          fill: "blue",
        });

        layer.add(circle2);
        layer.add(circle1);
        stage.add(layer);
      };

    </script>
  </head>
  <body onmousedown="return false;">
    <div id="container"></div>
  </body>
</html>

私はドラッグ可能な最初の円を持っていますが、それを使用したいと思いますが、そのclip function方法がよくわかりません。さらに、次のような 2d コンテキストを取得しようとしました。

var context = this.getContext();

しかし、うまくいきませんでした。助けてくれる人がいたらよろしくお願いします。

この例も見ましたが、モバイル デバイスでは機能しません。

4

1 に答える 1

4

あなたが言及した例がモバイルで機能しない理由は、マウスイベントハンドラーのみを使用しているためです。

stage.on("mousemove", function(){})

ただし、次のようなタッチイベントを追加する必要があります。

stage.on("mousemove touchmove", function(){})

touchstart、touchmove、touchend

幸運を！

于 2012-05-11T14:50:24.303 に答える