JavaFX 2.2:设置表格单元格样式并处理行伪类(悬停、选定等)

2024-01-11

我正在开发一个 JavaFX 应用程序,其中包含一个带有特殊单元格的 TableView,这样当单元格中的数据无效时,单元格就会变成红色。

这对于 css 来说很容易,但是我在覆盖 TableCell 的所有伪类时遇到了麻烦。

import javafx.application.Application;
import javafx.beans.property.BooleanProperty;
import javafx.beans.property.IntegerProperty;
import javafx.beans.property.ReadOnlyBooleanWrapper;
import javafx.beans.property.ReadOnlyIntegerWrapper;
import javafx.beans.property.ReadOnlyStringWrapper;
import javafx.beans.property.StringProperty;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.ContentDisplay;
import javafx.scene.control.TableCell;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.cell.PropertyValueFactory;
import javafx.stage.Stage;
import javafx.util.Callback;

public class Test extends Application {

    public static void main( String[] args ) throws Exception {
        Application.launch( "Sportz Club" );
    }

    @Override
    public void start( Stage stage ) throws Exception {
        TableView<User> table = new TableView<>();
        table.getStylesheets().add(
            this.getClass().getResource( "test.css" ).toExternalForm() );

        final TableColumn<User, String> nameColumn =
        this.<String>unstyledColumn( "name" );
        nameColumn.setText( "Name" );
        table.getColumns().add( nameColumn );

        final TableColumn<User, Integer> numColumn =
        this.<Integer>unstyledColumn( "number" );
        numColumn.setMinWidth(200);
        numColumn.setText( "Number" );
        table.getColumns().add( numColumn );

        final TableColumn<User, Boolean> allowedColumn =
        this.unstyledColumn( "allowed" );
        allowedColumn .setText( "Allowed" );
        allowedColumn .setMinWidth(200);
        allowedColumn .setCellFactory( allowedCellFactory() );
        table.getColumns().add( allowedColumn );

        ObservableList<User> items = FXCollections.observableArrayList();
        items.add( new User( "guy #1", 1, true ) );
        items.add( new User( "guy #2", 2, true ) );
        items.add( new User( "Steve", 3, false ) );
        table.setItems( items );

        stage.setScene( new Scene( table, 500, 500 ) );
        stage.centerOnScreen();
        stage.show();
    }

    private Callback<TableColumn<User, Boolean>, TableCell<User, Boolean>> allowedCellFactory() {
        final Callback<TableColumn<User, Boolean>, TableCell<User, Boolean>> callback =
            new Callback<TableColumn<User, Boolean>, TableCell<User, Boolean>>() {
                @Override
                public TableCell<User, Boolean> call(
                    TableColumn<User, Boolean> arg0 ) {
                    return new TableCell<User, Boolean>() {
                        @Override
                        protected void updateItem( Boolean item, boolean empty ) {
                            super.updateItem( item, empty );
                            if ( item == null || empty ) {
                                return;
                            }
                            if ( item ) {
                                getStyleClass().remove( "invalidCell" );
                            }
                            else {
                                getStyleClass().add( "invalidCell" );
                            }
                            setContentDisplay( ContentDisplay.TEXT_ONLY );
                            setText( item.toString() );
                        };
                    };
                }
            };
        return callback;
    }

    private <S> TableColumn<User, S> unstyledColumn( String name ) {
        TableColumn<User, S> column = new TableColumn<>();
        column.setCellValueFactory( new PropertyValueFactory<User, S>( name ) );
        return column;
    }

    public static class User {

        StringProperty name;
        IntegerProperty number;
        BooleanProperty allowed;

        public User( String name, int number, boolean allowed ) {
            this.name = new ReadOnlyStringWrapper( name );
            this.number = new ReadOnlyIntegerWrapper( number );
            this.allowed = new ReadOnlyBooleanWrapper( allowed );
        }

        public StringProperty nameProperty() {
            return name;
        }

        public IntegerProperty numberProperty() {
            return number;
        }

        public BooleanProperty allowedProperty() {
            return allowed;
        }

    }
}

这是完整的代码^ 但有趣的一点是允许的细胞工厂方法,只要单元格中的值为 false,就会添加“invalidCell”样式类。

这是 css:(test.css,与上面的代码放在同一包中)

.invalidCell {
    -fx-background-color: #FFBBBB;
    -fx-text-fill: black !important;
}

.invalidCell:odd {
    -fx-background-color: #FFAAAA;
}

.invalidCell:hover {
    -fx-background-color: #CCAACC;
}

.invalidCell:filled:selected:focused, .invalidCell:filled:selected, .invalidCell:selected  {
-fx-background-insets: 0, 1.4;
-fx-background-color: linear-gradient(from 0% 0% to 0% 100%, #FF6666 0%, #FF2222 100%);
}

.table-view:focused .invalidCell:filled:focused:selected:hover {
    -fx-background: -fx-accent;
    -fx-background-color: yellow;
    -fx-background-insets: 0, 1, 2;
    -fx-text-fill: -fx-selection-bar-text;
}

运行应用程序时可以看出,问题在于“允许”列在其余部分没有更改样式时row悬停。当您将鼠标悬停在允许的列本身上时,它会更改颜色以匹配 :hover 伪类。

我希望它做的是当行悬停在上面时允许的列与所有其他列一起更改。

有任何想法吗?


从 CSS 文件中删除以下样式代码

.invalidCell:hover {
   -fx-background-color: #CCAACC;
} 
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

JavaFX 2.2:设置表格单元格样式并处理行伪类(悬停、选定等) 的相关文章