JavaFX line

JavaFX Tutorial - JavaFX Line

In order to render graphics on JavaFX scenes, we need basic shapes and colors.

Node class is the basic base class for all JavaFX scene graphics nodes. It provides the ability to transform, translate, and apply effects to any node.

javafx.scene.shape.Shape is a descendant of the Node class.

All older JavaFX 2.x Builder classes are deprecated in JavaFX 8.

JavaFX line

When drawing on a JavaFX scene drawing, the line is rendered using screen coordinate space (system).

The screen coordinate system places (0,0) in the upper left corner.

The x coordinate moves the point along the x axis. When you move points from top to bottom, the y coordinate value increases.

The following image shows the screen coordinate system on the right.

In JavaFX, scene graphics objects, such as lines, circles, and rectangles, are Shape classes of the Shape class.

All shape objects can perform geometric operations between two forming areas, such as subtract, intersect, and constrict.

To draw lines in JavaFX, we'll use javafx.scene.shape.Line class.

To create a Line we need to specify a start (x,y) and end coordinates.

When you create a line node, there are two ways to set the start and end points.

The first method uses constructors with parameters startX, startY, endX, and endY All parameters have a data type double

The following code uses constructors to create lines with a starting point (100,10) and an end point (10,110).

Line line = new Line(100, 10,   10,   110);

The second way to create a row node is to instantiate the Line class with an Line and then set each property using the setter method.

The following code shows how to create line objects and set the start and end points of lines using the setter method.

Line line = new Line(); 
line.setStartX(100); 
line.setStartY(10); 
line.setEndX(10); 
line.setEndY(110);

The line node drawn on the scene map defaults to a stroke width of 1.0 and a black stroke color.

The stroke colors for all shapes are null, which means that there are no colors except the Line, Polyline, and Path nodes.

To create different kinds of lines, we can set properties inherited from the javafx.scene.shape.Shape

The following table shows the properties that we can set on a row.

To retrieve or modify each property, you will use its appropriate getter and setter methods.

Property	Data type / description
fill	javafx.scene.paint.Paint Used to fill colors within a shape.
smooth	Boolean True indicates that anti-aliasing is turned on, and false means that anti-aliasing is turned off.
strokeDashOffset	Double Set the distance to a dashed pattern.
strokeLineCap	javafx.scene.shape.StrokeLineCap Set the cap style online or at the end of the path. There are three styles: StrokeLineCap.BUTT StrokeLineCap.ROUND StrokeLineCap.SQUARE
strokeLineJoin	javafx.scene.shape.StrokeLineJoin Set up decorations when lines meet. There are three types: StrokeLineJoin.MITER StrokeLineJoin.BEVEL StrokeLineJoin.ROUND
strokeMiterLimit	Double Set the limits of the bevel seams and the bevel seams decorate TheStrokeLineJoin.MITER.
stroke	javafx.scene.paint.Paint Sets the color of the stroke of the shape.
strokeType	javafx.scene.shape.StrokeType Set the position where the stroke is drawn around the boundaries of the Shape node. There are three types: StrokeType.CENTERED StrokeType.INSIDE StrokeType.OUTSIDE
strokeWidth	Double Set the width of the line.

Example

The following code creates a Line object and sets the start and end coordinates using the setter method.

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.VBox;
import javafx.scene.shape.Line;
import javafx.stage.Stage;

public class Main extends Application {

    @Override
    public void start(Stage stage) {
        VBox box = new VBox();
        final Scene scene = new Scene(box,300, 250);
        scene.setFill(null);
        
        Line line = new Line();
        line.setStartX(0.0f);
        line.setStartY(0.0f);
        line.setEndX(100.0f);
        line.setEndY(100.0f);
        
        box.getChildren().add(line);
        
        stage.setScene(scene);
        stage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

The code above produces the following results.

Example 2

The following code sets more line properties, including stroke color, stroke width, and line cap.

It then sets the dash style of the line.

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.paint.Color;
import javafx.scene.shape.Line;
import javafx.scene.shape.StrokeLineCap;
import javafx.stage.Stage;

public class Main extends Application {
  @Override
  public void start(Stage primaryStage) {
    primaryStage.setTitle("Drawing Lines");

    Group root = new Group();
    Scene scene = new Scene(root, 300, 150, Color.GRAY);

    Line redLine = new Line(10, 10, 200, 10);

    redLine.setStroke(Color.RED);
    redLine.setStrokeWidth(10);
    redLine.setStrokeLineCap(StrokeLineCap.BUTT);

    redLine.getStrokeDashArray().addAll(15d, 5d, 15d, 15d, 20d);
    redLine.setStrokeDashOffset(10);

    root.getChildren().add(redLine);

    primaryStage.setScene(scene);
    primaryStage.show();
  }
  public static void main(String[] args) {
    launch(args);
  }
}

The code above produces the following results.