Перетаскивание пользовательского узла в JavaFX - PullRequest
Новая
       20

Перетаскивание пользовательского узла в JavaFX

0 голосов
/ 17 апреля 2010

Я не могу заставить его работать, хотя я очень близок к приемлемому решению . Я могу перетащить док, если это только прямоугольник. Но если я добавлю узел (например, изображение) в эту док-станцию, я не смогу получить рабочее решение.

Вот мой код: 

public class Dock extends CustomNode {

    // initialize this with an 64x64 image of your choice
    // via ImageView { image: Image {..}}
    public var content: Node[];
    public var width = 64;
    public var height = 64;
    public var xOffset: Number = 0;
    public var yOffset: Number = 0;
    var imgX: Number = 0;
    var imgY: Number = 0;
    var distX: Number;
    var distY: Number;
    public var rasterX = function (n: Number): Number {
                var MAX = 4 * 64;
                if (n < 0) {
                    return 0
                } else if (n > MAX) {
                    return MAX
                } else
                    return n
            }
    public var rasterY = rasterX;

    override protected function create(): Node {
        Group {
            // if we place the translate here then the whole dock will flicker
            //translateX: bind imgX;
            //translateY: bind imgY;
            content: [
                Rectangle {
                    // ... and here 'content' logically won't be dragged
                    translateX: bind imgX;
                    translateY: bind imgY;
                    height: bind height
                    width: bind width
                    fill: Color.LIGHTGRAY
                    strokeWidth: 4
                    stroke: Color.BLACK
                }, content]

            onMousePressed: function (e: MouseEvent): Void {
                    xOffset = e.x;
                    yOffset = e.y;

                    // Calculate the distance of the mouse point from the image
                    // top-left corner which will always come out as positive value
                    distX = e.x - imgX;
                    distY = e.y - imgY;                    
            }
            onMouseDragged: function (e: MouseEvent): Void {
                    // Find out the new image postion by subtracting the distance
                    // part from the mouse point.
                    imgX = rasterX(e.x - distX);
                    imgY = rasterY(e.y - distY);                    
            }
        }
    }

Я пробовал blockMouse: true на разных узлах, пробовал с помощью mouseReleased и т. Д., Но у меня не получилось нормально работающего решения. Есть ли у вас какие-либо указатели / советы о том, как это было сделано правильно?

1 Ответ

0 голосов
/ 18 апреля 2010

Наконец-то разобрались с этим примером , но вам не нужно следовать учебнику (у меня есть исключение !?) - просто скачайте source или используйте: 

public class Dock extends CustomNode {

public var content: Node[];
public var width = 64;
public var height = 64;
public var xOffset: Number = 0;
public var yOffset: Number = 0;    
public var rasterX = function (n: Number): Number {
            // the following code is for the 'grid' which can be avoided of course
            var n2 = n - n mod 64;
            var MAX = 4 * 64;
            if (n2 < 0) {
                return 0
            } else if (n2 > MAX) {
                return MAX
            } else
                return n2
        }
public var rasterY = rasterX;    

override protected function create(): Node {
    var node: Group;
    node = Group {
        content: [
            Rectangle {
                height: bind height
                width: bind width
                arcHeight: 10
                arcWidth: 10
                fill: Color.LIGHTGRAY
                strokeWidth: 4
                stroke: Color.BLACK
                effect: DropShadow {
                    offsetX: 5
                    offsetY: 5
                    color: Color.DARKGRAY
                    radius: 10
                }
            }, content]
        onMousePressed: function (e: MouseEvent): Void {
            xOffset = e.sceneX - node.translateX;
            yOffset = e.sceneY - node.translateY;
        }
        onMouseDragged: function (e: MouseEvent): Void {
            node.translateX = rasterX(e.sceneX - yOffset);
            node.translateY = rasterY(e.sceneY - yOffset);
        }
    }
}
}
...