在JavaFX对话框中如何退出数字文本字段

Question

我有一个自定义对话框，其中包含几个UI元素。一些文本字段用于数字输入（参见此处）。当焦点位于任何数字文本字段上时，按下退出键时，该对话框不会关闭。当焦点在没有此自定义文本格式化程序的其他文本字段上时，对话框可以正常关闭。

以下是简化后的代码：

package application;

import java.text.DecimalFormat;
import java.text.ParsePosition;

import javafx.application.Application;
import javafx.application.Platform;
import javafx.scene.control.ButtonType;
import javafx.scene.control.Dialog;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.scene.control.TextFormatter;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class Main extends Application {
    @Override
    public void start(Stage primaryStage) {
        try {
            TextField name = new TextField();
            HBox hb1 = new HBox();
            hb1.getChildren().addAll(new Label("Name: "), name);

            TextField id = new TextField();
            id.setTextFormatter(getNumberFormatter()); // numbers only
            HBox hb2 = new HBox();
            hb2.getChildren().addAll(new Label("ID: "), id);

            VBox vbox = new VBox();
            vbox.getChildren().addAll(hb1, hb2);

            Dialog<ButtonType> dialog = new Dialog<>();
            dialog.setTitle("Number Escape");
            dialog.getDialogPane().getButtonTypes().addAll(ButtonType.OK, ButtonType.CANCEL);
            dialog.getDialogPane().setContent(vbox);

            Platform.runLater(() -> name.requestFocus());

            if (dialog.showAndWait().get() == ButtonType.OK) {
                System.out.println("OK: " + name.getText() + id.getText());
            } else {
                System.out.println("Cancel");
            }
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

    TextFormatter<Number> getNumberFormatter() {
        // from https://dev59.com/610Z5IYBdhLWcg3wzC9W#31043122
        DecimalFormat format = new DecimalFormat("#");
        TextFormatter<Number> tf = new TextFormatter<>(c -> {
            if (c.getControlNewText().isEmpty()) {
                return c;
            }
            ParsePosition parsePosition = new ParsePosition(0);
            Object object = format.parse(c.getControlNewText(), parsePosition);
            if (object == null || parsePosition.getIndex() < c.getControlNewText().length()) {
                return null;
            } else {
                return c;
            }
        });

        return tf;
    }

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

当焦点在id上时，我如何在按下Esc键时关闭对话框？

- rubpa

Answer 1

问题

在提供解决方案之前，我认为了解为什么拥有似乎会改变

的行为是很重要或者至少很有趣的。如果这对您不重要，请随意跳到答案的结尾。

取消按钮

根据的文档，取消按钮是：

如果场景中没有其他节点使用，则接收键盘VK_ESC按键的按钮。

那句话的结尾是重要的部分。取消按钮和默认按钮的实现方式是通过向注册加速器来实现的，该

属于这个。只有在适当的冒泡到时，才会调用这些加速器。如果事件在到达之前被消耗，将不会调用加速器。

注意：要更好地了解JavaFX中的事件处理，特别是“冒泡”和“消耗”等术语，建议阅读此教程。

对话框

一个对话框有关于如何以及何时关闭的特定规则。这些规则在“对话框关闭规则”部分中记录在此。简单地说，一切都取决于哪些ButtonType已经添加到DialogPane中。在您的示例中，您使用了预定义类型之一：ButtonType.CANCEL。如果您查看该字段的文档，您会看到：

一个预定义的ButtonType，显示“取消”，并且具有ButtonBar.ButtonData为ButtonBar.ButtonData.CANCEL_CLOSE。

如果您查看ButtonData.CANCEL_CLOSE的文档，您会看到：

用于“取消”或“关闭”按钮的标记。

是取消按钮: 真

至少对于默认实现而言，这意味着为ButtonType.CANCEL创建的Button将是一个取消按钮。换句话说，Button将其cancelButton属性设置为true。这就允许通过按下Esc键来关闭一个Dialog。

注意：负责创建适当按钮的是DialogPane#createButton(ButtonType)方法（可以重写以进行自定义）。尽管该方法的返回类型为Node，但通常情况下应该返回Button的一个实例。

文本格式化器

JavaFX中的每个控件都有三个组件：控件类、皮肤类和行为类。后者负责处理用户输入，例如鼠标和键事件。在本例中，我们关心TextInputControlBehavior和TextFieldBehavior；前者是后者的父类。

注意：与皮肤类不同，它们在JavaFX 9中成为公共API，行为类仍然是私有API，在JavaFX 12.0.2中仍然是如此。下面所描述的大部分内容都是实现细节。

{{TextInputControlBehavior}}类注册了一个{{EventHandler}}，它会对按下Esc键作出反应，并调用同一类的{{cancelEdit(KeyEvent)}}方法。该方法的所有基本实现只是将{{KeyEvent}}转发给{{TextInputControl}}的父级（如果有）——导致某些未知原因（对我来说）的事件分派循环两次。然而，{{TextFieldBehavior}}类覆盖了这个方法：

@Override
protected void cancelEdit(KeyEvent event) {
    TextField textField = getNode();
    if (textField.getTextFormatter() != null) {
        textField.cancelEdit();
        event.consume();
    } else {
        super.cancelEdit(event);
    }
}

正如你所看到的，存在TextFormatter会导致KeyEvent被无条件消耗。这样可以阻止事件到达Scene，取消按钮不会触发，因此当在TextField具有焦点时按下Esc键时，Dialog不会关闭。当没有TextFormatter时，将调用超级实现，如前所述，只是将事件转发给父级。

这种行为的原因可以从调用TextInputControl#cancelEdit()方法中得到线索。该方法有一个“姐妹方法”，即TextInputControl#commitValue()。如果查看这两个方法的文档，您会看到：

如果当前正在编辑字段，则此调用将文本设置为最后提交的值。

和：

提交当前文本并将其转换为值。

分别。不幸的是，这并不能解释太多，但是如果您查看它们的实现，它们的目的就变得清晰了。 TextFormatter具有value属性，该属性在键入TextField时不会实时更新。相反，只有在提交时（例如通过按Enter）才会更新该值。反之亦然；可以通过取消编辑（例如按Esc）将当前文本恢复为当前值。

注意：在TextFormatter中，将String与任意类型的对象之间的转换由与其关联的StringConverter处理。

当存在TextFormatter时，取消编辑的行为被视为一种事件消耗场景。我想这是有道理的。然而，即使没有任何内容可取消，事件仍然会被消耗 - 对我来说这不太合理。

---

一个解决方案

解决这个问题的一种方法是使用反射来深入了解内部情况，就像kleopatra's answer中所示的那样。另一种选择是向TextField或其祖先添加事件过滤器，当按下Esc键时关闭Dialog。

textField.addEventFilter(KeyEvent.KEY_PRESSED, event -> {
    if (event.getCode() == KeyCode.ESCAPE) {
        event.consume();
        dialog.close();
    }
});

如果您想包含取消编辑行为（取消而不关闭），那么只有在没有要取消的编辑时才应关闭对话框。查看kleopatra的答案，了解如何确定是否需要取消。如果有要取消的内容，只需不消耗事件并不关闭对话框即可。如果没有要取消的内容，则与上面的代码相同（即消耗并关闭）。

使用事件过滤器是“推荐的方式”吗？这肯定是一种有效的方式。JavaFX像大多数主流UI工具包一样是event-driven的。对于JavaFX来说，这意味着对Event作出反应或观察Observable[Value]进行无效/更改。在构建在JavaFX之上的框架可能会添加自己的机制。由于问题是在我们不希望消耗它的情况下消耗事件，因此添加自己的处理程序以实现所需的行为是有效的。

- Slaw

---

这适用于 id。而且也适用于父级/祖先，这让我感到惊讶。但是为什么在添加文本格式化程序时默认处理程序不起作用？同时也想知道这是否是JavaFX中推荐的方式... - rubpa

@rubpa 我编辑了我的答案以回应你的评论。 - Slaw

哇！感谢您添加的所有细节，确实澄清了几个问题。 - rubpa

真的很好的答案，之前不知道那个特别的调整 :) 另一种方法 - 对于那些有勇气涉足泥泞水域的人 - 是替换由行为安装的字段inputMap中的键绑定。肮脏的事情有两个方面：a）需要反射访问皮肤中的私有行为字段b）更改inputMap，它是一个内部类（不幸的是，在皮肤移出公共范围时没有进入公共范围）。 - kleopatra

@kleopatra 啊，我想我从来没有意识到TextFormatter的全部用途。我会在几个小时内更新我的答案，以解决整个取消编辑的问题（现在我的答案完全绕过了这个问题）。 - Slaw

Answer 2

这个问题已经有了优秀的答案，没有需要补充的。我只是想演示如何调整行为的InputMap来注入/替换我们自己的映射（作为我的评论后续）。请注意：它在反射地访问皮肤的行为（私有最终字段）和使用内部API时有些粗糙（行为/InputMap尚未成为公共API）。

正如Slaw所指出的那样，如果TextField安装了TextFormatter，则是行为阻止ESCAPE冒泡到取消按钮。在我看来，在这种情况下它并没有表现不良，只是过度反应：仅当没有其他人使用它来更改任何输入节点的状态时，才应该触发取消/默认按钮的ESCAPE/ENTER（我的自由解释“consumed”-对我不能找到的一般UX准则进行了一些研究，尴尬……）

应用于同时包含TextField（带TextFormatter）和取消按钮（即：isCancelButton为true）的表单：

• 如果TextField有未提交的文本，则取消应将编辑恢复为最近提交的值并消耗事件
• 如果TextField已提交，则应让其冒泡以触发取消按钮

在行为（behavior）中，cancelEdit的实现不区分这两种状态，而总是会消耗掉它。下面的示例实现了预期的（至少是我预期的）行为。

• 一个辅助方法来决定是否脏（即：textField有未提交的编辑）
• 一个事件处理方法来检查是否脏，调用cancel并仅在其已变脏时消耗事件
• 一个配置方法，调整textFields inputMap，以便将映射替换为我们自己的映射。

请注意，这只是一个概念验证（PoC）：不属于助手程序，而属于自定义皮肤（至少应由行为完成，最好由行为完成）。而且，它缺少类似的ENTER支持...这稍微复杂一些，因为它必须考虑actionHandlers（行为试图但未能实现的内容，参见链接）

要测试该示例：

• 编译（注意：需要反射访问私有字段，使用您手头上的任何东西 - 我们都这样做，不是吗）并运行
• 在字段中输入内容
• 按下Esc键：字段的文本将恢复到初始值
• 再次按下Esc键：将触发取消按钮

示例代码：

public class TextFieldCancelSO extends Application {

    /**
     * Returns a boolean to indicate whether the given field has uncommitted
     * changes.
     * 
     * @param <T> the type of the formatter's value
     * @param field the field to analyse
     * @return true if the field has a textFormatter with converter and
     *    uncommitted changes, false otherwise
     */
    public static <T> boolean isDirty(TextField field) {
        TextFormatter<T> textFormatter = (TextFormatter<T>) field.getTextFormatter();
        if (textFormatter == null || textFormatter.getValueConverter() == null) return false;
        String fieldText = field.getText();
        StringConverter<T> valueConverter = textFormatter.getValueConverter();
        String formatterText = valueConverter.toString(textFormatter.getValue());
        // todo: handle empty string vs. null value
        return !Objects.equals(fieldText, formatterText);
    }

    /**
     * Install a custom keyMapping for ESCAPE in the inputMap of the given field. 
     * @param field the textField to configure
     */
    protected void installCancel(TextField field) {
        // Dirty: reflectively access the behavior
        // needs --add-exports at compile- and runtime! 
        // note: FXUtils is a custom helper class not contained in core fx, use your own 
        // helper or write the field access code as needed.
        TextFieldBehavior behavior = (TextFieldBehavior) FXUtils.invokeGetFieldValue(
                TextFieldSkin.class, field.getSkin(), "behavior");
        // Dirty: internal api/classes
        InputMap inputMap = behavior.getInputMap();
        KeyBinding binding = new KeyBinding(KeyCode.ESCAPE);
        // custom mapping that delegates to helper method
        KeyMapping keyMapping = new KeyMapping(binding, e ->  {
            cancelEdit(field, e);
        });
        // by default, mappings consume the event - configure not to
        keyMapping.setAutoConsume(false);
        // remove old
        inputMap.getMappings().remove(keyMapping);
        // add new
        inputMap.getMappings().add(keyMapping);
    }

    /**
     * Custom EventHandler that's mapped to ESCAPE.
     * 
     * @param field the field to handle a cancel for
     * @param ev the received keyEvent 
     */
    protected void cancelEdit(TextField field, KeyEvent ev) {
        boolean dirty = isDirty(field);
        field.cancelEdit();
        if (dirty) {
           ev.consume();
        }
    }

    private Parent createContent() {
        TextFormatter<String> fieldFormatter = new TextFormatter<>(
                TextFormatter.IDENTITY_STRING_CONVERTER, "textField ...");
        TextField field = new TextField();
        field.setTextFormatter(fieldFormatter);
        // listen to skin: behavior is available only after it's set
        field.skinProperty().addListener((src, ov, nv) -> {
            installCancel(field);
        });
        // just to see the state of the formatter
        Label fieldValue = new Label();
        fieldValue.textProperty().bind(fieldFormatter.valueProperty());

        // add cancel button
        Button cancel = new Button("I'm the cancel");
        cancel.setCancelButton(true);
        cancel.setOnAction(e -> LOG.info("triggered: " + cancel.getText()));

        HBox fields = new HBox(100, field, fieldValue);
        BorderPane content = new BorderPane(fields);
        content.setBottom(cancel);
        return content;
    }

    @Override
    public void start(Stage stage) throws Exception {
        stage.setScene(new Scene(createContent()));
        stage.show();
    }

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

    @SuppressWarnings("unused")
    private static final Logger LOG = Logger
            .getLogger(TextFieldCancelSO.class.getName());

}

- kleopatra