JavaFX UI控件教程（十二）之List View

翻译自 List View

在本章中，您将学习如何在JavaFX应用程序中创建列表。

该ListView级代表项目的滚动列表。图11-1显示了酒店预订系统中可用住宿类型的列表。

图11-1简单列表视图

您可以通过使用该setItems方法定义其项目来填充列表。您还可以通过应用setCellFactory方法为列表中的项创建视图。

创建列表视图

例11-1中的代码片段实现了包含图11-1String中所示项的列表。

示例11-1创建列表视图控件

ListView<String> list = new ListView<String>();
ObservableList<String> items =FXCollections.observableArrayList ("Single", "Double", "Suite", "Family App");
list.setItems(items);

要更改列表视图控件的大小和高度，请使用setPrefHeight和setPrefWidth方法。例11-2将垂直列表限制为100像素宽，70像素高，这导致列表如图11-2所示。

示例11-2设置列表视图的高度和宽度

list.setPrefWidth(100);
list.setPrefHeight(70);

图11-2调整大小的垂直列表

您可以ListView通过将orientation属性设置为水平定向对象Orientation.HORIZONTAL。这可以按如下方式完成：list.setOrientation(Orientation.HORIZONTAL)。与图11-1中相同项目的水平列表如图11-3所示。

图11-3水平列表视图控件

您可以随时ListView使用SelectionModel和FocusModel类跟踪对象的选择和焦点。要获取每个项目的当前状态，请使用以下方法的组合：

getSelectionModel().getSelectedIndex() - 以单选模式返回当前所选项目的索引
getSelectionModel().getSelectedItem() - 返回当前选定的项目
getFocusModel().getFocusedIndex() - 返回当前焦点项的索引
getFocusModel().getFocusedItem() - 返回当前关注的项目

SelectionModel实例化a时使用的默认值ListView是MultipleSelectionModel抽象类的实现。但是，selectionMode属性的默认值是SelectionMode.SINGLE。要在默认ListView实例中启用多个选择，请使用以下调用序列：

listView.getSelectionModel().setSelectionMode(SelectionMode.MULTIPLE);

另请注意，它MultipleSelectionModel具有selectedItems和selectedIndices属性，这两个属性都是可观察的列表，可以监视这些列表以检测任何多个选择。

使用数据填充列表视图

例11-1显示了填充列表视图的最简单方法。为了提高您的列表，你可以使用的特定扩展添加各种类型的数据ListCell类，比如CheckBoxListCell，ChoiceBoxListCell，ComboBoxListCell，和TextFieldListCell。这些类为基本列表单元格带来了额外的功能。为这些类实现单元工厂使开发人员能够直接在列表视图中更改数据。

例如，默认情况下，列表单元格的内容不可编辑。但是，ComboBoxListCell该类在列表单元格中绘制一个组合框。此修改使用户能够通过从组合框中选择名称来构建名称列表，如例11-3所示。

示例11-3将ComboBoxListCell项添加到列表视图

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.control.cell.ComboBoxListCell;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;public class ListViewSample extends Application {public static final ObservableList names = FXCollections.observableArrayList();public static final ObservableList data = FXCollections.observableArrayList();public static void main(String[] args) {launch(args);}@Overridepublic void start(Stage primaryStage) {primaryStage.setTitle("List View Sample");        final ListView listView = new ListView(data);listView.setPrefSize(200, 250);listView.setEditable(true);names.addAll("Adam", "Alex", "Alfred", "Albert","Brenda", "Connie", "Derek", "Donny", "Lynne", "Myrtle", "Rose", "Rudolph", "Tony", "Trudy", "Williams", "Zach");for (int i = 0; i < 18; i++) {data.add("anonym");}listView.setItems(data);listView.setCellFactory(ComboBoxListCell.forListView(names));              StackPane root = new StackPane();root.getChildren().add(listView);primaryStage.setScene(new Scene(root, 200, 250));primaryStage.show();}
}

示例中的粗体行调用该setCellFactory方法重新定义列表单元格的实现。编译并运行此示例时，它将生成如图11-4所示的应用程序窗口。

图11-4使用组合框单元格的列表视图

不仅单元工厂机制允许您应用列表单元格的替代实现，它可以帮助您完全自定义单元格的外观。

自定义列表视图的内容

研究以下应用程序以了解如何使用单元工厂生成列表项。例11-4中显示的应用程序创建了一个颜色模式列表。

示例11-4创建单元工厂

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.ListCell;
import javafx.scene.control.ListView;
import javafx.scene.layout.Priority;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import javafx.util.Callback;public class ListViewSample extends Application {ListView<String> list = new ListView<String>();ObservableList<String> data = FXCollections.observableArrayList("chocolate", "salmon", "gold", "coral", "darkorchid","darkgoldenrod", "lightsalmon", "black", "rosybrown", "blue","blueviolet", "brown");@Overridepublic void start(Stage stage) {VBox box = new VBox();Scene scene = new Scene(box, 200, 200);stage.setScene(scene);stage.setTitle("ListViewSample");box.getChildren().addAll(list);VBox.setVgrow(list, Priority.ALWAYS);list.setItems(data);list.setCellFactory(new Callback<ListView<String>, ListCell<String>>() {@Override public ListCell<String> call(ListView<String> list) {return new ColorRectCell();}});stage.show();}static class ColorRectCell extends ListCell<String> {@Overridepublic void updateItem(String item, boolean empty) {super.updateItem(item, empty);Rectangle rect = new Rectangle(100, 20);if (item != null) {rect.setFill(Color.web(item));setGraphic(rect);}}}public static void main(String[] args) {launch(args);}
}

细胞工厂生产ListCell物体。每个单元格都与一个数据项相关联，并呈现列表视图的单个“行”。单元格通过该setGraphic方法表示的内容可以包括其他控件，文本，形状或图像。在此应用程序中，列表单元格显示矩形。

编译并运行应用程序会生成如图11-5所示的窗口。

图11-5颜色模式列表

您可以滚动列表，选择和取消选择其任何项目。您还可以扩展此应用程序以使用颜色模式填充文本标签，如下一节所示。

处理列表项选择

修改应用程序代码，如例11-5所示，以便在选择特定列表项时启用事件处理。

示例11-5处理列表项的事件

import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.ListCell;
import javafx.scene.control.ListView;
import javafx.scene.layout.Priority;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.stage.Stage;
import javafx.util.Callback;public class ListViewSample extends Application {ListView<String> list = new ListView<String>();ObservableList<String> data = FXCollections.observableArrayList("chocolate", "salmon", "gold", "coral", "darkorchid","darkgoldenrod", "lightsalmon", "black", "rosybrown", "blue","blueviolet", "brown");final Label label = new Label();@Overridepublic void start(Stage stage) {VBox box = new VBox();Scene scene = new Scene(box, 200, 200);stage.setScene(scene);stage.setTitle("ListViewSample");box.getChildren().addAll(list, label);VBox.setVgrow(list, Priority.ALWAYS);label.setLayoutX(10);label.setLayoutY(115);label.setFont(Font.font("Verdana", 20));list.setItems(data);list.setCellFactory(new Callback<ListView<String>, ListCell<String>>() {@Override public ListCell<String> call(ListView<String> list) {return new ColorRectCell();}});list.getSelectionModel().selectedItemProperty().addListener(new ChangeListener<String>() {public void changed(ObservableValue<? extends String> ov, String old_val, String new_val) {label.setText(new_val);label.setTextFill(Color.web(new_val));}});stage.show();}static class ColorRectCell extends ListCell<String> {@Overridepublic void updateItem(String item, boolean empty) {super.updateItem(item, empty);Rectangle rect = new Rectangle(100, 20);if (item != null) {rect.setFill(Color.web(item));setGraphic(rect);}}}public static void main(String[] args) {launch(args);}
}

addListener调用的方法selectedItemProperty创建一个新ChangeListener<String>对象来处理所选项的更改。例如，如果选择了暗兰花项目，则标签接收“暗兰”标题并填充相应的颜色。修改后的应用程序的输出如图11-6所示。

图11-6选择深色兰花颜色模式