java - 如何在 JavaFX 中实现节点的选择

Question

我是 JavaFX 新手，昨天开始学习。花了一整天的时间阅读文档，但什么也没学到……

这是我想要做的，制作一个简单的 JavaFX 应用程序来创建一个圆圈。单击时，其笔划变为橙色(某些颜色)。在未单击(单击该圆圈以外的任何内容)时，笔划变为(某种颜色)白色。

这是我的 伪代码 到目前为止我所拥有的。 我想创建一个单独的类来创建一个圆圈并处理事件 (重要的)。

public class Something extends Application {

    @Override
    public void start(Stage primaryStage) {
        MyCircle c1 = new MyCircle();
        c1.setCircle(20, 0, 0);

        TilePane root = new TilePane();
        root.getChildren().add(c1.getCircle());
        //Some kind of mouse event listener, not sure which one should be
        c1.getCircle().addEventListener(); //pseudo code

        Scene scene = new Scene(root, 400, 400);

        primaryStage.setTitle("Circle");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

}

这个类应该创建一个圆圈并处理所有事件，例如鼠标单击、鼠标位置、单击和拖动等等。

public class MyCircle implements EventHandler{
    Circle circle = new Circle();

    public void setCircle(int radius, int x, int y){
        circle.setRadius(radius);
        position(x,y);
        circle.setStrokeWidth(3);
        circle.setStroke(Color.valueOf("white"));
    }

    public Circle getCircle(){
        return circle;
    }

    public void position(int x, int y){
        circle.setTranslateX(x);
        circle.setTranslateY(y);
    }

    public void selected(){
        circle.setStroke(Color.valueOf("orange"));
    }

    public void unselected() {
        circle.setStroke(Color.valueOf("white"));
    }

    @Override
    public void handle(Event event) {
        if (event == MOUSE_CLICKED){ //pseudo code
            selected();
        }
        else if(event == MOUSE_UNCLICKED){ //pseudo code
            unselected();
        }
    }
}

由于我对 JavaFX 非常陌生，因此我也非常感谢您的解释。谢谢!

编辑:这是我的伪代码，我想将其转换为实际的工作代码。我不知道我会怎么做。任何帮助，将不胜感激。

另一个编辑:除了3个标记的地方，一切都是代码。请看我的评论 Psuedo Code在代码中，我需要帮助将伪代码更改为实际代码。

Answer 1

您可以使用一些内置的 Java 函数来帮助完成您的任务。

例如 CSS PsuedoClasses和 Toggles由 ToggleGroup 管理.

没有必要这样做，您拥有的不使用这些其他 JavaFX 功能的解决方案就可以了。使用一些标准的 JavaFX 函数是一种很好的方式。



轻应用程序

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class LightApp extends Application {

    @Override
    public void start(final Stage stage) throws Exception {
        final Bulb[] bulbs = {
                new Bulb(),
                new Bulb(),
                new Bulb()
        };

        Scene scene = new Scene(new LightArray(bulbs));
        stage.setScene(scene);
        stage.show();
    }

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

}

LightArray.java

import javafx.geometry.Insets;
import javafx.scene.control.ToggleGroup;
import javafx.scene.layout.HBox;

public class LightArray extends HBox {
    public LightArray(Bulb... bulbs) {
        super(10, bulbs);
        setPadding(new Insets(10));

        ToggleGroup toggleGroup = new ToggleGroup();
        for (Bulb bulb: bulbs) {
            bulb.setToggleGroup(toggleGroup);
        }

        setOnMouseClicked(event -> {
            if (event.getTarget() instanceof Bulb) {
                toggleGroup.selectToggle((Bulb) event.getTarget());
            } else {
                toggleGroup.selectToggle(null);
            }
        });

        getStylesheets().add(
                this.getClass().getResource("bulb.css").toExternalForm()
        );
    }
}

灯泡.java

import javafx.beans.property.*;
import javafx.css.PseudoClass;
import javafx.scene.control.*;
import javafx.scene.shape.Circle;

class Bulb extends Circle implements Toggle {
    private ObjectProperty<ToggleGroup> toggleGroup = new SimpleObjectProperty<>();

    Bulb() {
        super(30);
        getStyleClass().add("bulb");
    }

    @Override
    public void setSelected(boolean selected) {
        this.selected.set(selected);
    }

    @Override
    public boolean isSelected() {
        return selected.get();
    }

    @Override
    public BooleanProperty selectedProperty() {
        return selected;
    }

    public BooleanProperty selected =
            new BooleanPropertyBase(false) {
                @Override protected void invalidated() {
                    pseudoClassStateChanged(ON_PSEUDO_CLASS, get());
                }

                @Override public Object getBean() {
                    return Bulb.this;
                }

                @Override public String getName() {
                    return "on";
                }
            };

    private static final PseudoClass
            ON_PSEUDO_CLASS = PseudoClass.getPseudoClass("on");

    @Override
    public ToggleGroup getToggleGroup() {
        return toggleGroup.get();
    }

    @Override
    public void setToggleGroup(ToggleGroup toggleGroup) {
        this.toggleGroup.set(toggleGroup);
    }

    @Override
    public ObjectProperty<ToggleGroup> toggleGroupProperty() {
        return toggleGroup;
    }
}

灯泡.css

.bulb {
    -fx-fill: lightslategray;
}

.bulb:on {
    -fx-fill: gold;
}

另一个经常用 JavaFX 完成的常见事情(我在这里没有做过)是制作可以通过 CSS 设置样式的项目(例如区域或 Pane )，然后将样式应用到它们。例如，它可以扩展 StackPane 而不是 Bulb 扩展 Circle，然后可以通过多层背景和 svg 形状在 css 中自定义灯泡形状(这是其他类似的东西，例如单选按钮的实现方式)。