在JavaFX中製作垂直菜單欄

Question

由於我與計算機交互，我只看到水平方向的菜單欄。這種菜單欄的菜單項將向下彈出。在JavaFX中，使用水平菜單欄很容易創建這樣的菜單。

是否可以在JavaFX中創建垂直菜單欄？另外，我希望菜單項可以向左或向右彈出，而不是向下彈出。

我可以實現我的願望這樣的菜單嗎？有人請幫忙。

Answer 1

您可以利用MenuButton爲：

@Override 
public void start(Stage primaryStage) { 
    MenuButton m = new MenuButton("Eats"); 
    m.setPrefWidth(100); 
    m.setPopupSide(Side.RIGHT); 
    m.getItems().addAll(new MenuItem("Burger"), new MenuItem("Hot Dog")); 

    MenuButton m2 = new MenuButton("Drinks"); 
    m2.setPrefWidth(100); 
    m2.setPopupSide(Side.RIGHT); 
    m2.getItems().addAll(new MenuItem("Juice"), new MenuItem("Milk")); 

    VBox root = new VBox(); 
    root.getChildren().addAll(m, m2); 

    Scene scene = new Scene(root, 300, 250); 
    scene.getStylesheets().add(getClass().getResource("style.css").toExternalForm()); 
    primaryStage.setScene(scene); 
    primaryStage.show(); 
} 

其中的style.css是

.menu-button { 
    -fx-skin: "com.sun.javafx.scene.control.skin.MenuButtonSkin"; 
    -fx-background-color: red, green, green, lightgreen; 
    -fx-background-insets: 0 0 -1 0, 0, 1, 2; 
    -fx-background-radius: 0; 
    -fx-padding: 0.0em; /* 0 */ 
    -fx-text-fill: -fx-text-base-color; 
} 

/* TODO workaround for RT-19062 */ 
.menu-button .label { -fx-text-fill: -fx-text-base-color; } 

.menu-button:focused { 
    -fx-color: beige; 
    -fx-background-color: -fx-focus-color, -fx-outer-border, -fx-inner-border, -fx-body-color; 
    -fx-background-insets: -1.4, 0, 1, 2; 
    -fx-background-radius: 0; 
} 

.menu-button:hover { 
    -fx-color: darkgreen; 
} 

.menu-button:armed { 
    -fx-color: greenyellow; 
} 

這些選擇是部分截斷並從caspian.css覆蓋。根據需要更改顏色首選項，還可以通過css刪除按鈕的箭頭。

這種方法的缺點是製作嵌套菜單項的困難。