(翻译)第十八回 JavaFX2.0 列表框ListView

51 篇文章 0 订阅
30 篇文章 0 订阅

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

 

 

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

 

Figure 12-1 Simple List View

Simple vertical 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

Resized list view object.
Description of "Figure 12-2 Resized Vertical List"

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

Figure 12-3 Horizontal List View Control

Description of Figure 12-3 follows
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 follows
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

The dark orchid color is selected from the list.
Description of "Figure 12-5 Selecting a Dark Orchid Color Pattern"

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值