Question

我正在使用自定义ListCells（CellFactory）创建一个自定义ListView。这个自定义单元格是从一个带有面板的fxml文件中获取的。现在，此面板具有固定的背景色，但是我想在选择此单元格时更改此面板的背景。

在CSS中，我只能更改整个单元格的背景，而不能更改内容的背景。

也许你给我一些小费。

编辑：这是一个最小的示例：选择单元格时，面板的背景应变为蓝色。

 public class Main extends Application {

    public static void main(String[] args) {
        launch(args);
    }

    @Override
    public void start(Stage primaryStage) throws Exception{
        BorderPane root = new BorderPane( );

        ListView listview = new ListView<String>(  );
        ObservableList<String> items = FXCollections.observableArrayList (
            "String1", "String2", "String3", "String4");
        listview.setItems(items);

        listview.setCellFactory(new Callback<ListView<String>, ListCell<String>>() {
                                    @Override
                                    public ListCell<String> call(ListView<String> list) {
                                        return new CustomRectCell();
                                    }
                                }
        );

        root.setCenter( listview );
        primaryStage.setScene(new Scene(root, 300, 275));
        primaryStage.show();
    }

    static class CustomRectCell extends ListCell<String> {
        @Override
        public void updateItem(String item, boolean empty) {
            super.updateItem(item, empty);
            Pane rect = new Pane();
            if (item != null) {

                // This does not work
                if(isSelected())
                    rect.setStyle( "-fx-background-color: Blue;" );
                else
                    rect.setStyle( "-fx-background-color: Red;" );

                setGraphic(rect);

            }
        }
    }
}

Answer 1

CustomRectCell不能正常工作有两个原因：

选择与项目无关
您永远不会删除graphic，因此，单元格为空（例如，如果减少了项目数），单元格将保持填充状态。

您可以覆盖updateSelected来分配背景色：

static class CustomRectCell extends ListCell<String> {

    private final Pane rect = new Pane();

    {
        // initialize with default background
        rect.setStyle("-fx-background-color: Blue;");
    }

    @Override
    public void updateItem(String item, boolean empty) {
        super.updateItem(item, empty);

        setGraphic((empty || item == null) ? null : rect);
    }

    @Override
    public void updateSelected(boolean selected) {
        super.updateSelected(selected);
        rect.setStyle(selected ? "-fx-background-color: Red;" : "-fx-background-color: Blue;");
    }
}

或者，您可以在场景中添加CSS样式表并将其用于样式设置：

static class CustomRectCell extends ListCell<String> {

    private final Pane rect = new Pane();

    {
        rect.getStyleClass().add("rect");
    }

    @Override
    public void updateItem(String item, boolean empty) {
        super.updateItem(item, empty);

        setGraphic((empty || item == null) ? null : rect);
    }
}

CSS样式表

.list-cell .rect {
    -fx-background-color: blue;
}

.list-cell:selected .rect {
    -fx-background-color: red;
}

选择颜色JavaFx ListView

1 个答案: