JavaFX之ListView的使用

 ListView是一个很常见的控件。在JavaFX中，ListView也拥有很丰富的功能。下面，我们来看看如何使用ListView。

  ListView位于javafx.scene.control包中，该包是包含javafx中的所有UI控件。

  继承结构如下:

  

  1.ListView的基础用法

[java] view plaincopy

1. ObservableList<String> strList = FXCollections.observableArrayList("红色","黄色","绿色");  
2. ListView<String> listView = new ListView<>(strList);  
3. listView.setItems(strList);  
4. listView.setPrefSize(400, 200);  
5. root.getChildren().add(listView);  

  我们首先通过 FXCollections 来创建我们ListView需要的数据填充。

  通过setItems可以给ListView填充数据。同时设置ListView当前的大小。

  显示效果如下:

  

  2.ListView的选择事件

  有时候，当我们点击ListView的Item的时候，我们进行相应的事件处理。

  当然，ListView的事件同样是通过属性绑定机制来实现的，详情请见我的另外一篇文章:浅谈JavaFX事件机制

    下面是代码:

[java] view plaincopy

1. Label label = new Label("...");  
2. label.textProperty().bind(listView.getSelectionModel().selectedItemProperty());  
3. label.setLayoutY(200);  
4. root.getChildren().add(label);  

   这里只是简单的将label的text属性绑定到listview的 选择属性 上面，当listview的选择改变时，label的文本跟着一起改变。

  效果图:

  

  同样的，我们可以对ListView的选择属性，添加改变事件，如下:

[java] view plaincopy

1. Label label = new Label("...");  
2. label.setLayoutY(200);  
3. root.getChildren().add(label);  
4. listView.getSelectionModel().selectedItemProperty().addListener(  
5.         (ObservableValue<? extends String> observable, String oldValue, String newValue) ->{  
6.         label.setText(newValue);  
7. });  

  可以达到同样的效果。

  这里使用了lambda表达式(后面其实是new ChangeListener来监听属性的改变)。没有用JDK 8的朋友们去下载吧。

  

  3.ListView的编辑

  同TableView里面Item可以编辑一样，ListView也提供这样的功能。只不过，我们需要改变ListView的CellFactory。

  在上述示例中，我们只需要添加如下代码:

[java] view plaincopy

1. listView.setCellFactory(TextFieldListCell.forListView());  
2. listView.setEditable(true);  

  我们将ListView的CellFactory设置为TextFieldListCell，来提供编辑功能。

  在JavaFX中，提供了很多默认可以使用的Cell，大家可以自己去看文档javafx.scene.control.cell包中。我就不一一列出来了。

  效果图如下:

  

  双击某个Item，就会进入编辑状态，按回车，编辑就完成。同时，选择属性也会改变。

  如果你希望自己来控制ListView Item编辑的相关操作，这里也有三个事件:

  setOnEditStart   编辑开始

  setOnEditCommit  编辑完成

  setOnEditCancel   编辑取消

  这些事件会在你进行编辑的时候执行，有需求可以在这三个事件中做相应的处理。

  4.ListView的自定义Item

  不管怎么说，官方提供的ListView Cell不一定能满足我们的需求。我们通常会自定义ListCell来实现自己想要的效果。

  这样，我们需要继承ListCell来实现自己的Cell。

  代码如下所示:

  

[java] view plaincopy

1. //ListView的自定义  
2. ObservableList<String> strList = FXCollections.observableArrayList("red","blue","gold");  
3. ListView<String> listView = new ListView<>(strList);  
4. listView.setItems(strList);  
5. listView.setPrefSize(400, 200);  
6. listView.setCellFactory((ListView<String> l) -> new ColorCell());  
7. listView.setEditable(true);  
8. root.getChildren().add(listView);  
9.               
10. Label label = new Label("...");  
11. label.textProperty().bind(listView.getSelectionModel().selectedItemProperty());  
12. label.setLayoutY(200);  
13. root.getChildren().add(label);  
14. class ColorCell extends ListCell<String> {  
15.     @Override  
16.     protected void updateItem(String item, boolean empty) {  
17.         super.updateItem(item, empty);  
18.         Rectangle rect = new Rectangle(100, 20);  
19.             if (item != null) {  
20.                rect.setFill(Color.web(item));  
21.                setGraphic(rect);  
22.             } else {  
23.                setGraphic(null);  
24.             }  
25.      }  
26. }  

  我们通过继承ListCell，实现UpdateItem方法，来自定义每个Cell的内容。

  效果图如下:

  

  ListView的使用讲解就到这里了。基本上能用的到内容也都在这里了。下一节课再见。

  本文章为个人原创，转载请注明出处:http://blog.csdn.net/wingfourever,本人的个人博客:http://www.wjfxgame.com

-----------------------------------------------------------------------------------------------------------

  有一段时间没有写博客了，也不知为何，总有点疲惫的样子。虽然公司体检，并无什么问题。看来，也可能是IT行业的通病，工作三年来，从每天精神抖擞，充满激情，到略有疲惫，激情褪去。有人说的那啥，时间是一把XX刀。

  个人网站之前用的WordPress，但是实在太不适合写代码了，经常更换主题，导致代码插件不兼容，显示效果各种坑爹。又是折腾插件，又是折腾这折腾那的，表示累了。一横心把wordpress数据库备份了下，就清空换Z-Blog了。虽然我也是IT行业，但仅仅只是想写点教程，写点文字，而不想继续花这么多时间折腾在这些无意义的事情上。

  最近用Unity3D做了个文字游戏的模版，写脚本就可以完成游戏了。不过没有时间写剧本。

  下面是截图:

  

  

  

  由于只是测试用的脚本，所以文字信息可以忽略。。

  另外，最近在用JavaFX做一个游戏地图编辑器，准备用在Unity3D开发2D的RPG或者策略类游戏。大家如果感兴趣的话，也可以在完成这个地图编辑器后开源。

  

  具体工作计划将会在个人博客中介绍。感谢支持。