javafx - 向 JavaFX 上下文菜单添加标题

Question

是否可以向 JavaFX TableView ContextMenu 添加标题？

现在，我添加了一个 MenuItem，我已将其标记为禁用(通过 menuTitle.setDisable(true))，但它使用一些样式设置(不透明度)呈现)，我还没有想出如何覆盖。

代码示例 -

import java.util.function.Function;
import java.util.stream.IntStream;

import javafx.application.Application;
import javafx.beans.property.BooleanProperty;
import javafx.beans.property.IntegerProperty;
import javafx.beans.property.SimpleBooleanProperty;
import javafx.beans.property.SimpleIntegerProperty;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
import javafx.beans.value.ObservableValue;
import javafx.scene.Scene;
import javafx.scene.control.CheckMenuItem;
import javafx.scene.control.ContextMenu;
import javafx.scene.control.MenuItem;
import javafx.scene.control.SeparatorMenuItem;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableRow;
import javafx.scene.control.TableView;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;

public class TableWithContextMenu extends Application {

    @Override
    public void start(Stage primaryStage) {
        TableView<Item> table = new TableView<>();
        table.getColumns().add(column("Item", Item::nameProperty));
        table.getColumns().add(column("Value", Item::valueProperty));

        BooleanProperty globalSelection = new SimpleBooleanProperty();

        table.setRowFactory(t -> {
            TableRow<Item> row = new TableRow<>();
            ContextMenu contextMenu = new ContextMenu();
            MenuItem menuTitle = new MenuItem("Menu Title");
            menuTitle.setDisable(true);

            MenuItem item2 = new MenuItem("Do something else");
            item2.setOnAction(e -> System.out.println("Do something else with " + row.getItem().getName()));

            CheckMenuItem item3 = new CheckMenuItem("Global selection");
            item3.selectedProperty().bindBidirectional(globalSelection);

            contextMenu.getItems().addAll(menuTitle, item2, new SeparatorMenuItem(), item3);

            row.emptyProperty().addListener((obs, wasEmpty, isEmpty) -> {
                if (isEmpty) {
                    row.setContextMenu(null);
                } else {
                    row.setContextMenu(contextMenu);
                }
            });
            return row ;
        });

        IntStream.rangeClosed(1, 25).mapToObj(i -> new Item("Item "+i, i)).forEach(table.getItems()::add);

        primaryStage.setScene(new Scene(new BorderPane(table), 800, 600));
        primaryStage.show();
    }

    private <S,T> TableColumn<S,T> column(String title, Function<S, ObservableValue<T>> property) {
        TableColumn<S,T> col = new TableColumn<>(title);
        col.setCellValueFactory(cellData -> property.apply(cellData.getValue()));
        return col ;
    }

    public static class Item {
        private final IntegerProperty value = new SimpleIntegerProperty();
        private final StringProperty name = new SimpleStringProperty();

        public Item(String name, int value) {
            setName(name);
            setValue(value);
        }

        public final IntegerProperty valueProperty() {
            return this.value;
        }

        public final int getValue() {
            return this.valueProperty().get();
        }

        public final void setValue(final int value) {
            this.valueProperty().set(value);
        }

        public final StringProperty nameProperty() {
            return this.name;
        }

        public final String getName() {
            return this.nameProperty().get();
        }

        public final void setName(final String name) {
            this.nameProperty().set(name);
        }


    }

    public static void main(String[] args) {
        launch(args);
    }
}

编辑下面发布的解决方案适用于此示例。但是，在处理多个 FXML 时，除非我清除样式类然后应用自定义样式，否则它不起作用。我已经发布了我的工作代码 here这说明了这个问题。

Answer 1

禁用的 MenuItem 的不透明度在 CSS 样式类 menu-item:disabled 中指定。要完全消除不透明度，您还需要在名为 menu-item:disabled .label 的已禁用 MenuItem 中覆盖 Label 的样式类>。只需在您自己的 css 文件中自己指定即可覆盖该样式:

例子:

.menu-item:disabled {
    -fx-opacity: 1.0;
}

.menu-item:disabled .label {
    -fx-opacity: 1.0;
}

您可能不希望其他不应该是标题的禁用菜单项具有相同的样式。在这种情况下，您可以将样式类添加到标题 MenuItem:

ContextMenu contextMenu = new ContextMenu();
MenuItem titleItem = new MenuItem("Title");
titleItem.setDisable(true);
titleItem.getStyleClass().add("context-menu-title");

然后 css 将是:

.context-menu-title:disabled {
    -fx-opacity: 1.0;
}

.context-menu-title:disabled .label {
    -fx-opacity: 1.0;
}

编辑:您可能不希望标题与其余菜单项具有相同的 :hover 样式。这可以通过为标题 MenuItem 设置 :disabled:hover 来解决。例如:

.context-menu-title:disabled:hover {
    -fx-background-color: white;
}

.context-menu-title:disabled:hover .label {
    -fx-background-color: white;
    -fx-text-fill: black;
}