Dragging Custom Node in JavaFX

Posted by Karussell on Stack Overflow See other posts from Stack Overflow or by Karussell
Published on 2010-04-16T21:55:26Z Indexed on 2010/04/16 22:03 UTC
Read the original article Hit count: 237

Filed under:
|
|

I cannot get it working although I am very close to an acceptable solution. I can drag the Dock if it is only a rectangle. But if I add a node (e.g. an image) to this dock I am not able to get a working solution. Do you have a code snippet, link or other advices for me?

Here is my code:

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' 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);                    
            }
        }
    }

© Stack Overflow or respective owner

Related posts about javafx

Related posts about drag