实现路径导航栏（Breadcrumb bar）控件

Question

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

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

我的问题：什么 Nodes/Controls 最适合这种方法？（不需要完整的代码。只需提及控件的名称）。

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

谢谢。

Answer 1

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

Answer 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
    }
});

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

实现路径导航栏（Breadcrumb bar）控件

Implement Path Navigation bar (Breadcrumb bar) control

javafx

breadcrumbs

navigationbar