Javafx 简明教程

JavaFX - Drawing a Cubic Curve

三次曲线由两个变量的三次多项式函数描述，可以写成以下形式：

A Cubic Curve is described by a third-degree polynomial function of two variables, and can be written in the following form −

这些贝塞尔曲线通常用于计算机图形中。它们是参数曲线，在所有比例下都显得相当平滑。这些曲线是基于 XY 平面上的点绘制的。

These Bezier curves are generally used in computer graphics. They are parametric curves which appear reasonably smooth at all scales. These curves are drawn based on points on the XY plane.

XY 平面上的三次曲线是三次贝塞尔参数曲线。它使用四个点绘制，如 Start Point, End Point, Control Point and Control Point2 所示，如下所示。

A cubic curve is a Bezier parametric curve in the XY plane is a curve of degree 3. It is drawn using four points − Start Point, End Point, Control Point and Control Point2 as shown in the following diagram.

Cubic Curve in JavaFX

在 JavaFX 中，三次曲线使用名为 CubicCurve 的类表示。此类属于 javafx.scene.shape 包。

In JavaFX, a Cubic Curve is represented by a class named CubicCurve. This class belongs to the package javafx.scene.shape.

通过实例化此类，你可以在 JavaFX 中创建一个 CubicCurve 节点。

By instantiating this class, you can create a CubicCurve node in JavaFX.

此类具有 8 个双精度数据类型的属性，即：

This class has 8 properties of the double datatype namely −

startX − The x coordinate of the starting point of the curve.
startY − The y coordinate of the starting point of the curve.
controlX1 − The x coordinate of the first control point of the curve.
controlY1 − The y coordinate of the first control point of the curve.
controlX2 − The x coordinate of the second control point of the curve.
controlY2 − The y coordinate of the second control point of the curve.
endX − The x coordinate of the end point of the curve.
endY − The y coordinate of the end point of the curve.

要绘制三次曲线，需要将值传递给这些属性，方法是在实例化时按相同顺序将它们传递给此类的构造函数，或使用它们各自的 setter 方法。

To draw a cubic curve, you need to pass values to these properties, either by passing them to the constructor of this class, in the same order, at the time of instantiation, or by using their respective setter methods.

Steps to Draw Cubic Curve

要在 JavaFX 中绘制三次贝塞尔曲线，请遵循以下步骤。

To draw a Bezier cubic curve in JavaFX, follow the steps given below.

Step 1: Creating a Cubic Curve

可以通过实例化名为 CubicCurve *which belongs to a package *javafx.scene.shape 的类在 JavaFX 中创建三次曲线。可以在 Application 类的 start() 方法中实例化这个类，如下所示。

You can create a Cubic Curve in JavaFX by instantiating the class named CubicCurve *which belongs to a package *javafx.scene.shape. You can instantiate this class inside the start() method of Application class as follows.

public class ClassName extends Application {
   @Override
   public void start(Stage primaryStage) throws Exception {
      //Creating an object of the class CubicCurve
      CubicCurve cubiccurve = new CubicCurve();
   }
}

Step 2: Setting Properties to the Cubic Curve

使用各自的 setter 方法，指定曲线四个点的 x, y 坐标： start point, end point, control point1 和 control point2 ，如下面的代码块所示。

Specify the x, y coordinates of the four points: start point, end point, control point1 and control point2 of the required curve, using their respective setter methods as shown in the following code block.

//Setting properties to cubic curve
cubicCurve.setStartX(100.0f);
cubicCurve.setStartY(150.0f);
cubicCurve.setControlX1(400.0f);
cubicCurve.setControlY1(40.0f);
cubicCurve.setControlX2(175.0f);
cubicCurve.setControlY2(250.0f);
cubicCurve.setEndX(500.0f);
cubicCurve.setEndY(150.0f);

Step 3: Adding Cubic Curve to Group

通过将先前创建的 CubicCurve 对象作为其构造函数的参数传递，在 start() 方法中实例化一个 Group 类。

Instantiate a Group class in the start() method by passing the previously created CubicCurve object as a parameter to its constructor.

Group root = new Group(cubiccurve);

Step 4: Launching Application

创建二维对象后，请按照下面给出的步骤正确启动应用程序：

Once the 2D object is created, follow the given steps below to launch the application properly −

Firstly, instantiate the class named Scene by passing the Group object as a parameter value to its constructor. To this constructor, you can also pass dimensions of the application screen as optional parameters.
Then, set the title to the stage using the setTitle() method of the Stage class.
Now, a Scene object is added to the stage using the setScene() method of the class named Stage.
Display the contents of the scene using the method named show().
Lastly, the application is launched with the help of the launch() method.

Example

以下是使用 JavaFX 生成贝塞尔三次曲线的程序。将此代码保存在名为 CubicCurveExample.java 的文件中。

Following is a program which generates a Bezier CubicCurve using JavaFX. Save this code in a file with the name CubicCurveExample.java.

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.scene.shape.CubicCurve;

public class CubicCurveExample extends Application {
   @Override
   public void start(Stage stage) {
      //Drawing a cubic curve
      CubicCurve cubicCurve = new CubicCurve();

      //Setting properties to cubic curve
      cubicCurve.setStartX(100.0f);
      cubicCurve.setStartY(150.0f);
      cubicCurve.setControlX1(400.0f);
      cubicCurve.setControlY1(40.0f);
      cubicCurve.setControlX2(175.0f);
      cubicCurve.setControlY2(250.0f);
      cubicCurve.setEndX(500.0f);
      cubicCurve.setEndY(150.0f);

      //Creating a Group object
      Group root = new Group(cubicCurve);

      //Creating a scene object
      Scene scene = new Scene(root, 600, 300);

      //Setting title to the Stage
      stage.setTitle("Drawing a cubic curve");

      //Adding scene to the stage
      stage.setScene(scene);

      //Displaying the contents of the stage
      stage.show();
   }
   public static void main(String args[]){
      launch(args);
   }
}

使用以下命令，从命令提示符编译并执行已保存的 java 文件。

Compile and execute the saved java file from the command prompt using the following commands.

javac --module-path %PATH_TO_FX% --add-modules javafx.controls CubicCurveExample.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls CubicCurveExample

在执行时，上述程序生成一个 JavaFX 窗口，显示一个贝塞尔三次曲线，如下所示。

On executing, the above program generates a JavaFX window displaying a Bezier cubic curve as shown below.

Example

在以下示例中，我们尝试对绘制的三次曲线应用阴影效果。将此代码保存在名为 CubicCurveEffect.java 的文件中。

In the following example, we are trying to apply the DropShadow effect on a Cubic Curve drawn. Save this code in a file with the name CubicCurveEffect.java.

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.effect.DropShadow;
import javafx.stage.Stage;
import javafx.scene.paint.Color;
import javafx.scene.shape.CubicCurve;

public class CubicCurveEffect extends Application {
   @Override
   public void start(Stage stage) {
      //Drawing a cubic curve
      CubicCurve cubicCurve = new CubicCurve();

      //Setting properties to cubic curve
      cubicCurve.setStartX(50.0f);
      cubicCurve.setStartY(100.0f);
      cubicCurve.setControlX1(200.0f);
      cubicCurve.setControlY1(40.0f);
      cubicCurve.setControlX2(150.0f);
      cubicCurve.setControlY2(200.0f);
      cubicCurve.setEndX(200.0f);
      cubicCurve.setEndY(50.0f);

	  cubicCurve.setFill(Color.RED);

      //Instantiating the DropShadow class
      DropShadow ds = new DropShadow();

      //Applying DropShadow effect to cubicCurve
      cubicCurve.setEffect(ds);

      //Creating a Group object
      Group root = new Group(cubicCurve);

      //Creating a scene object
      Scene scene = new Scene(root, 300, 300);

      //Setting title to the Stage
      stage.setTitle("Drawing a cubic curve");

      //Adding scene to the stage
      stage.setScene(scene);

      //Displaying the contents of the stage
      stage.show();
   }
   public static void main(String args[]){
      launch(args);
   }
}

使用以下命令，从命令提示符编译并执行已保存的 java 文件。

Compile and execute the saved java file from the command prompt using the following commands.

javac --module-path %PATH_TO_FX% --add-modules javafx.controls CubicCurveEffect.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls CubicCurveEffect

在执行时，上述程序生成一个 JavaFX 窗口，显示一个贝塞尔三次曲线，如下所示。

On executing, the above program generates a JavaFX window displaying a Bezier cubic curve as shown below.