文档



JavaFX:使用JavaFX UI组件

8 文本字段

本章讨论了文本字段控件的功能。

TextField类实现了一个接受和显示文本输入的UI控件。它提供了从用户接收文本输入的功能。除了另一个文本输入控件PasswordField,这个类还扩展了TextInput类,这是JavaFX API中所有文本控件的超类。

图8-1显示了一个带有标签的典型文本字段。

图8-1 标签和文本字段

一个标签和一个文本框
"图8-1 标签和文本字段"的描述

创建文本字段

示例8-1中,一个文本字段与一个标签结合使用,用于指示应在字段中输入的内容类型。

示例8-1 创建文本字段

Label label1 = new Label("姓名:");
TextField textField = new TextField ();
HBox hb = new HBox();
hb.getChildren().addAll(label1, textField);
hb.setSpacing(10);

您可以像示例8-1中所示创建一个空的文本字段,也可以创建一个带有特定文本数据的文本字段。要创建带有预定义文本的文本字段,请使用TextField类的以下构造函数:TextField("Hello World!")。您可以随时通过调用getText方法来获取文本字段的值。

您可以使用TextInput类的setPrefColumnCount方法来设置文本字段的大小,定义为它可以一次显示的最大字符数。

使用文本字段构建UI

通常,TextField对象用于在表单中创建多个文本字段。在图8-2中显示的应用程序显示了三个文本字段,并处理用户在其中输入的数据。

图8-2 TextFieldSample应用程序

TextBoxSample应用程序
图8-2 TextFieldSample应用程序的描述

示例8-2中的代码片段创建了三个文本字段和两个按钮,并使用GridPane容器将它们添加到应用程序的场景中。当您需要为UI控件实现灵活的布局时,这个容器非常方便。

示例8-2 将文本字段添加到应用程序

//创建一个GridPane容器
GridPane grid = new GridPane();
grid.setPadding(new Insets(10, 10, 10, 10));
grid.setVgap(5);
grid.setHgap(5);

//定义名字文本字段
final TextField name = new TextField();
name.setPromptText("输入您的名字。");
GridPane.setConstraints(name, 0, 0);
grid.getChildren().add(name);

//定义姓氏文本字段
final TextField lastName = new TextField();
lastName.setPromptText("输入您的姓氏。");
GridPane.setConstraints(lastName, 0, 1);
grid.getChildren().add(lastName);

//定义评论文本字段
final TextField comment = new TextField();
comment.setPromptText("输入您的评论。");
GridPane.setConstraints(comment, 0, 2);
grid.getChildren().add(comment);

//定义提交按钮
Button submit = new Button("提交");
GridPane.setConstraints(submit, 1, 0);
grid.getChildren().add(submit);

//定义清除按钮
Button clear = new Button("清除");
GridPane.setConstraints(clear, 1, 1);
grid.getChildren().add(clear);

请花一点时间研究代码片段。在这个代码片段中,namelastNamecomment文本字段是使用TextField类的空构造函数创建的。与示例8-1不同,标签不会陪同文本字段出现在这个代码片段中。相反,提示标题通知用户在文本字段中输入什么类型的数据。当应用程序添加了示例8-2后,它会产生如图8-3所示的输出。

图8-3 带有提示消息的三个文本字段

带有提示文本的三个文本框
"图8-3 带有提示消息的三个文本字段"的描述

提示文本和输入到文本字段中的文本的区别在于,通过getText方法无法获取提示文本。

在实际应用中,根据特定业务任务的要求,文本字段中输入的数据会根据应用的逻辑进行处理。下一节将介绍如何使用文本字段来评估输入的数据并生成对用户的响应。

处理文本字段数据

如前所述,用户在文本字段中输入的文本数据可以通过TextInput类的getText方法获取。

学习示例8-3,了解如何处理TextField对象的数据。

示例8-3 为提交和清除按钮定义操作

//添加一个标签
final Label label = new Label();
GridPane.setConstraints(label, 0, 3);
GridPane.setColumnSpan(label, 2);
grid.getChildren().add(label);

submit.setOnAction((ActionEvent e) -> {
    if (
        (comment.getText() != null && !comment.getText().isEmpty())
    ) {
    label.setText(name.getText() + " " +
        lastName.getText() + ", "
        + "谢谢您的评论!");
    } else {
        label.setText("您没有留下评论。");
    }
});

clear.setOnAction((ActionEvent e) -> {
    name.clear();
    lastName.clear();
    comment.clear();
    label.setText(null);
});

添加到GridPane容器的Label控件用于向用户呈现应用程序的响应。当用户点击提交按钮时,setOnAction方法会检查comment文本字段。如果它包含非空字符串,则呈现感谢消息。否则,应用程序会通知用户尚未留下评论消息,如图8-4所示。

图8-4 空白的评论文本字段

一个文本框已填写,两个文本框为空
"图8-4 空白的评论文本字段"的描述

当用户点击清除按钮时,所有三个文本字段中的内容都会被清除。

请查看一些可与文本字段一起使用的有用方法。

  • copy()– 将当前选择的文本范围复制到剪贴板,保留当前选择。

  • cut()– 将当前选择的文本范围剪切到剪贴板,删除当前选择。

  • selectAll() - 选择文本输入中的所有文本。

  • paste()– 将剪贴板中的内容粘贴到此文本中,替换当前选择。

相关API文档  

关闭窗口

目录

JavaFX:使用JavaFX UI组件

展开 折叠