JavaFX UI控件教程（八）之Choice Box

翻译自   Choice Box

本章介绍了选项框，这些UI控件提供了在几个选项之间快速选择的支持。

使用ChoiceBox该类将选择框添加到JavaFX应用程序。其简单的实现如图7-1所示。

图7-1创建包含三个项目的选择框

 

创建一个选择框

例7-1创建了一个包含三个项目的选择框。

例7-1创建选择框

ChoiceBox cb = new ChoiceBox(FXCollections.observableArrayList(
    "First", "Second", "Third")
);

示例7-1显示了在ChoiceBox类的构造函数中创建和填充的项列表。列表项是使用可观察数组指定的。或者，您可以使用类的空构造函数，并使用示例7-2中setItems显示的方法设置列表项。

示例7-2带有文本元素和分隔符的选择框

ChoiceBox cb = new ChoiceBox();
cb.setItems(FXCollections.observableArrayList(
    "New Document", "Open ", 
    new Separator(), "Save", "Save as")
);

请注意，选择框不仅可以包含文本元素，还可以包含其他对象。甲Separator控制是在用于实施例7-2以分离的项目。当此代码片段集成到应用程序中时，它会生成如图7-2所示的输出。

图7-2使用选择框创建的菜单

在实际应用程序中，选择框用于构建多选列表。

 

设置选择框的行为

图7-3中显示的应用程序提供了一个包含五个选项的多选框。选择特定语言时，将呈现相应的问候语。

图7-3多选列表

图7-4提供了一个代码片段，用于说明从选择框中选择的项目如何定义应呈现的问候语。

图7-4选择选择框项目

甲ChangeListener<Number>对象检测当前选择的项目的通过的连续的调用索引getSelectionModel和selectedIndexProperty方法。该getSelectionModel方法返回所选项，该selectedIndexProperty方法返回SELECTED_INDEXcb选择框的属性。因此，作为索引的整数值定义了问候数组的元素，并指定了String标签的文本值。例如，如果用户选择对应于西班牙语的第二项，SELECTED_INDEX则等于1并且从问候数组中选择“Hola”。因此，标签呈现“Hola”。

您可以ChoiceBox通过为其指定工具提示来使控件更具信息性。工具提示是javafx.scene.control包中可用的UI控件。工具提示可以应用于任何JavaFX UI控件。

 

应用工具提示

的Tooltip类提供了可以通过调用被容易地应用于一个选择框（或任何其他控制）的预制工具提示setTooltip中所示的方法实施例7-3。

示例7-3将工具提示添加到选择框

cb.setTooltip(new Tooltip("Select the language"));

通常，用户在Tooltip类的构造函数中定义工具提示的文本。但是，如果应用程序的逻辑需要UI动态设置文本，则可以使用空构造函数应用工具提示，然后使用该setText方法将文本分配给它。

将工具提示应用于cb选择框后，将光标放在选择框上的用户将看到如图7-5所示的图像。

图7-5带有应用工具提示的选择框

要进一步增强应用程序，可以使用CSS属性设置选项框的样式，或应用视觉效果或变换。

 

相关的API文档 

• ChoiceBox

• Tooltip