Vfrdtyky

I have a line and I want a square with text inside of the square to be placed in the middle of this line.

I have created the square with text using a stack pane. This line is draggable so I want the square to stay in the middle of this line when it is being dragged.

I tried:

weightSquare.layoutXProperty().bind((line.startXProperty().add(line.endXProperty())).divide(2).add(line.translateXProperty()));

weightSquare.layoutYProperty().bind((line.startYProperty().add(line.endYProperty())).divide(2).add(line.translateXProperty()));

where weightSquare is a StackPane containing a rectangle and text.

Currently, the weightSquare is near the middle of the line but not perfectly in the middle. When the line moves around the weightSquare stays relatively near the middle of the line but sometimes goes off the line slightly.

I want something like this:

Example of what I want

Thank you.

Assuming no transformations have been applied to the line or the StackPane, you can calculate the position of the StackPane based on the line properties like this

stackPane.layoutX = (line.startX + line.endX - stackPane.width) / 2;

(Procede accordingly for y coordinates.)

transformX and transformY could simply be added, but general transforms would require you to

1. Listen to changes of the transforms


2. Use localToParent on the start/end coordinates of the line to get the location in the parent.

I recommend using Bindings.createDoubleBindings for complicate double bindings btw, since this makes the formula for calculating the values much easier to read.

Example

I use a Label, since this provides background/border functionality too.

@Override

public void start(Stage primaryStage) throws IOException {

    Label label = new Label();

    label.setStyle("-fx-background-color: white; -fx-border-color: black;");

    label.setPadding(new Insets(2, 4, 2, 4));



    Line line = new Line(300, 300, 300, 100);



    label.layoutXProperty().bind(Bindings.createDoubleBinding(

            () -> (line.getStartX() + line.getEndX() - label.getWidth()) / 2,

            line.startXProperty(), line.endXProperty(), label.widthProperty()));

    label.layoutYProperty().bind(Bindings.createDoubleBinding(

            () -> (line.getStartY() + line.getEndY() - label.getHeight()) / 2,

            line.startYProperty(), line.endYProperty(), label.heightProperty()));



    DoubleProperty angle = new SimpleDoubleProperty();

    line.endXProperty().bind(Bindings.createDoubleBinding(() -> 300 + 200 * Math.sin(angle.get()), angle));

    line.endYProperty().bind(Bindings.createDoubleBinding(() -> 300 + 200 * Math.cos(angle.get()), angle));



    Timeline timeline = new Timeline(

            new KeyFrame(Duration.ZERO, new KeyValue(angle, 0d, Interpolator.LINEAR)),

            new KeyFrame(Duration.seconds(10), new KeyValue(angle, Math.PI * 2, Interpolator.LINEAR)));

    timeline.setCycleCount(Animation.INDEFINITE);

    label.textProperty().bind(timeline.currentTimeProperty().asString());

    timeline.play();



    Scene scene = new Scene(new Pane(line, label), 600, 600);



    primaryStage.setScene(scene);

    primaryStage.show();

}