下拉按钮弹出窗口中的JavaFX CheckBoxTree

Question

为了让最终用户将搜索限制在主 TableView 的某些列中，我需要一个带有复选框的树视图。我决定将此 TreeView 嵌入弹出窗口中，在单击自定义按钮时显示。

我创建了以下 class，灵感来自这个问题： Java FX8 TreeView in a table cell

public class CustomTreeMenuButton extends MenuButton {
    private PopupControl popup = new PopupControl();
    private TreeView<? extends Object> tree;
    private CustomTreeMenuButton me = this;

    public void setTree(TreeView<? extends Object> tree) {
        this.tree = tree;
    }

    public CustomTreeMenuButton() {
        super();
        this.addEventHandler(MouseEvent.MOUSE_CLICKED, new EventHandler<MouseEvent>() {

            @Override
            public void handle(MouseEvent event) {
                if (!popup.isShowing()) {

                    Bounds b = me.localToScreen(me.getBoundsInLocal());
                    double x = b.getMinX();
                    double y = b.getMaxY();

                    popup.setAutoHide(true);
                    // popup.setAutoFix(true);
                    popup.setAnchorX(x);
                    popup.setAnchorY(y);

                    popup.setSkin(new Skin<Skinnable>() {
                        @Override
                        public void dispose() {
                        }

                        @Override
                        public Node getNode() {
                            return tree;
                        }

                        @Override
                        public Skinnable getSkinnable() {
                            return null;
                        }
                    });

                    popup.show(me.getScene().getWindow());
                }
            }
        });
    }
}

我正在使用的树包含 CheckBoxTreeItem 个对象，当弹出窗口工作时，只要焦点不在复选框上，所有复选框就会出现一些奇怪的模糊。（见下面的 GIF）

首先，我认为这可能是抗锯齿问题，但是 popup.getScene().getAntiAliasing().toString() returns DISABLED

然后，我看到非整数锚点可能会导致问题。然而 popup.setAutoFix(true) 什么也没做，以下也没有做：

popup.setAnchorX(new Double(x).intValue());
popup.setAnchorY(new Double(y).intValue());

可能值得注意的是，我正在使用 FXML。

无论焦点如何，我怎样才能得到清晰的复选框？

Answer 1

我建议使用内置控件 CustomMenuItem，而不是重新发明轮子：

A MenuItem that allows for arbitrary nodes to be embedded within it, by assigning a Node to the content property.

一个例子

// Create the tree
CheckBoxTreeItem<String> rootItem = new CheckBoxTreeItem<String>("All stuff");
rootItem.setExpanded(true);                  

final TreeView<String> tree = new TreeView<String>(rootItem);  
tree.setEditable(true);

tree.setCellFactory(CheckBoxTreeCell.<String>forTreeView());    
for (int i = 0; i < 8; i++) {
    final CheckBoxTreeItem<String> checkBoxTreeItem = 
            new CheckBoxTreeItem<String>("Stuff" + (i+1));
    rootItem.getChildren().add(checkBoxTreeItem);                
}

tree.setRoot(rootItem);
tree.setShowRoot(true);

// Create a custom menu item
CustomMenuItem customMenuItem = new CustomMenuItem(tree);
customMenuItem.setHideOnClick(false);

// Create the menu button
MenuButton mb = new MenuButton("Stuffs");
mb.getItems().add(customMenuItem);

并输出

注意：重要的是将hideOnClickProperty设置为true，以避免用户在树中单击时关闭，这可以是均匀的在构造函数中完成，因此您可以将初始化缩短为：

CustomMenuItem customMenuItem = new CustomMenuItem(tree, false);

如果你想去除悬停发光，可以添加以下内容CSS class:

.menu-item {
    -fx-padding: 0;
}

下拉按钮弹出窗口中的JavaFX CheckBoxTree

JavaFX CheckBoxTree in popup of drop-down Button

java

checkbox

treeview

javafx

antialiasing