1

APIに関するKineticのチュートリアルに従って、KineticJSアプリにスクロールバーを配置しようとしています。スクロールバー自体は正常に表示されていますが、スクロールバーが実際にビューを移動するように、実際にステージまたは各レイヤーを移動するためにイベントリスナーをどうするかわかりません。

var hscrollArea = new Kinetic.Rect({
    x: 10,
    y: $(window).height() - 30 - 80, // 80 to account for the fixed footer
    width: $(window).width() - 40,
    height: 20,
    fill: "gray",
    opacity: 0.3
});

var hscroll = new Kinetic.Rect({
    x: 10,
    y: $(window).height() - 30 - 80,// 80 to account for the fixed footer
    width: 130,
    height: 20,
    fill: "orange",
    draggable: true,
      dragBoundFunc: function(pos) {
        // TODO: Move stage or layers at this point
        console.log("dragBoundFunc: " + this);
        return {
            x: pos.x,
            y: this.getAbsolutePostion().y
        };
      },
    opacity: 0.9,
    stroke: "black",
    strokeWidth: 1
});

var vscrollArea = new Kinetic.Rect({
    x: $(window).width() - 30,
    y: 10,
    width: 20,
    height: $(window).height() - 40 - 80,
    fill: "gray",
    opacity: 0.3
});

var vscroll = new Kinetic.Rect({
    x: $(window).width() - 30,
    y: 10,
    width: 20,
    height: 70,
    fill: "orange",
    draggable: true,
    dragBoundFunc: function(pos) {
        // TODO: Move stage or layers at this point
        console.log("dragBoundFunc: " + this);
        return {
            x: this.getAbsolutePosition().x,
            y: pos.y
        };
    },
    opacity: 0.9,
    stroke: "black",
    strokeWidth: 1
});

どんな助けでも大歓迎です:)ありがとう、ベッキー

4

2 に答える 2

0

スクロールバー（長方形）をドラッグすると、ステージまたはレイヤーを移動できます。つまり、

stage.move(50,50);
stage.draw();

stage.move(-50,-50);
stage.draw();
于 2013-02-28T15:09:17.747 に答える