JavaFX：通过 CSS 设置 MenuItem 的 Icon/Graphic

Question

我想通过CSS设置一个MenuItem的图标。我搜索了很多，尝试了很多，现在都没有成功。

这是一个 FXML 小例子：

<MenuBar>
  <menus>
    <Menu text="File">
      <items>
        <MenuItem text="Open" styleClass="iconOpen" />
        <MenuItem text="Save" />
        <MenuItem text="Exit" />
      </items>
    </Menu>
  </menus>
</MenuBar>

在 CSS 我使用：

.iconOpen {
  -fx-background-color: red;
  -fx-graphic: url("open.png");
}

因此，MenuItem 只有红色背景色。但是没有图标。

我可以直接在 FXML 中将图标集成为 MenuItem 的 ImageView，但是我无法通过 CSS 设置它的样式。但我想将样式 (css) 与结构 (fxml) 分开。

也许有人可以给我提示。我不知道我在这里做错了什么。

非常感谢！

Answer 1

如果您查看 CSS Reference Guide，您会注意到 -fx-graphic 仅用于 Label 和 ToolTip 节点。

所以这会起作用：

.iconOpen  {
    -fx-background-color: red;
}
.iconOpen > .label {
    -fx-graphic: url("lock24.png");
}

因为您正在为菜单项的标签设置图形。

JavaFX：通过 CSS 设置 MenuItem 的 Icon/Graphic

JavaFX: Set Icon/Graphic of MenuItem by CSS

css

javafx

fxml