如何在放置在不同窗格/区域中的两个节点之间绘制线条 [英] How to draw line between two nodes placed in different Panes / Regions

问题描述

我正试着画一个家谱树。在我的树中，我存储有关前合作伙伴的信息。所以小组（地区）的人看起来像这样

I am tryin to draw a genealogy tree. In my tree, I store information about ex partners. So the Panel (Region) for person shoud looking like this

Z * * * Z * * * Z * * * X --- Y

其中Z代表exPartner，X代表Persion，Y代表现任妻子/丈夫

Where Z represent exPartner, X represent Persion and Y represent current Wife / Husband

现在我想绘制线来连接与孩子们的当前关系。和孩子们的关系。 （图形上会有一行beetwen Z和*）

And now I would like to draw line to connect current relation with children. And ec relations with children. (graphicaly there will be a line beetwen Z and *)

但当人在其他区域时，LayoutX和LayoutX属性返回相对值。
我该怎么做，以及动态调整这个面板的大小？我希望Z应该总是在连接孩子的水平线的中间。

But when the person is in the other region LayoutX and LayoutX property return relative value. How Can I do that, and how dynamicaly resize this Panel ? I would like that Z should be allways at middle of line Horizontal line connecting children.

推荐答案

给定任何节点，你可以得到它同一场景图中任何其他节点的坐标系中的边界：

Given any node, you can get its bounds in the coordinate system of any other node in the same scene graph with:

Node nodeOfInterest = ... ;
Node anotherNode = ... ;

// ...

Bounds boundsInScene = nodeOfInterest.localToScene(nodeOfInterest.getBoundsInLocal());
Bounds boundRelativeToAnotherNode = anotherNode.sceneToLocal(boundsInScene);

假设您有某种窗格，它是您要连接的两个节点的共同祖先，你可以这样做：

So assuming you have some kind of pane which is a common ancestor to two nodes you want to connect, you can do this:

Pane commonAncestor = ... ;
Node n1 = ... ;
Node n2 = ... ;

Bounds n1InCommonAncestor = getRelativeBounds(n1, commonAncestor);
Bounds n2InCommonAncestor = getRelativeBounds(n2, commonAncestor);
Point2D n1Center = getCenter(n1InCommonAncestor);
Point2D n2Center = getCenter(n2InCommonAncestor);

Line connector = new Line(n1Center.getX(), n1Center.getY(), n2Center.getX(), n2Center.getY());
commonAncestor.getChildren().add(connector);

// ...

private Bounds getRelativeBounds(Node node, Node relativeTo) {
    Bounds nodeBoundsInScene = node.localToScene(node.getBoundsInLocal());
    return relativeTo.sceneToLocal(nodeBoundsInScene);
}

private Point2D getCenter(Bounds b) {
    return new Point2D(b.getMinX() + b.getWidth() / 2, b.getMinY() + b.getHeight() / 2);
}

这篇关于如何在放置在不同窗格/区域中的两个节点之间绘制线条的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！