JavaFX之TableView

TableView表 

构建一个表主要有TableView,TableColumn,ObservableList,Bean。

添加列table.getColumns().addAll(); 
ObservableList里面是存放的数据 
table.setItems(observableList);添加数据 
observableList里面一般是存放的Bean，列与Bean之间建立联系，从而获取值。

一、TableColumn列 

列与Bean之间建立联系： 
setCellValueFactory();
通过cell值工厂建立与Bean的联系。它这里并不需要知道你是传了什么Bean，它只需要通过“字段名”反射去Bean里面获得值，所以Bean属性定义的名字不需要与它相同，只需要有字段名Property() 方法。 

setCellValueFactory(new PropertyValueFactory<Person, String>("字段名"));

TableColumn<Person,String> firstNameCol = new TableColumn<Person,String>("First Name");
firstNameCol.setCellValueFactory(new PropertyValueFactory<Person,String>("firstName"));

第二种设置方式

setCellValueFactory(new CallBack<T,S>());

setCellValueFactory(new CallBack<TableColumn.CellDataFeatures<Person, String>,ObservableValue<String>>()
@Override
            public ObservableValue<String> call(TableColumn.CellDataFeatures<Person, String> cellData) {
               
                return new SimpleStringProperty(cellData.getValue().);
            }
);

TableColumn设置sort的3个方法 

setSortNode(Node); // 默认是表头上的小图标三角形，可以改变 
setSortable(true); // 设置可排序 

setSortType(SortType);//设置升降序 SortType.DESCENDING和SortType.ASCENDING

table.getSelectionModel().getSelectedCells().get(0).getTableColumn() // 获取选中的TableColumn
column中包含多个column，则可以调用TableColumn的getColumns().setAll(TableColumn...)

TableColumn<Person, String> firstNameColumn = new TableColumn<Person, String>("First");
firstNameColumn.setCellValueFactory(new PropertyValueFactory<Person, String>("firstName"));
// firstNameColumn.setCellFactory(TextFieldCellFactory.<Person>forTableColumn());
TableColumn<Person, String> lastNameColumn = new TableColumn<Person, String>("Last");
lastNameColumn.setCellValueFactory(new PropertyValueFactory<Person, String>("lastName"));
// lastNameColumn.setCellFactory(TextFieldCellFactory.<Person>forTableColumn());
TableColumn<Person, String> nameColumn = new TableColumn<Person, String>("Name");
nameColumn.getColumns().setAll(firstNameColumn, lastNameColumn);

二、TaleCell

对TableColumn的cell里面弄重新构造
setCellFactory(TextFieldTableCell.forTableColumn());有一些默认的构造。 

setCellFactory(new Callback<TableColumn<Path, Number>, TableCell<Path, Number>>() {
            @Override
            public TableCell<Path, Number> call(TableColumn<Path, Number> param) {
                return new MyTableCell<Path, Number>();  
            }
}

 

cell里面不仅只存放文字，还可以存放其它Node,需要重写TableCell的update(T t,boolean empty)方法编辑单元格可以使用重写startEdit()和cancelEdit()

class MyTableCell<Path, String> extends TableCell<Path, String> {
     protected void updateItem(Node node,boolean empty) {        
              super.updateItem(node, empty);  
              if (empty||node==null) {    //tableCell没有数据或者为空                       
                setText(null);  
                setGraphic(null);  
              else {                                
               setText(null);  
               setGraphic(node);  //设置Node
            } 
     }
     @Override
   public void startEdit() {
       super.startEdit();  
           // 设置编辑状态  
       //super.setGraphic(null);
       //super.setText(null);
     }


    @Override
    public void cancelEdit() {
        super.cancelEdit();
        //退出编辑状态
        //super.setText(null);          
        // super.setGraphic(null);
    }
}

 

双击鼠标监听

通过tableColumn.setCellFactory(new TaskCellFactory());设置了CellFactory。

TaskCellFactory的内容如下：

class TaskCellFactory implements Callback<TableColumn<Task, String>, TableCell<Task, String>> {

    @Override
    public TableCell<Task, String> call(TableColumn<Task, String> param) {
        TextFieldTableCell<Task, String> cell = new TextFieldTableCell<>();
        cell.setOnMouseClicked((MouseEvent t) -> {
            if (t.getClickCount() == 2) {
               //双击执行的代码
            }
        });      
        return cell;
    }
}

整个实现的核心就在于重点就在于实现Callback<TableColumn<Task, String>, TableCell<Task, String>>然后返回JavaFX API自带的TextFieldTableCell。并在call()方法中，为cell增加了双击事件的处理。

三、TableRow

通过setRowFactory,对行的双击进行操作 

 tableView.setRowFactory(new Callback<TableView<T>, TableRow<T>>() {  
            @Override  
            public TableRow<T> call(TableView<T> param) {  
                return new TableRowControl();  
            }  
        });  

class TableRowControl extends TableRow<T> {  
  
        public TableRowControl() {  
            super();  
            this.setOnMouseClicked(new EventHandler<MouseEvent>() {  
                @Override  
                public void handle(MouseEvent event) {  
                    if (event.getButton().equals(MouseButton.PRIMARY)  
                            && event.getClickCount() == 2  
                            && TableRowControl.this.getIndex() < tableView.getItems().size()) {  
                          //doSomething  
                    }  
                }  
            });  
        }  
    }  

四、MenuButton

在JavaFx的 TableView 上可以使用MenuButton来管理TableView的Column.

启用MenuButton.

TableView.setTableMenuButtonVisible(true);  

但是普通的MenuButton, 每次点击都会刷新TableView

重写TableMenuButton的事件

找到tableView 的 menuButton.
Node menuButton = tableView</span>.lookup(".show-hide-columns-button");
EventHandler<MouseEvent> mousePressedHandler = new EventHandler<MouseEvent>() {
    @Override
    public void handle(MouseEvent event) {
       //可以增加文本菜单对TableColumn的控制
        //中止event
         event.consume();
    }
};
//增加menuButton的触发事件
menuButton.addEventFilter(MouseEvent.MOUSE_PRESSED,
        mousePressedHandler);

五、SelectionMode

table默认是只能选着一行的，如果想选着多行，设置SelectionMode,此时可以对选中的多个进行监听。 

ListChangeListener<Person> indicesListener = new   ListChangeListener<Person>() {  
           @Override public void onChanged(Change<? extends Person> c) {  
               while (c.next()) {  
                  
                   selectionUpdated(c.getAddedSubList(), c.getRemoved());  
               }  
           }  
       };  
tableView.getSelectionModel().getSelectedItems().addListener(indicesListener);  
tableView.getSelectionModel().setSelectionMode(SelectionMode.MULTIPLE);  

tableView.getSelectionModel()得到的是个抽象类SelectionModel，它有二个子类MultipleSelectionModel, SingleSelectionModel。

getSelectedIndex()   
getSelectedItem()   
selectedIndexProperty()   
selectedItemProperty()   
selectFirst()   
selectLast()   
clearSelection()   
clearSelection(int index) 
selectIndices(int index, int... indices)   
selectRange(int start, int end)   
select(int index)   
select(T obj)   
setSelectionMode(SelectionMode.MULTIPLE);  

MultipleSelectionModel则提供多选功能，并且提供多选的一些方法。 

selectAboveCell()   
selectBelowCell()  
selectLeftCell()   
selectRightCell()    
setCellSelectionEnabled(boolean value)   
select(int row, TableColumn<S,?> column)   

选择变换监听

tableview.getSelectionModel().selectedItemProperty().addListener(new ChangeListener() {  
//tableview.getSelectionModel().selectedIndexProperty().addListener(new ChangeListener() {  
        @Override  
        public void changed(ObservableValue observable,Object oldValue, Object newValue) {  
        system.out.println("selection change");  
        }  
});  

六、TableView的FXCSS

特殊的table设置

TableView的单元之间去掉行横线 

.table-view .table-row-cell {  
    -fx-background-insets: 0;  
}  

TableView的单元之间去掉没有数据的竖线 

table-row-cell:empty .table-cell {  
    -fx-border- 0px;  
}  

TableView的单元之间去掉竖线 

table-row-cell .table-cell {  
    -fx-border- 0px;  
}  

TableView的TableColumn的列头设置

.table-view .column-header{
    -fx-border-color:white lightgray white white;  
}

table的空闲的列头设置

.table-view .filler{
     -fx-background-color: white;    
}

table的列首背景设置，其中包括column-header，filler，MenuButton

.table-view .column-header-background{   
   -fx-background-color: white;    
}

/* remove double borders from scrollbars */

table的垂直滚动条设置

.table-view > .virtual-flow > .scroll-bar:vertical{
    -fx-background-insets: 0, 0 0 0 1;
    -fx-padding: -1 -1 -1 0;
}

table的水平滚动条设置

.table-view > .virtual-flow > .scroll-bar:horizontal{
    -fx-background-insets: 0, 1 0 0 0;
    -fx-padding: 0 -1 -1 -1;
}

table的边角设置

.table-view > .virtual-flow > .corner {
    -fx-background-color: derive(-fx-base,-1%); /*-fx-base 是modena 预先定义的颜色*/
}

/* Selected rows */

.table-view:focused > .virtual-flow > .clipped-container > .sheet > .table-row-cell:filled:selected{
    -fx-background: -fx-selection-bar;
    -fx-table-cell-border-color: derive(-fx-selection-bar, 20%);
}

/* Selected when control is not focused */

.table-row-cell:filled > .table-cell:selected{
    -fx-background: -fx-selection-bar-non-focused;
    -fx-table-cell-border-color: derive(-fx-selection-bar-non-focused, 20%);
}

 

/* focused cell (keyboard navigation) */

.table-view:focused:cell-selection > .virtual-flow > .clipped-container > .sheet > .table-row-cell > .table-cell:focused{
    -fx-background-color: -fx-background, -fx-cell-focus-inner-border, -fx-background;
    -fx-background-insets: 0, 1, 2;
}

.table-view{
    /* Constants used throughout the tableview. */
    -fx-table-header-border-color: -fx-box-border;
    -fx-table-cell-border-color: derive(-fx-color,5%);
}