（翻译）第十八回 JavaFX2.0 列表框ListView

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

 

 

ListView类呈现一个可滚动的项目列表。 Figure 12-1 展示了一个住宿类型列表。

 

Figure 12-1 Simple List View

Description of "Figure 12-1 Simple List View" 

 

可以通过setItems 方法定义项目来产生列表。也可以使用setCellFactory 方法为列表中项目创建一个视图。

创建List View

Example 12-1中的代码块实现了Figure 12-1 中带有String 类项目的列表。

Example 12-1 Creating a List View Control

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

使用setPrefHeight 和setPrefWidth 方法来改变列表视图控件的大小和高度。Example 12-2限制垂直列表具有100点宽度和70点高度，效果见Figure 12-2。

Example 12-2 Setting Height and Width for a List View

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

Figure 12-2 Resized Vertical List

Description of "Figure 12-2 Resized Vertical List" 

要将ListView对象设置为水平方向的可以通过将方向属性设为 Orientation.HORIZONTAL ，这样做即可：list.setOrientation(Orientation.HORIZONTAL) 。 Figure 12-1 和Figure 12-3 中的水平列表具有相同的项目。

Figure 12-3 Horizontal List View Control

Description of "Figure 12-3 Horizontal List View Control" 

可以用下面的组合方法获得每个项目当前的状态：

• getSelectionModel().selectedIndexProperty() – 返回当前被选中项目的索引。

• getSelectionModel().selectedItemProperty() – 返回当前被选中项目。

• getFocusModel().getFocusedIndex() – 返回当前有焦点的项目索引。

• getFocusModel().getFocusedItem() – 返回当前有焦点的项目。

注意，选中的和有焦点的项目都是只读的，应用启动后是不能为项目指定这些属性的。

前面的代码样例讲解了怎么创建具有文本项目的列表。然而，列表视图控件可以包含Node对象。

用数据产生List View

研究下面的代码学习怎么用细胞工厂（cell factory）产生列表项目。Example 12-3 中的应用创建了一个颜色模式列表。

Example 12-3 Creating a Cell Factory

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 Main 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");     @Override    public 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> {        @Override        public 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方法可以包含其他控件、文本、形状、图像。该应用中，列表细胞放的是矩形。

 Figure 12-4 是该应用编译运行后产生的效果。

Figure 12-4 List of Color Patterns

Description of "Figure 12-4 List of Color Patterns" 

你可以滚动列表，选择或取消选择项目，也可以扩展应用来用颜色填充文本标签。

处理选中的List Item

按照 Example 12-4 修改应用的代码，以使其能处理特定项目被选中的事件。

Example 12-4 Processing Events for a List Item

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 Main 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();     @Override    public 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> {        @Override        public 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> 对象来绑定选中项目的改变。比如说，深紫色项目被选中了，标签接收到了"darkorchid"标题并用相应的颜色填充。修改后应用的效果见Figure 12-5 .

Figure 12-5 Selecting a Dark Orchid Color Pattern

Description of "Figure 12-5 Selecting a Dark Orchid Color Pattern"