实现路径导航栏（面包屑栏）控件[关闭]答案

【问题标题】：Implement Path Navigation bar (Breadcrumb bar) control [closed]实现路径导航栏（面包屑栏）控件[关闭]
【发布时间】：2016-11-17 15:13:17
【问题描述】：

我想生成一个用户界面，用户可以在其中导航树结构的路径。这是我想要的示例，取自 JavaFX Scene Builder。

根据 TreeView 中的实际位置，此 UI 会更新。通过单击单个项目，树会更新。

我的问题：哪些节点/控件最适合这种方法？（不需要完整的代码。只需提及控件的名称即可）。

我的第一个想法是生成一排彼此靠近的按钮，但也许有更好的想法。

谢谢。

【问题讨论】：

这个问题可能太宽泛了，因为有很多不同的方法可以做到这一点。我假设您的意思是TreeView，而不是TableView？我可能会在单个ToggleGroup 中尝试使用ToggleButtons。您可以使用ToggleGroup 的selectedToggleProperty 注册一个侦听器以更新树中的选择，并使用树的选择模型注册一个侦听器以选择特定的ToggleButton。
谢谢。你是对的，我的意思是TreeView。我去看看ToggleButton。
在线查看JavaFX ESSEMBLES。

标签： javafx navigationbar breadcrumbs

【解决方案1】：

你可以使用ControlsFx的BreadCrumbBar

Pane root = ...
Label selectedCrumbLbl = new Label();

BreadCrumbBar<String> sampleBreadCrumbBar = new BreadCrumbBar<>();
root.getChildren().addAll(sampleBreadCrumbBar, selectedCrumbLbl);

TreeItem<String> model = BreadCrumbBar.buildTreeModel("Hello", "World", "This", "is", "cool");
sampleBreadCrumbBar.setSelectedCrumb(model);

sampleBreadCrumbBar.setOnCrumbAction(new EventHandler<BreadCrumbBar.BreadCrumbActionEvent<String>>() {
        @Override public void handle(BreadCrumbActionEvent<String> bae) {
            selectedCrumbLbl.setText("You just clicked on '" + bae.getSelectedCrumb() + "'!");
        }
});

https://github.com/controlsfx/controlsfx/blob/master/controlsfx-samples/src/main/java/org/controlsfx/samples/button/HelloBreadCrumbBar.java

【讨论】：

【解决方案2】：

选择的解决方案对我不起作用。我不得不听selectedCrumbProperty。

TreeItem<String> helloView = new TreeItem("Hello");
TreeItem<String> worldView = new TreeItem("World");
hellowView.getChildren().add(worldView);
TreeItem<String> thisView = new TreeItem("This");
worldView.getChildren().add(thisView);
TreeItem<String> isView = new TreeItem("is");
thisView.getChildren().add(isView);
BreadCrumbBar<String> sampleBreadCrumbBar = new BreadCrumbBar<>(helloView);
sampleBreadCrumbBar.setSelectedCrumb(helloView);

sampleBreadCrumbBar.selectedCrumbProperty().addListener((observable, oldValue, newValue) -> { 
    System.out.println(newValue);
    if (newValue == worldView) {
        //load this view
    }
});

我直接在答案中输入了这个。可能有错误。留言。

【讨论】：