如何更改菜单项的聚焦/悬停颜色

Question

我想要改变菜单项的高亮/聚焦/悬停颜色。

我想把蓝色背景改为其他颜色，但似乎没有任何效果？

我尝试了一些方法，但都没有成功，包括：如何使用CSS设置JavaFX ContextMenu的样式？和如何为菜单按钮和菜单项设置样式

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

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

.menu:focused {
    -fx-background-color:white;
    -fx-focus-color:white;
}

还有许多其他变体...

另外，这里有一些使用菜单项的示例代码

// Menu
final ContextMenu contextMenu = new ContextMenu();

并构建一个菜单项：

maximizeMenuItem = new MenuItem(Config.getString("Maximize"));
maximizeMenuItem.setOnAction(new EventHandler<ActionEvent>() { /* do stuff */ }

我可以尝试：

contextMenu.setStyle("-fx-focus-color:white");

或者

maximizeMenuItem.setStyle("-fx-focus-color:white");

但我似乎无法找出哪个-fx- css标签控制那个蓝色背景颜色...

如有可能，请同时发布FXML解决方案和行内代码解决方案。

- SnakeDoc

---

最好在fiddle上发布代码。 - 井R3Naiz0

你尝试过将所有的“-fx-background-color: #006699;”更改为另一种颜色吗？ - 井R3Naiz0

是的，如果我执行 contextMenu.setStyle("-fx-background-color:white");，它会使背景变白，但当您悬停在其中一个菜单项上时，它仍然是蓝色的。所以我猜我缺少哪个 fx css 标签需要使用？ - SnakeDoc

是否有“.menu-item:hover”属性...我似乎记得读到过什么？ - Paulie_D

试着查看默认JavaFx样式表中的菜单项样式。使该项变蓝的任何内容都应该在其中。链接 - Brendan

Answer 1

好的，有点尴尬。我的图层混乱，导致样式表没有按照我想象中的应用。

因此，正确的方法来更改menu-item在聚焦时的背景颜色是：

.menu-item:focused {
     -fx-background-color: #969A9F;
}

一旦我解决了CSS层叠问题，并对其进行排序，现在它按预期工作，结果如下图：

- SnakeDoc