JavaFX之ListView的使用

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

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

  继承结构如下:

  JavaFX之ListView的使用_第1张图片

  1.ListView的基础用法

[java]  view plain copy
  1. ObservableList strList = FXCollections.observableArrayList("红色","黄色","绿色");  
  2. ListView listView = new ListView<>(strList);  
  3. listView.setItems(strList);  
  4. listView.setPrefSize(400200);  
  5. root.getChildren().add(listView);  
  我们首先通过 FXCollections 来创建我们ListView需要的数据填充。

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

  显示效果如下:

  JavaFX之ListView的使用_第2张图片

  2.ListView的选择事件

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

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

    下面是代码:

[java]  view plain copy
  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的文本跟着一起改变。

  效果图:

  JavaFX之ListView的使用_第3张图片


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

[java]  view plain copy
  1. Label label = new Label("...");  
  2. label.setLayoutY(200);  
  3. root.getChildren().add(label);  
  4. listView.getSelectionModel().selectedItemProperty().addListener(  
  5.         (ObservableValueextends 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 plain copy
  1. listView.setCellFactory(TextFieldListCell.forListView());  
  2. listView.setEditable(true);  
  我们将ListView的CellFactory设置为TextFieldListCell,来提供编辑功能。

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

  效果图如下:

  JavaFX之ListView的使用_第4张图片

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

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

  setOnEditStart   编辑开始

  setOnEditCommit  编辑完成

  setOnEditCancel   编辑取消

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


  4.ListView的自定义Item

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

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

  代码如下所示:

  

[java]  view plain copy
  1. //ListView的自定义  
  2. ObservableList strList = FXCollections.observableArrayList("red","blue","gold");  
  3. ListView listView = new ListView<>(strList);  
  4. listView.setItems(strList);  
  5. listView.setPrefSize(400200);  
  6. listView.setCellFactory((ListView 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 {  
  15.     @Override  
  16.     protected void updateItem(String item, boolean empty) {  
  17.         super.updateItem(item, empty);  
  18.         Rectangle rect = new Rectangle(10020);  
  19.             if (item != null) {  
  20.                rect.setFill(Color.web(item));  
  21.                setGraphic(rect);  
  22.             } else {  
  23.                setGraphic(null);  
  24.             }  
  25.      }  
  26. }  

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

  效果图如下:

  JavaFX之ListView的使用_第5张图片


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


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

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

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

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

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

  下面是截图:

  JavaFX之ListView的使用_第6张图片


  JavaFX之ListView的使用_第7张图片


  JavaFX之ListView的使用_第8张图片

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


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

  JavaFX之ListView的使用_第9张图片

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

你可能感兴趣的:(java)