(翻译)第十四回 JavaFX2.0 文本框TextField

 

原文地址http://download.oracle.com/javafx/2.0/ui_controls/text-field.htm

 

TextField类实现了一种可以接受和显示文本输入的UI控件，它提供了接受用户输入的功能。和另一个文本输入控件PasswordField一起都继承了TextInput这个类，TextInput是所有文本控件的父类。

 

Figure 8-1 是一个带有标签的典型文本框。

Figure 8-1 Label and Text Field

Description of "Figure 8-1 Label and Text Field"

创建Text Field

在 Example 8-1中，一个文本框和一个标签被用来显示输入的内容类型。

Example 8-1 Creating a Text Field

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

你可以像 Example 8-1中那样创建空文本框或者是创建带有特定文本数据文本框。要创建带有预定义文本的文本框，使用下面这个TextField类的构造方法：TextField("Hello World!")。任何时候你都可以通过getText 方法获得一个文本框的值。

 

可以使用TextInput 类的setPrefColumnCount方法设置文本框的大小，定义文本框一次显示的最多字符数。

用Text Field构建UI

一般地， TextField对象被用来创建几个文本框。  Figure 8-2中的应用显示了三个文本框并且处理用户在它们当中输入的数据。

Figure 8-2 TextFieldSample Application

Description of "Figure 8-2 TextFieldSample Application"

Example 8-2 中的代码块创建了三个文本框和两个按钮，并把使用GridPane 容器他们加入到应用的屏幕上。当你要为你的UI控件实现灵活的布局时这个容器相当方便。

Example 8-2 Adding Text Fields to the Application

//Creating a GridPane container
GridPane grid = new GridPane();
grid.setPadding(new Insets(10, 10, 10, 10));
grid.setVgap(5);
grid.setHgap(5);
//Defining the Name text field
final TextField name = new TextField();
name.setPromptText("Enter your first name.");
name.setPrefColumnCount(10);
name.getText();
GridPane.setConstraints(name, 0, 0);
grid.getChildren().add(name);
//Defining the Last Name text field
final TextField lastName = new TextField();
lastName.setPromptText("Enter your last name.");
GridPane.setConstraints(lastName, 0, 1);
grid.getChildren().add(lastName);
//Defining the Comment text field
final TextField comment = new TextField();
comment.setPrefColumnCount(15);
comment.setPromptText("Enter your comment.");
GridPane.setConstraints(comment, 0, 2);
grid.getChildren().add(comment);
//Defining the Submit button
Button submit = new Button("Submit");
GridPane.setConstraints(submit, 1, 0);
grid.getChildren().add(submit);
//Defining the Clear button
Button clear = new Button("Clear");
GridPane.setConstraints(clear, 1, 1);
grid.getChildren().add(clear);

花点时间来研究下这块代码。 name, lastName, 和comment文本框使用了TextField 类的空构造方法来创建。和 Example 8-1不同，这里文本框没有使用标签，而是使用提示语提醒用户在文本框中要输入什么类型的数据。setPromptText方法定义了当应用启动后显示在文本框中的字符串。把 Example 8-2 中的代码加入到应用中，运行效果如 Figure 8-3.

 

Figure 8-3 Three Text Fields with the Prompt Messages

Description of "Figure 8-3 Three Text Fields with the Prompt Messages"

文本框中的提示语和文本的区别是提示语不能通过getText方法获得。

实际应用中，文本框中输入的文本是根据特定的业务任务决定的应用逻辑来处理的。 下一部分解释了如何使用文本框处理用户输入并向用户反馈。

处理Text Field数据

 前面提到，用户输入文本框的内容能通过TextInput 类的getText方法获得。

研究Example 8-3 中的代码学习怎么处理TextField对象的数据。

Example 8-3 Defining Actions for the Submit and Clear Buttons

//Adding a Label
final Label label = new Label();
GridPane.setConstraints(label, 0, 3);
GridPane.setColumnSpan(label, 2);
grid.getChildren().add(label);

//Setting an action for the Submit button
submit.setOnAction(new EventHandler() {

@Override
    public void handle(ActionEvent e) {
        if ((comment.getText() != null && !comment.getText().isEmpty())) {
            label.setText(name.getText() + " " + lastName.getText() + ", "
                + "thank you for your comment!");
        } else {
            label.setText("You have not left a comment.");
        }
     }
 });
 
//Setting an action for the Clear button
clear.setOnAction(new EventHandler() {

@Override
    public void handle(ActionEvent e) {
        name.setText("");
        lastName.setText("");
        comment.setText("");
        label.setText(null);
    }
}); 

GridPane容器中的Label控件用来显示应用对用户的回应。当用户点击Submit按钮时，setOnAction方法检查comment文本框。如果它是非空字符串，一条感谢信息就显示出来。否则，应用会提醒用户还没有添加评论。见 Figure 8-4.

Figure 8-4 The Comment Text Field Left Blank

Description of "Figure 8-4 The Comment Text Field Left Blank"

当用户点击Clear按钮时，三个文本框的内容都将被清除。

.回顾一下你可能用到的文本框使用函数。

• copy()– 将当前选择的文本范围转移到剪贴板，保留选择文本。

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

• paste()– 将剪贴板内容转移到文本中，取代当前选择文本。