Javafx 简明教程

JavaFX - Colors

在 JavaFX 应用程序中绘制 2D 形状时，您可能已经注意到，它默认为黑色。但黑色并不总是适用于用户创建的所有类型的应用程序。因此，JavaFX 允许您将此默认颜色更改为用户认为最适合其应用程序的任何颜色。

When you draw a 2D shape in a JavaFX application, you might have observed that, by default, it is colored black. But, the color black is not always suitable for all types of applications a user creates. Hence, JavaFX allows you to change this default color into whichever color the user deems perfect for their application.

要向应用程序应用颜色，JavaFX 提供了 javafx.scene.paint 包中的各种类。该包包含一个名为 Paint 的抽象类，它是用于应用颜色的所有类的基类。

To apply colors to an application, JavaFX provides various classes in the package javafx.scene.paint package. This package contains an abstract class named Paint and it is the base class of all the classes that are used to apply colors.

使用这些类，您可以按照以下模式应用颜色 −

Using these classes, you can apply colors in the following patterns −

  1. Uniform − In this pattern, color is applied uniformly throughout node.

  2. Image Pattern − This lets you to fill the region of the node with an image pattern.

  3. Gradient − In this pattern, the color applied to the node varies from one point to the other. It has two kinds of gradients namely Linear Gradient and Radial Gradient.

您可以向其应用颜色的所有那些节点类，例如 Shape, Text （包括场景），都具有名为 setFill() 和 setStroke() 的方法。这些将分别有助于设置节点的颜色值及其笔触。

All those node classes to which you can apply color such as Shape, Text (including Scene), have methods named setFill() and setStroke(). These will help to set the color values of the nodes and their strokes respectively.

这些方法接受 Paint 类型的对象。因此，要创建这些类型的图像之一，您需要实例化这些类并将对象作为参数传递给这些方法。

These methods accept an object of type Paint. Therefore, to create either of these type of images, you need to instantiate these classes and pass the object as a parameter to these methods.

Applying Color to the Nodes

要向节点设置统一的颜色模式，您需要将 color 类的静态变量传递给 setFill() 、 setStroke() 方法，如下所示 −

To set uniform color pattern to the nodes, you need to pass an object of the class color to the setFill(), setStroke() methods as follows −

//Setting color to the text
Color color = new Color.BEIGE
text.setFill(color);

//Setting color to the stroke
Color color = new Color.DARKSLATEBLUE
circle.setStroke(color);

在上述代码块中，我们使用 color 类 的静态变量来创建一个颜色对象。

In the above code block, we are using the static variables of the color class to create a color object.

同样，您还可以使用 RGB 值或 HSB 标准的着色或颜色网页哈希代码，如下所示 −

In the same way, you can also use the RGB values or HSB standard of coloring or web hash codes of colors as shown below −

//creating color object by passing RGB values
Color c = Color.rgb(0,0,255);

//creating color object by passing HSB values
Color c = Color.hsb(270,1.0,1.0);

//creating color object by passing the hash code for web
Color c = Color.web("0x0000FF",1.0);

Example

下面是一个示例，演示如何将颜色应用于 JavaFX 中的节点。这里，我们正在创建圆形和文本节点，并向其应用颜色。

Following is an example which demonstrates, how to apply color to the nodes in JavaFX. Here, we are creating a circle and text nodes and applying colors to them.

将此代码保存在名为 ColorExample.java 的文件中。

Save this code in a file with the name ColorExample.java.

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
import javafx.scene.shape.Circle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;

public class ColorExample extends Application {
   @Override
   public void start(Stage stage) {
      //Drawing a Circle
      Circle circle = new Circle();

      //Setting the properties of the circle
      circle.setCenterX(300.0f);
      circle.setCenterY(180.0f);
      circle.setRadius(90.0f);

      //Setting color to the circle
      circle.setFill(Color.DARKRED);

      //Setting the stroke width
      circle.setStrokeWidth(3);

      //Setting color to the stroke
      circle.setStroke(Color.DARKSLATEBLUE);

      //Drawing a text
      Text text = new Text("This is a colored circle");

      //Setting the font of the text
      text.setFont(Font.font("Edwardian Script ITC", 50));

      //Setting the position of the text
      text.setX(155);
      text.setY(50);

      //Setting color to the text
      text.setFill(Color.BEIGE);
      text.setStrokeWidth(2);
      text.setStroke(Color.DARKSLATEBLUE);

      //Creating a Group object
      Group root = new Group(circle, text);

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

      //Setting title to the Stage
      stage.setTitle("Color Example");

      //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 ColorExample.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls ColorExample

执行后，以上程序将生成一个 JavaFX 窗口，如下所示 −

On executing, the above program generates a JavaFX window as follows −

color example

Applying Image Pattern to the Nodes

要对节点应用图像模式，请实例化 ImagePattern 类，并将它的对象传递给 setFill() 、 setStroke() 方法。

To apply an image pattern to the nodes, instantiate the ImagePattern class and pass its object to the setFill(), setStroke() methods.

该类的构造函数接受六个参数，即 −

The constructor of this class accepts six parameters namely −

  1. Image − The object of the image using which you want to create the pattern.

  2. x and y − Double variables representing the (x, y) coordinates of origin of the anchor rectangle.

  3. height and width − Double variables representing the height and width of the image that is used to create a pattern.

  4. isProportional − This is a Boolean Variable; on setting this property to true, the start and end locations are set to be proportional.

ImagePattern radialGradient = new ImagePattern(dots, 20, 20, 40, 40, false);

Example

下面是一个示例，演示如何将图像模式应用于 JavaFX 中的节点。这里，我们正在创建圆形和文本节点，并向其应用图像模式。

Following is an example which demonstrates how to apply image pattern to the nodes in JavaFX. Here, we are creating a circle and a text node and applying an image pattern to them.

将此代码保存在名为 ImagePatternExample.java 的文件中。

Save this code in a file with name ImagePatternExample.java.

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.image.Image;

import javafx.scene.paint.Color;
import javafx.scene.paint.ImagePattern;
import javafx.scene.paint.Stop;

import javafx.stage.Stage;
import javafx.scene.shape.Circle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;

public class ImagePatternExample extends Application {
   @Override
   public void start(Stage stage) {
      //Drawing a Circle
      Circle circle = new Circle();

      //Setting the properties of the circle
      circle.setCenterX(300.0f);
      circle.setCenterY(180.0f);
      circle.setRadius(90.0f);

      //Drawing a text
      Text text = new Text("This is a colored circle");

      //Setting the font of the text
      text.setFont(Font.font("Edwardian Script ITC", 50));

      //Setting the position of the text
      text.setX(155);
      text.setY(50);

      //Setting the image pattern
      String link = "https://encrypted-tbn1.gstatic.com"
         + "/images?q=tbn:ANd9GcRQub4GvEezKMsiIf67U"
         + "rOxSzQuQ9zl5ysnjRn87VOC8tAdgmAJjcwZ2qM";

      Image image = new Image(link);
      ImagePattern radialGradient = new ImagePattern(image, 20, 20, 40, 40, false);

      //Setting the linear gradient to the circle and text
      circle.setFill(radialGradient);
      text.setFill(radialGradient);

      //Creating a Group object
      Group root = new Group(circle, text);

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

      //Setting title to the Stage
      stage.setTitle("Image pattern Example");

      //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 ImagePatternExample.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls ImagePatternExample

执行后，以上程序将生成一个 JavaFX 窗口，如下所示 −

On executing, the above program generates a JavaFX window as follows −

image pattern example