在scalafx中的不同容器中的动态布局节点之间绘制箭头

Question

我正在尝试使用ScalaFX绘制树形图 - 它们之间带有箭头的节点。

为了简化布局，我使用标准的ScalaFX布局容器（例如HBoxes和VBoxes）嵌套每个分支。

我无法弄清楚绘制线条的好方法，特别是将行开始和结束属性绑定到它们连接的节点的属性。如果他们在同一个容器中，那将很容易，我可以做一些像

这样的事情

startX <== start.centerX

但是，如果它们位于不同的容器中，则不起作用 - 我需要找到与场景相关的组件。

最小的附加示例 - 实际上，我正在寻找能够用箭头替换绑定的东西。我想 - 如果可能的话 - 保持干净利落的ScalaFX听众风格。

编辑：当前的行为是从顶部节点向左绘制一条水平线 - 坐标没有被翻译以匹配它们所在容器的场景坐标，我无法弄清楚如何做到这一点。

package com.moseph.artifacts.visualisation

import scalafx.Includes._
import scalafx.scene.layout._
import scalafx.application.JFXApp
import scalafx.scene.Scene
import scalafx.scene.shape.Circle
import scalafx.scene.shape.Line
import javafx.geometry.Insets

object TestVisualiser extends JFXApp { self =>
  val nodes = new Nodes
  stage = new JFXApp.PrimaryStage {
    title = "Test Visualiser"; width = 500; height = 1000
    scene = new Scene {
      root = new StackPane {
      content = Seq( nodes , new Pane {
       content = Seq( new Arrow( nodes.a.circ, nodes.b.circ ), new Arrow( nodes.a.circ, nodes.b.circ )) 
      } ) 
      }
    }
  }
}

class Nodes extends VBox { nodes =>
  minWidth = 100
  val a = new TNode
  val b = new TNode
  val c = new TNode
  val d = new TNode
  content = Seq( a, new HBox{ content = Seq( b, c, d) } )
}

class TNode extends Pane { node =>
  val circ = new Circle { radius = 10; centerX <== node.width/2; centerY = 5}
  content = circ
  padding = new Insets(50)
}

class Arrow(from:Circle,to:Circle) extends Line {
  startX <== from.centerX + from.translateY + from.layoutY
  startY <== from.centerY + from.translateY + from.layoutY
  endX <== to.centerX + to.translateX + to.layoutX
  endY <== to.centerY + to.translateY + to.layoutY
}