JavaFX: Comment puis-je cacher la « flèche déroulante » dans un TreeView?

geekTechnique:

tout le monde l'espoir se porte bien.

Ma question est assez basique: Comment puis-je faire la flèche à la racine d'un TreeView caché, s'il est possible? Un bon exemple de ce que je veux obtenir peut être vu dans Observateur d'événements Windows.

Alors que mes applications JavaFX ressemble à l'image ci-dessous

Par défaut, cette flèche à côté de véhicules est présent.

J'ai lu la documentation ici , mais je ne trouve .showRoot (), qui ne parvient pas à ce que je veux. Je voudrais vraiment apprécier toute entrée, même si elle est un moyen de triche pour le faire ( en utilisant la propriété x offset traversé mon esprit).

Slaw:

La flèche fait partie du disclosureNodedu TreeCell. Lorsqu'ils ne sont pas spécifiées , il est de la responsabilité du TreeCellde la peau pour fournir un noeud de communication par défaut (par exemple , le triangle). Ceci est indiqué par la documentation setter de propriété:

Le noeud à utiliser comme triangle « de communication », ou bascule, utilisé pour l'expansion et l'effondrement des éléments. Ceci est utilisé dans le cas d'un élément dans l'arborescence qui contient les éléments enfants. Si non spécifié, la mise en œuvre de la peau du treecell est responsable de fournir un nœud de communication par défaut.

Pourtant , en regardant le TreeCellSkinil semble qu'il ne fournit le nœud de communication par défaut. Cela semble plutôt être traitée par le TreeViewSkin(dans les deux JavaFX JavaFX 8 et 11). En regardant la mise en œuvre du noeud de communication par défaut est StackPaneun enfant StackPanequi fonctionne comme la flèche réelle. Leur classe de style est tree-disclosure-nodeet arrow, respectivement. Notez que cela ne semble pas documenté nulle part, y compris le JavaFX CSS Guide de référence .

Le plus simple et la moins de bug sujettes à cacher le nœud de communication racine est, à mon avis, utiliser les CSS. Le seul problème ici est que TreeCellfournit aucun moyen de cibler uniquement la cellule racine. Mais cela peut encore être accompli par le sous - classement TreeCellet de fournir notre propre PseudoClass. Ensuite , nous avons mis le cellFactorynotre TreeView.

Pour définir l'image de la racine définir la TreeItem.graphicpropriété de la racine TreeItem.

---

CustomTreeCell

import javafx.beans.InvalidationListener;
import javafx.css.PseudoClass;
import javafx.scene.control.TreeCell;
import javafx.scene.control.TreeView;
import javafx.util.Callback;

public class CustomTreeCell<T> extends TreeCell<T> {

    private static final PseudoClass ROOT = PseudoClass.getPseudoClass("root");

    public static <T> Callback<TreeView<T>, TreeCell<T>> forTreeView() {
        return treeView -> new CustomTreeCell<>();
    }

    public CustomTreeCell() {
        getStyleClass().add("custom-tree-cell");

        InvalidationListener listener = observable -> {
            boolean isRoot = getTreeView() != null && getTreeItem() == getTreeView().getRoot();
            pseudoClassStateChanged(ROOT, isRoot);
        };

        treeViewProperty().addListener(listener);
        treeItemProperty().addListener(listener);
    }

    @Override
    protected void updateItem(T item, boolean empty) {
        super.updateItem(item, empty);
        if (empty || item == null) {
            setText(null);
            graphicProperty().unbind();
            setGraphic(null);
        } else {
            setText(item.toString()); // Really only works if item is a String. Change as needed.
            graphicProperty().bind(getTreeItem().graphicProperty());
        }
    }

}

Fichier CSS

.custom-tree-cell:root .tree-disclosure-node,
.custom-tree-cell:root .arrow {

    -fx-min-width: 0;
    -fx-pref-width: 0;
    -fx-max-width: 0;

    -fx-min-height: 0;
    -fx-pref-height: 0;
    -fx-max-height: 0;

}

/* Related to question asked in the comments by OP */
.custom-tree-cell > .tree-disclosure-node > .arrow {
    -fx-shape: "M 0 0 L 10 5 L 0 10 L 0 8 L 8 5 L 0 2 Z";
}

Quelques notes:

1. Depuis que je lié la TreeCell.graphicpropriété à la TreeItem.graphicpropriété dans ma mise en œuvre de cellule que vous ne serez pas en mesure de régler le graphique de CSS. Vous pouvez modifier cette option pour définir simplement le graphique, plutôt que de se lier, afin de permettre à cette fonctionnalité. Ensuite , vous ne devrez pas régler le graphique de la racine TreeItempar le code , mais pourrait le faire .custom-tree-cell:root { -fx-graphic: ...; }.
2. Cela ne supprime pas le nœud de communication, il fait juste avoir aucune largeur et aucune hauteur.
3. Cette solution repose sur les détails de mise en œuvre; soyez prudent lors de la modification des versions de JavaFX. Je ne ai essayé cela sur JavaFX 11.0.2 mais je crois que cela devrait fonctionner pour JavaFX 8 ainsi.