Is there any way to make polyline's corners rounded in javafx. I tried stroke line join but it did not work. I want to make corners like the thin line in the image below.
Line join don't help here, since they control the behavior for 2 path elements that don't have the same direction at the point where the lines join. They don't modify the path elements themselves. You need to use Path
instead.
ArcTo
and QuadCurveTo
provide you with options for creating round corners. Both look pretty similar. The following code let's you play around with distance from the corner where the curve starts a bit:
private Path arcPath(DoubleProperty distanceProperty) {
MoveTo moveTo = new MoveTo(300, 300);
// end the line at the given distance right of the intersection of the lines
HLineTo lineTo1 = new HLineTo();
lineTo1.xProperty().bind(distanceProperty.add(50));
ArcTo arcTo = new ArcTo();
// end the curve at the given distance above the intersection of the lines
arcTo.setX(50);
arcTo.yProperty().bind(distanceProperty.negate().add(300));
// radius is equal to the distance
arcTo.radiusXProperty().bind(distanceProperty);
arcTo.radiusYProperty().bind(distanceProperty);
arcTo.setSweepFlag(true);
VLineTo lineTo2 = new VLineTo(50);
return new Path(moveTo, lineTo1, arcTo, lineTo2);
}
private Path quadPath(DoubleProperty distanceProperty) {
MoveTo moveTo = new MoveTo(300, 300);
// end the line at the given distance right of the intersection of the lines
HLineTo lineTo1 = new HLineTo();
lineTo1.xProperty().bind(distanceProperty.add(50));
QuadCurveTo curveTo = new QuadCurveTo();
// control point at the location where the lines would intersect
curveTo.setControlX(50);
curveTo.setControlY(300);
// end the curve at the given distance above the intersection of the lines
curveTo.setX(50);
curveTo.yProperty().bind(distanceProperty.negate().add(300));
VLineTo lineTo2 = new VLineTo(50);
return new Path(moveTo, lineTo1, curveTo, lineTo2);
}
Slider distanceSlider = new Slider(0, 250, 10);
Label label = new Label();
label.textProperty().bind(distanceSlider.valueProperty().asString("%.2f"));
HBox controls = new HBox(distanceSlider, label);
Path path1 = quadPath(distanceSlider.valueProperty());
Path path2 = arcPath(distanceSlider.valueProperty());
VBox root = new VBox(new HBox(new Pane(path1), new Pane(path2)), controls);