欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

JavaFX高级组件之TableView

程序员文章站 2024-02-06 23:04:04
...

JavaFX高级组件之TableView


  • 先整体说说

使用 TableView 控件时,其重点不在于显示图形界面,而在于界面上展示数据与后台数据的动态绑定!
一般使其能够动态更新需要有两个条件:
1. 使用 TableViewObservableList<T> 的双向绑定。ObservableList<T> 是JavaFX结合框架下的实现类。类似于普通集合类,但是它是允许跟踪更改的列表,可以与 util 包下的集合互相转换。
2. 使用具有 Property 属性的数据封装。


  • 如何在布局中添加TableView

    1. 创建 TableView 实例和 ObservableList<T> 实例,代码如下:
public  TableView<DataEntry> table = new TableView<DataEntry>();
public  ObservableList<DataEntry> data = FXCollections.observableArrayList(list);//FXCollection和UnitCollection的转换
//list为ArrayList集合,通过FXCollection对象可以实现转换

Collection和FXCollection的互相转换:

ArrayList<DataEntry> dataList = new ArrayList<DataEntry>(ObservableList<Data> data);
ObservableList<DataEntry> data = FXCollections.observableArrayList(list);
  1. 创建 TableColumn (列实例),绑定数据模型,添加到表格
TableColumn<DataEntry, String> dataNameCol = new TableColumn<DataEntry, String>("Data Name");//定义列
dataNameCol.setMinWidth(100);//设置列的最小宽度
dataNameCol.setCellValueFactory(new PropertyValueFactory<>("dataName"));//将列与数据模型中的数据属性绑定

table.setItems(data);//table 和 ObservableList 数据绑定
table.getColumns().addAll(selectedCol,dataNameCol, dataValueCol);//绑定创建的列到表格

至此,一个表格视图就快要创建完成了,还有最重要的一点,特殊的数据封装!一下代码为本例中 DataEntry 数据模型的实现:

import javafx.beans.property.SimpleBooleanProperty;
import javafx.beans.property.SimpleDoubleProperty;
import javafx.beans.property.SimpleStringProperty;

public class DataEntry {
    private final SimpleStringProperty dataName;
    private final SimpleDoubleProperty dataValue;

    public DataEntry(String dataName, Double dataValue) {
        this.dataName = new SimpleStringProperty(dataName);
        this.dataValue = new SimpleDoubleProperty(dataValue);
    }

     public String getDataName() {
         return dataName.get();
     }
     public void setDataName(String dName) {
         dataName.set(dName);
     }
     public SimpleStringProperty dataNameProperty(){
            return dataName;
     }

     public Double getDataValue() {
         return dataValue.get();
     }
     public void setDataValue(Double dValue) {
         dataValue.set(dValue);
     }
     public SimpleDoubleProperty dataValueProperty(){
            return dataValue;
     }
}

在确保以上条件正确的情况下,一个可以动态更新数据的表格就完成了。效果如下图:

JavaFX高级组件之TableView

如上图,在表格中添加类似单选框的组件是怎么做到的呢?


  • 自定义表格单元格

    1. 使单元格可编辑,代码如下:
dataNameCol.setCellFactory(TextFieldTableCell.<DataEntry>forTableColumn());//将 dataNameCol 列的单元格定义为 TextFieldTableCell
dataNameCol.setOnEditCommit((CellEditEvent<DataEntry,String> t) -> { //创建单元格被修改事件
    ((DataEntry) t.getTableView().getItems().get(t.getTablePosition().getRow())).setDataName(t.getNewValue()); //将新的值赋给获取到的单元格
});
  1. 在单元中加入 CheckBox 单选框:
TableColumn<DataEntry,Boolean> selectedCol = new TableColumn<DataEntry, Boolean>("Check");//定义列
selectedCol.setMinWidth(50);
selectedCol.setCellValueFactory(new PropertyValueFactory<>("selected"));

selectedCol.setCellFactory(new Callback<TableColumn<DataEntry, Boolean>, TableCell<DataEntry, Boolean>>() {
    @Override
    public TableCell<DataEntry, Boolean> call(
        TableColumn<DataEntry, Boolean> param) {
        CheckBoxTableCell<DataEntry, Boolean> cell = new CheckBoxTableCell<>();
        cell.setAlignment(Pos.CENTER);
        return cell;
    }
});
selectedCol.setOnEditCommit((CellEditEvent<DataEntry,Boolean> t) -> {
    ((DataEntry) t.getTableView().getItems().get(t.getTablePosition().getRow())).setSelected(t.getNewValue());
});

当然在数据模型封装中,也要为 单选框 这一列建立一个 SimpleBooleanProperty 的绑定属性。

private SimpleBooleanProperty selected = new SimpleBooleanProperty(false);

public Boolean getSelected() {
    return selected.get();
}
public void setSelected(Boolean flag) {
    selected.set(flag);
} 
public SimpleBooleanProperty selectedProperty(){
    return selected;
}

效果图

JavaFX高级组件之TableView