ScalaFX plotting multiple shapes

Question

I have the following code:

import scalafx.application.JFXApp
import scalafx.scene.Scene
import scalafx.scene.layout.HBox
import scalafx.scene.paint.Color._
import scalafx.scene.shape.Rectangle

object Main extends JFXApp {
  stage = new JFXApp.PrimaryStage {
    title.value = "Hello Stage"
    width = 100
    height = 100
    scene = new Scene {
      fill = White
      content = new HBox {
        children = Seq(
          new Rectangle {
            x = 10
            y = 10
            width = 10
            height = 10
            fill = Green
          },
          new Rectangle {
            x = 20
            y = 20
            width = 10
            height = 10
            fill = Red
          }
        )
      }
    }
  }
}

I would expect this to give me two squares in a diagonal line next to each other with a gap in from the edge, but instead they come out nestled up against the edge and right next to each other.

I have done quite some googling and read much of the scalaFX documentation, and have not been able to understand what I am doing wrong. I expect that I have been looking in the wrong place!
I don't know javaFX (nor Java either) so looking at JavaFX documentation will be even harder for me to figure out :(

Answer 1

Since you're adding your Rectangles to the HBox x,y coordinates are not taken into account since HBox lays out its children in a single horizontal row.

Check out the documentation at https://docs.oracle.com/javase/8/javafx/api/javafx/scene/layout/HBox.html

Try a Pane instead (for which child layout is unmanaged and instead specified by the developer) https://docs.oracle.com/javase/8/javafx/api/javafx/scene/layout/Pane.html