java - 自定义组件 JavaFX 的自定义操作发射器属性 - 如何？

Question

在开发 JavaFX 应用程序项目的过程中，这是我的第一个真正的困惑，我什至不知道如何正确地说出我正在尝试做的事情，因为我不知道我所使用的技术的名称。我正在尝试利用。

在我的应用程序中，我有多个自定义组件，因此我可以构建更复杂的场景。这个问题涉及到3个控制组件；一个 PrimaryControl 组件 (SplitPane)，其中包含一个 MenuComponent 和一个 ActivityComponent(均为自定义)，该组件根据 MenuComponent 中设置的单选按钮的选择而变化。

当 ToggleGroup(来自该组件)中的单选按钮发生更改时，如何让 MenuControl 类“发出”执行的操作，然后由父组件 PrimaryControl 中的函数处理该按钮，以便它可以更改ActivityComponent 是否可见/Activity ？请耐心等待。

primary_control.fxml

<fx:root type="javafx.scene.layout.VBox" xmlns:fx="http://javafx.com/fxml">
    <MenuControl onToggleGroupButtonSelectionChanged="#onChange"/>
    <ActivityOneControl fx:id="one" isVisible="true"/>
    <ActivityTwoControl fx:id="two" isVisible="false"/>
    ...
</fx:root>

menu_control.fxml

<fx:root type="javafx.scene.layout.VBox" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/10.0.2-internal">

    <GridPane alignment="CENTER" hgap="10" vgap="10">
        <padding><Insets bottom="25" left="25" right="25" top="15" /></padding>
        <Label text="Select A Task" GridPane.columnIndex="0" GridPane.rowIndex="0">
            <font><Font name="System Bold" size="13.0" /></font>
        </Label>

        <fx:define>
            <ToggleGroup fx:id="menuSelection"/>
        </fx:define>

        <RadioButton fx:id="one" text="one" GridPane.columnIndex="0" GridPane.rowIndex="1" toggleGroup="$menuSelection">
        </RadioButton>
        <RadioButton fx:id="two" text="two" GridPane.columnIndex="0" GridPane.rowIndex="2" toggleGroup="$menuSelection">
        </RadioButton>
        <RadioButton fx:id="three" text="three" GridPane.columnIndex="0" GridPane.rowIndex="3" toggleGroup="$menuSelection">

        </RadioButton>
    </GridPane>

</fx:root>

如何在 MenuControl java 类中创建一个监听器，该监听器能够检测 ToggleGroup 选择更改，然后将该更改发送到 onToggleGroupButtonSelectionChanged="#onChange" 以便我可以处理按钮选择来自 PrimaryControl java 类？我记得在 Angular 中做过这种类型的事情，而且非常简单，但由于某种原因，我找不到任何关于如何在 Java 中做到这一点的信息。这就是所谓的依赖注入(inject)吗？

我找到了这个链接并尝试解决我的问题，但没有成功，因为没有任何解释，并且正在监听不同的事件 JavaFX 2.0 - create action handler for custom component in FXML 。

PrimaryController.java(与 MenuControl.java 相同)

public class PrimaryControl extends VBox {

    public DashboardControl() {
        FXMLLoader fxmlLoader = new FXMLLoader(getClass().getResource("primary_control.fxml"));
        fxmlLoader.setRoot(this);
        fxmlLoader.setController(this);

        try {
            fxmlLoader.load();
        } catch (IOException exception) {
            throw new RuntimeException(exception);
        }
    }

    @FXML
    protected void onChange() {
        System.out.println("change activity");
    }
}

提前感谢任何帮助我的人。

Answer 1

• 首先，创建一个表示可能选择的枚举:

public enum SelectionMode {
    ONE, TWO, THREE
}

• 现在，向您的菜单控件添加一个属性，使其他控件能够了解所选择的内容，而无需暴露其背后的逻辑或使其可从其他控件中更改(使用 ReadOnlyObjectProperty ):

private ReadOnlyObjectWrapper<SelectionMode> selectionMode
    = new ReadOnlyObjectWrapper<>(this, "selectionMode");

public final ReadOnlyObjectProperty<SelectionMode> selectionModeProperty() {
    return selectionMode.getReadOnlyProperty();
}

private final SelectionMode getSelectionMode() {
    return selectionMode.get();
}

• 将此属性绑定(bind)到菜单 Controller 类的 initialize 中选定的单选按钮。方法。请注意，我正在使用 setUserData和getUserData方法，否则，您需要为每个单选按钮添加一个 if 子句:

@Override
public void initialize(URL location, ResourceBundle resources) {
    one.setUserData(SelectionMode.ONE);
    two.setUserData(SelectionMode.TWO);
    three.setUserData(SelectionMode.THREE);

    selectionMode.bind(Bindings.createObjectBinding(() -> {
        Toggle selectedToggle = menuSelection.getSelectedToggle();
        return (SelectionMode) selectedToggle.getUserData();
    }, menuSelection.selectedToggleProperty()));
}

• 您的主 Controller 类可以通过在 <MenuControl fx:id="menu"/> 中设置 ID 来访问其菜单 Controller 。 。 然后你可以分配一个 ChangeListener并在每次选择更改时收到通知:

menu.selectionModeProperty().addListener((observable, oldValue, newValue) -> {
    // write your code here
});

注意:您可以像这样初始化 fxml 中的用户数据(而不是在 initialize 方法中执行此操作):

<RadioButton fx:id="one" text="one" toggleGroup="$menuSelection">
    <userData>
        <SelectionMode fx:constant="ONE"/>
    </userData>
</RadioButton>
<RadioButton fx:id="two" text="two" toggleGroup="$menuSelection">
    <userData>
        <SelectionMode fx:constant="TWO"/>
    </userData>
</RadioButton>
<RadioButton fx:id="three" text="three" toggleGroup="$menuSelection">
    <userData>
        <SelectionMode fx:constant="THREE"/>
    </userData>
</RadioButton>