JavaFX - 摆脱“CustomMenuItem”蓝色突出显示？

Question

当悬停在 ContextMenu 实现上时，我一直在努力删除蓝色突出显示。

private void attachContextMenu() {
    CustomMenuItem item = FilterPanel.getInMenuItem(this);
    ContextMenu contextMenu = new ContextMenu();
    contextMenu.getItems().add(item);


    tableColumn.setContextMenu(contextMenu);
}

通过包含VBox，我能够将其涂成白色并消除大部分蓝色闪光。

filterVBox.setStyle("-fx-background-color: white;");

但我不知道如何让CustomerMenuItem 在用鼠标聚焦时失去蓝色边框。我尝试了以下方法，但它不起作用

CustomMenuItem item = FilterPanel.getInMenuItem(this);
item.setStyle("-fx-text-fill: white;");

如果你想要完整的图片，这里是PR，但是有人知道我可以如何操纵它来消失吗？

我可以通过使用这个 CSS 为整个 TableView 设计每个 MenuItem 来消除它。但我想将它专门应用于just CustomMenuItem。

.menu-item:focused {
   -fx-background-color: transparent;
}

Answer 1

由于在 ContextMenu 获得焦点时会出现蓝色突出显示，因此您在此处处理的是 Pseudoclass。在 CSS 中，伪类用于定义节点的特定状态。典型的状态是悬停、选择、聚焦...

解决此问题的方法是添加一个 CSS 文件，您可以在其中轻松地将样式设置应用于任何可能的状态。

首先，将样式类应用到您的ContextMenu（这样使用上下文菜单的其他控件就不会受到这些设置的影响）。比如column-filter:

private void attachContextMenu() {
    CustomMenuItem item = FilterPanel.getInMenuItem(this);

    ContextMenu contextMenu = new ContextMenu();
    contextMenu.getStyleClass().add("column-filter");

    contextMenu.getItems().add(item);
    tableColumn.setContextMenu(contextMenu);
}

然后将所需的样式规则添加到一个 css 文件中：

style.css

.column-filter .context-menu {
    -fx-background-color: white;
}

.column-filter .context-menu:focused {
    -fx-background-color: white;
}

.column-filter .custom-menu-item {
    -fx-background-color: white;
    -fx-padding: 0;
}

.column-filter .custom-menu-item:focused {
    -fx-background-color: white;
}

最后你需要将这个样式表应用到场景中：

scene.getStylesheets().add(getClass().getResource("style.css").toExternalForm());

你会摆脱高光。