在 JavaFX2 中使用 css 定位 MenuButton 的 ContextMenu

Question

我正在搜索如何在 css 中设置 MenuButton 的上下文菜单的坐标，但没有找到实现的方法。我想从实际位置降低 Conext 菜单，如附加的示例图像，如果可能的话，也可以向上箭头。看看我的代码。

FXML

<MenuButton layoutX="1046.0" layoutY="38.0" mnemonicParsing="false" prefHeight="30.0" prefWidth="30.0" styleClass="notification-button">
   <graphic>
      <Pane>
         <children>
            <Circle fill="#db5344" layoutX="20.0" radius="10.0" stroke="BLACK" strokeType="OUTSIDE" strokeWidth="2.0" />
            <Label alignment="CENTER" contentDisplay="CENTER" layoutX="12.3" layoutY="-8.5" prefHeight="10.0" prefWidth="15.0" text="0" textAlignment="CENTER" />
         </children>
      </Pane>
   </graphic>
   <items>
      <MenuItem mnemonicParsing="false" text="Sample" />
   </items>
</MenuButton>

CSS

.menu-button > .arrow-button {
    -fx-padding: 0;
}
.menu-button > .arrow-button > .arrow {
    -fx-padding: 0;
}
.menu-item {
    -fx-padding: 10;
}
.menu-item .label {
    -fx-text-fill: white;
}
.menu-item:focused {
    -fx-background-color: darkgray;
}
.menu-item:focused .label {
    -fx-text-fill: blue;
}
.menu-item .label {
    -fx-text-fill: yellow;
}
.menu-item:focused .label {
    -fx-text-fill: white;
}
.context-menu {
    -fx-skin: "com.sun.javafx.scene.control.skin.ContextMenuSkin";
    -fx-text-fill: white;
    -fx-background-color: #006699;
    -fx-background-insets: 0, 1, 2;
    -fx-background-radius: 0 6 6 6, 0 5 5 5, 0 4 4 4;
    -fx-padding: 10px;
}
.context-menu .separator {
    -fx-padding: 10;
}
.context-menu .container {
    -fx-padding: 10;
}
.context-menu .scroll-arrow {
    -fx-padding: 10;
    -fx-background-color: #006699;
}
.context-menu .scroll-arrow:hover {
    -fx-background: -fx-accent;
    -fx-background-color: #006699;
    -fx-text-fill: -fx-selection-bar-text;
}
.context-menu:show-mnemonics .mnemonic-underline {
    -fx-stroke: -fx-text-fill;
}

下面的附图将帮助您理解我的问题。第一张图片是我当前代码的输出，第二张和第三张图片是我想要的。第二张和第三张图片均用于网页下拉菜单的自定义样式。我可以在 JavaFX2 中实现相同的功能吗？

如你所见我的fxml代码，我在里面使用了MenuButton和MenuItem。如果您认为这没有帮助。请告诉我其他获取方式。

Answer 1

好吧，我相信有很多开发人员知道如何做到这一点。可能是他们没有时间解决这个问题或者没有意识到我的问题。

顺便说一句，我在这后面浪费了将近2天的时间。但很高兴我能够解决这个问题。

在 JavaFX2 中使用 css 定位 MenuButton 的 ContextMenu

Positioning MenuButton's ContextMenu using css in JavaFX2

css

java

javafx-2

FXML

CSS