(翻译)第十三回 JavaFX2.0 选项框ChoiceBox

简介:   原文地址http://download.oracle.com/javafx/2.0/ui_controls/choice-box.htm#BCEDJAEH   ChoiceBox类为在几个选项中快速选择提供了支持。

 

原文地址http://download.oracle.com/javafx/2.0/ui_controls/choice-box.htm#BCEDJAEH

 

ChoiceBox类为在几个选项中快速选择提供了支持。看看 Figure 7-1 中的选项框的这个简单实现怎么样。

Figure 7-1 Creating a Choice Box with Three Items

Description of Figure 7-1 follows
Description of "Figure 7-1 Creating a Choice Box with Three Items"

创建 Choice Box

Example 7-1 创建了带有三个条目的选项框。

Example 7-1 Creating a Choice Box

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

Example 7-1 是创建在ChoiceBox类的构造函数中条目列表。这个条目列表是用一个可见的数组指定的。当然你可以选择使用该类的空构造方法,然后使用setItems方法设置条目列表。见Example 7-2.

Example 7-2 Choice Box with Text Elements and a Separator

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

不过选项框不单单能包含文本元素,还可以是其他对象。  Example 7-2中用一个Separator控件分开了条目。当应用中加入这些代码后,效果见 Figure 7-2.

Figure 7-2 Menu Created by Using a Choice Box

Description of Figure 7-2 follows
Description of "Figure 7-2 Menu Created by Using a Choice Box"

实际项目中,选项框用来创建多选列表。

为Choice Box设置行为

 Figure 7-3 中的应用提供了一个带有5个选项的多选框。当一种特定的语言被选中后,相应的问候语就显示出来。

Figure 7-3 Multiple-Choice List

Description of Figure 7-3 follows
Description of "Figure 7-3 Multiple-Choice List"

Figure 7-4 中的代码块解释了选项框中的条目被选中后是怎么定义哪中语言的问候语应该显示的。

Figure 7-4 Selecting a Choice Box Item

A code fragment
Description of "Figure 7-4 Selecting a Choice Box Item"

通过连续不断的调用getSelectionModelselectedIndexProperty方法,ChangeListener<Number> 对象侦测当前被选中条目的索引。getSelectionModel方法返回被选中的条目,selectedIndexProperty方法返回选项框的SELECTED_INDEX属性。这样,索引的整型值定义了问候数组中的元素,并为标签指定一个 String文本。如果一个用户选择了第二个条目,它对应的西班牙语,SELECTED_INDEX就是1,"Hola"就被从问候语数字中选了出来。这样,标签就显示"Hola."

可以通过为ChoiceBox控件分派提示条使它更有引导性。提示条是javafx.scene.control包中的一个UI控件。提示条能被用于任何JavaFX UI控件。

使用Tooltip

Tooltip类为在选项框(还有其他所有控件)添加提示条提供了预制方法,可以通过调用setTooltip方法很容易的使用。见Example 7-3.

Example 7-3 Adding a Tooltip to a Choice Box

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

一般用户是在Tooltip类的构造方法内定义提示内容。不过,如果你的应用逻辑要求UI动态地设置文本,你可以使用空构造方法使用它,然后使setText方法为它设置文本。

选项框使用了提示条后,用户把鼠标放在选项框上就看到一个图像条。见 Figure 7-5.

Figure 7-5 Choice Box with the Applied Tooltip

A choice box with the tooltip
Description of "Figure 7-5 Choice Box with the Applied Tooltip"

要改善应用的外观,可以给选项框使用CSS,或者使用视觉效果和变换。

 

目录
相关文章
|
9月前
|
定位技术
百度地图标注maker图标按照分类显示不同的样式
百度地图标注maker图标按照分类显示不同的样式
62 0
|
5月前
|
区块链
EasyX趣味化编程note6,图片操作及文字
EasyX趣味化编程note6,图片操作及文字
40 0
|
8月前
|
API
ant.design Table组件点击一个选项框却把所有选项都选中了
ant.design Table组件点击一个选项框却把所有选项都选中了
88 0
ant.design Table组件点击一个选项框却把所有选项都选中了
|
10月前
【EndNote】Preview标签栏不显示摘要
【EndNote】Preview标签栏不显示摘要
157 0
WORD出错:设置为稿纸后,右键的字体、段落项目变灰
WORD出错:设置为稿纸后,右键的字体、段落项目变灰
96 0
WORD出错:设置为稿纸后,右键的字体、段落项目变灰
Flutter 74: 图解基本 DropdownButton 下拉选项框按钮
0 基础学习 Flutter,第七十四步:学习一下下拉选项框的基本用法!
3098 0
Flutter 74: 图解基本 DropdownButton 下拉选项框按钮
|
Java
javaFx 改变stage的标题条的图标
原文来自:http://stackoverflow.com/questions/10275841/how-to-change-the-icon-on-the-title-bar-of-a-stage-in-java-fx-2-0-of-my-applicat/15206407#15206407
257 0
javaFx 改变stage的标题条的图标
GEF入门实例_总结_05_显示一个空白编辑器
一、前言 本文承接上一节:GEF入门实例_总结_04_Eclipse插件启动流程分析 在第三节( GEF入门实例_总结_03_显示菜单和工具栏  ),我们创建了菜单和工具栏。 这一节,我们来实现:点击菜单后,打开一个编辑器。
1449 0