扩展JavaFX场景图：创建非标准节点的自定义技术

# 1. JavaFX场景图概述

JavaFX是Java平台的一部分，用于构建富客户端应用程序。它提供了一套丰富的API，用于创建丰富的用户界面和媒体应用。在JavaFX中，场景图是构建用户界面的基础。场景图由各种节点组成，每个节点都代表了屏幕上的一部分元素，如文本、图像或动画。

场景图的概念是将应用程序的UI抽象为一棵树，每个节点都是树上的一个元素。这种树状结构使得节点间的关系和层次管理变得直观，为复杂界面的构建和管理提供了清晰的模型。在此基础上，JavaFX通过使用场景图，提供了高效的渲染机制，可以快速地在屏幕上绘制和更新UI元素。

在本章中，我们将探讨场景图的基本组件，以及它如何适应应用程序的架构。此外，还将介绍如何开始构建场景图，以及基本的场景和舞台的概念，为深入学习JavaFX和创建复杂用户界面打下坚实的基础。

# 2. JavaFX节点和布局基础

## 2.1 节点的基本概念和分类

### 2.1.1 节点的类型和属性

在JavaFX中，节点（Node）是场景图（Scene Graph）的基本构造块。场景图可以被看作是一个树状结构，其中每个节点代表了用户界面中的一个元素。JavaFX中的节点主要分为两大类：形状节点（Shape Nodes）和非形状节点（Non-Shape Nodes）。形状节点主要用于图形渲染，如`Rectangle`、`Circle`等，而非形状节点用于布局管理、文本显示和图像展示等，比如`Pane`、`Button`等。

节点不仅包含用于定义外观的属性，如颜色、字体和尺寸等，还包括控制行为的属性，比如事件监听和变换。通过设置这些属性，开发者可以控制节点在用户界面上的呈现和交互方式。例如，可以为一个按钮设置一个`EventHandler`来处理用户的点击事件。

#### 示例代码块展示如何创建和配置一个简单的JavaFX节点：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.stage.Stage;

public class BasicNodeExample extends Application {

    @Override
    public void start(Stage primaryStage) {
        // 创建一个Circle节点
        Circle circle = new Circle(50);
        circle.setFill(Color.BLUE);

        // 将Circle节点添加到StackPane布局容器中
        StackPane root = new StackPane();
        root.getChildren().add(circle);

        // 创建场景并设置舞台
        Scene scene = new Scene(root, 200, 200);
        primaryStage.setTitle("Node Example");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

在上述代码中，我们创建了一个`Circle`节点，并将其填充为蓝色。然后，这个圆形节点被添加到了`StackPane`布局容器中，这样它就可以在JavaFX应用中显示出来。

### 2.1.2 常用布局容器介绍

在JavaFX中，布局容器（Layout Containers）用于组织和管理子节点的布局。JavaFX提供了多种内置的布局管理器，如`GridPane`、`HBox`、`VBox`和`StackPane`等，每种布局管理器都有其特定的使用场景和布局策略。

- `GridPane`允许开发者通过行和列来放置节点，适合创建复杂的表格布局。
- `HBox`和`VBox`分别用于水平和垂直排列子节点。
- `StackPane`则是将子节点层叠在一起，最后一个添加的节点会显示在最前面。

使用布局容器可以简化节点的组织和管理过程，它通常通过编程接口定义布局约束，而不是硬编码坐标和尺寸。

#### 下面的代码展示了如何使用`HBox`来水平排列三个按钮：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;

public class HBoxExample extends Application {

    @Override
    public void start(Stage primaryStage) {
        // 创建三个按钮
        Button button1 = new Button("Button 1");
        Button button2 = new Button("Button 2");
        Button button3 = new Button("Button 3");

        // 创建HBox并添加按钮
        HBox hbox = new HBox(10); // 10像素的间距
        hbox.getChildren().addAll(button1, button2, button3);

        // 创建场景并设置舞台
        Scene scene = new Scene(hbox, 300, 50);
        primaryStage.setTitle("HBox Example");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

在这段示例代码中，三个按钮被添加到`HBox`布局容器中，并设置了10像素的水平间距。在场景图中，`HBox`会确保所有子节点水平排列。这是一种典型的应用场景，用于快速而简洁地实现界面布局。

## 2.2 控件的使用和自定义

### 2.2.1 标准控件的属性定制

JavaFX提供了丰富的标准控件（Standard Controls），这些控件包括按钮、文本框、列表、滑动条等，它们在JavaFX中都是`Node`的子类。通过定制这些控件的属性，开发者能够创建符合应用风格和功能需求的用户界面。

控件的属性定制主要涉及以下几个方面：
- 外观（如颜色、字体、图标等）
- 行为（如事件处理）
- 状态（如禁用、选中状态）

使用`setId`、`setStyle`或`setEffect`等方法可以改变控件的外观，为控件添加事件监听器则可以响应用户交互。同时，有些控件还可以通过`selectedProperty`、`disabledProperty`等属性来控制状态。

#### 下面的代码展示了如何为一个按钮定制文本、字体以及点击事件：

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.VBox;
import javafx.scene.text.Font;
import javafx.stage.Stage;

public class ButtonCustomizationExample extends Application {

    @Override
    public void start(Stage primaryStage) {
        // 创建一个按钮
        Button button = new Button("Click Me");
        // 设置按钮的字体和边距
        button.setFont(Font.font("Arial", 18));
        button.setPadding(new Insets(10));
        // 添加点击事件的处理
        button.setOnAction(event -> System.out.println("Button clicked!"));
        // 创建VBox布局并添加按钮
        VBox root = new VBox(10);
        root.getChildren().add(button);
        root.setPadding(new Insets(20));

        // 创建场景并设置舞台
        Scene scene = new Scene(root, 200, 200);
        primaryStage.setTitle("Button Customization Example");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

在这段代码中，我们创建了一个按钮并对其外观和行为进行了定制：设置了按钮的字体和边距，并为按钮添加了一个事件处理器，当按钮被点击时会在控制台输出一条消息。这样的定制使得按钮在用户界面中更具有吸引力且更具功能性。

### 2.2.2 自定义控件的继承与实现

JavaFX提供了强大的机制来创建自定义控件。开发者可以通过继承现有的控件类并重写其方法来创建自定义控件，或者实现`Control`接口来从头开始创建一个全新的控件类型。

自定义控件的一个常见场景是继承一个标准控件并对其进行扩展，增加自定义的行为或外观。例如，开发者可以创建一个带有自定义样式的按钮，它不仅有标准按钮的所有功能，还可以具有独特的视觉样式或附加的事件监听逻辑。

#### 下面的代码展示了一个简单的自定义控件实现的例子：

import javafx.scene.control.ContentDisplay;
import javafx.scene.control.Label;
import javafx.scene.layout.StackPane;

public class CustomLabel extends StackPane {

    private Label label;

    public CustomLabel(String text) {
        label = new Label(text);
        label.setContentDisplay(ContentDisplay.CENTER);
        getChildren().add(label);
    }

    public void setCustomStyle(String style) {
        label.setStyle(style);
    }
    // 添加方法来改变标签中的文本来更新自定义控件的外观
    public void setText(String text) {
        label.setText(text);
    }
}

在这个`CustomLabel`类中，我们继承了`StackPane`并添加了一个`Label`。这个自定义控件可以接受文本并允许调用者设置自定义样式。该控件非常适合在需要文本标签且需要自定义显示方式的场