DOC-03-08 文本框(Text Field)
本章讨论Text Field组件的功能。
TextField类实现了一个接收和显示文本输入的UI组件。它提供了从用户接收文本输入的功能。这个类和另一个文本输入组件PasswordField一样,都继承自TextInput类。TextInput类是JavaFX
API中所有文本组件的超类。
图8-1显示了一个典型的Label加Text Field界面
图8-1 Label和Text Field
创建一个Text Field
例8-1中,Text Field通过和一个Label组合来指示在文本框中应该输入的内容类型。
例8-1创建一个Text Field
Java
Label label1 = new Label("Name:");
TextField textField = new TextField ();
HBox hb = new HBox();
hb.getChildren().addAll(label1, textField);
hb.setSpacing(10);
1
2
3
4
5
Labellabel1=newLabel("Name:");
TextFieldtextField=newTextField();
HBoxhb=newHBox();
hb.getChildren().addAll(label1,textField);
hb.setSpacing(10);
你可以如例8-1中所示的创建一个空的Text Field,或者创建一个带有指定文本数据的Text Field。要创建带有预定义文本的Text Field,使用TextField类如下的构造函数:TextField(“Hello
World!”)。你可以在任何时候通过 getText方法获取Text Field的值。
你可以使用TextInput类的setPrefColumnCount方法来设置Text Field的大小,这个大小是指同一时间可以显示的最大字符个数。
使用Text Field构建界面
一般TextField对象被用在表单中来创建多个Text Field。图8-2所示的应用程序显示了3个Text
Field,并处理用户在其中输入的数据。
图8-2 TextField样例应用程序
代码片段例8-2创建了那三个Text Field和两个Button,然后使用GridPane容器将他们添加到了应用程序的Scene中。这个容器在你要为UI组件实现一个灵活的布局时非常方便。
例8-2添加Text Field到Application
Java
//创建GridPane容器
GridPane grid = new GridPane();
grid.setPadding(new Insets(10, 10, 10, 10));
grid.setVgap(5);
grid.setHgap(5);
//定义Name Text Field
final TextField name = new TextField();
name.setPromptText("Enter your first name.");
GridPane.setConstraints(name, 0, 0);
grid.getChildren().add(name);
//定义Last Name Text Field
final TextField lastName = new TextField();
lastName.setPromptText("Enter your last name.");
GridPane.setConstraints(lastName, 0, 1);
grid.getChildren().add(lastName);
//定义Comment Text Field
final TextField comment = new TextField();
comment.setPromptText("Enter your comment.");
GridPane.setConstraints(comment, 0, 2);
grid.getChildren().add(comment);
//定义Submit Button
Button submit = new Button("Submit");
GridPane.setConstraints(submit, 1, 0);
grid.getChildren().add(submit);
//定义Clear Button
Button clear = new Button("Clear");
GridPane.setConstraints(clear, 1, 1);
grid.getChildren().add(clear);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
//创建GridPane容器
GridPanegrid=newGridPane();
grid.setPadding(newInsets(10,10,10,10));
grid.setVgap(5);
grid.setHgap(5);
//定义Name Text Field
finalTextFieldname=newTextField();
name.setPromptText("Enter your first name.");
GridPane.setConstraints(name,0,0);
grid.getChildren().add(name);
//定义Last Name Text Field
finalTextFieldlastName=newTextField();
lastName.setPromptText("Enter your last name.");
GridPane.setConstraints(lastName,0,1);
grid.getChildren().add(lastName);
//定义Comment Text Field
finalTextFieldcomment=newTextField();
comment.setPromptText("Enter your comment.");
GridPane.setConstraints(comment,0,2);
grid.getChildren().add(comment);
//定义Submit Button
Buttοnsubmit=newButton("Submit");
GridPane.setConstraints(submit,1,0);
grid.getChildren().add(submit);
//定义Clear Button
Buttonclear=newButton("Clear");
GridPane.setConstraints(clear,1,1);
grid.getChildren().add(clear);
现在花点时间来学习一下这段代码。name,lastName和commentText Field都是通过TextField 类的空构造方法创建的。不像例8-1,这段代码中没有伴随Text Field使用Label。替代方案是,提示说明可以提醒用户在Text Field中输入何种类型的数据。方法setPromptText定义了在应用程序启动时Text Field显示的字符串。把例8-2添加到应用程序后,其运行结果如图8-3所示。
图8-3三个带有提示信息的Text Field
提示文本和输入在Text Field中的文本的区别是提示文本无法通过getText方法取得。
在真实的应用程序中,输入到Text Field中的数据会根据应用程序特定业务需求的逻辑进行处理。下一节解释如何使用Text Field评估输入的数据并给用户产生一个反馈。
处理Text Field数据
如前面所说,用户输入在Text Field中的文本数据可以通过TextInput类的getText方法取出。
学习例8-3中如何处理TextField对象的数据。
例8-3为Submit和Clear按钮定义操作
Java
//添加一个Label
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() + ", "
+ "thank you for your comment!");
} else {
label.setText("You have not left a comment.");
}
});
clear.setOnAction((ActionEvent e) -> {
name.clear();
lastName.clear();
comment.clear();
label.setText(null);
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
//添加一个Label
finalLabellabel=newLabel();
GridPane.setConstraints(label,0,3);
GridPane.setColumnSpan(label,2);
grid.getChildren().add(label);
submit.setOnAction((ActionEvente)->{
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.");
}
});
clear.setOnAction((ActionEvente)->{
name.clear();
lastName.clear();
comment.clear();
label.setText(null);
});
被添加到GridPane容器中的Label组件显示了应用程序对用户的反馈信息。当用户点击Submit按钮,setOnAction方法检查commentText Field。如果其包含了非空字符串,一个thank-you信息将会被显示。否则,应用程序会提示用户comment信息还没有填写,如图8-4所示。
图8-4未填写Comment Text Field
当用户点击Clear按钮,三个Text Field中的内容都会被清除。
看以下几个能用于Text Field的有用方法:
·copy()–将当前选中范围内的文本复制到剪切板,并保留选中的内容
·cut()–将当前选中范围内的文本复制到剪切板,并移除选中的内容
·selectAll()–选中Text Field中所有输入的文本
·paste()–将剪切板中的内容粘贴到这个Text Field中,并替换当前选中的内容
相关的API文档
·TextField
·TextInputControl
打赏一下
支付宝
微信