java - 在 TreeView 内显示 TableView>

Question

我想到的设计是这样的:有一个TreeView<E> ，其中E是一个包装类，其实现可能如下所示:

public class E {
    private int key;
    private String value;

    public E(int key, String value) {
        this.key = key;
        this.value = value;
    }

    public int getKey(){
        return key; 
    }

    public String getValue() {
        return value;
    }

    public String toString(){
        return value;
    }
}

所以TreeView<E>将包含一堆 TreeItem<E>实例。还有toString()方法E显示该值。

当你按下任何树项目时，我想要一个 TableView<ObservableList<String>>将显示在所选TreeItem<E>下方包含连接到 TreeItem<E> 的键值的数据库中的所有行.

这可能吗？我知道TreeTableView是一个不错的选择，但我不想显示任何列，除非我确实按下了树项目之一。我想要每个 TreeItem<E>拥有自己的 table 。不过，根据记录，所有表都将具有相同的列，只是行数不同。

更新:在@Uluk Biy 的帮助下，我成功实现了一个解决方案，但它包含一个错误。

问题是，当我在 TreeView 中按下 TreeItem 时，被选中的节点是第一个节点下方两步的节点，当我按下 TreeItem 时，该节点在滚动 Pane 中不可见(TreeView 自动包含滚动 Pane )。因此，如果我拉伸(stretch)窗口以隐藏少于 3 个树项目，则不会显示任何内容。这并不是 TableView 显示在错误的位置，问题是没有选择正确的树项(我知道这一点是因为我已经打印出了键值。

这是显示此错误的 SSCCE。在表中选择包装器 1，包装器 6 将被选中。如果更改 TreeView 的大小，隐藏的 TreeItem 少于三个，则不会选择任何内容。

import javafx.application.Application;
import javafx.beans.property.SimpleStringProperty;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.TreeCell;
import javafx.scene.control.TreeItem;
import javafx.scene.control.TreeView;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
import javafx.util.Callback;

public class SSCCE extends Application {

    private Stage primaryStage;
    private AnchorPane rootLayout;
    private TreeView<Wrapper> overview; 

    public void start(Stage primaryStage) {
        this.primaryStage = primaryStage;
        this.primaryStage.setTitle("SSCCE");

        initRootLayout();
        showTreeView();
    }

    public void initRootLayout() {
        rootLayout = new AnchorPane();
        rootLayout.setPrefSize(300, 200);

        Scene scene = new Scene(rootLayout);
        primaryStage.setScene(scene);

        primaryStage.show();
    }       

    ObservableList<String> columns = FXCollections.observableArrayList();
    ObservableList<ObservableList<String>> data = FXCollections.observableArrayList();
    ObservableList<Wrapper> items = FXCollections.observableArrayList();

    private void showTreeView() {

        // Dummy values
        columns.addAll("key", "text");              
        data.add(FXCollections.observableArrayList("1", "test"));
        data.add(FXCollections.observableArrayList("1", "test2"));
        data.add(FXCollections.observableArrayList("2", "test3"));
        data.add(FXCollections.observableArrayList("2", "test4"));
        data.add(FXCollections.observableArrayList("3", "test5"));
        data.add(FXCollections.observableArrayList("3", "test6"));
        data.add(FXCollections.observableArrayList("4", "test7"));
        data.add(FXCollections.observableArrayList("4", "test8"));
        data.add(FXCollections.observableArrayList("5", "test9"));
        data.add(FXCollections.observableArrayList("5", "test10"));
        data.add(FXCollections.observableArrayList("6", "test11"));
        data.add(FXCollections.observableArrayList("6", "test12"));
        items.addAll(new Wrapper(1, "wrapper 1"), new Wrapper(2, "wrapper 2"), new Wrapper(3, "wrapper 3"), new Wrapper(4, "wrapper 4"), new Wrapper(5, "wrapper 5"), new Wrapper(6, "wrapper 6"));

        TreeItem<Wrapper> root = new TreeItem<Wrapper>();
        overview = new TreeView<Wrapper>(root);
        overview.setPrefHeight(75);

        overview.setCellFactory(new Callback<TreeView<Wrapper>, TreeCell<Wrapper>>() {
            @Override
            public TreeCell<Wrapper> call(TreeView<Wrapper> stringTreeView) {
                TreeCell<Wrapper> treeCell = new TreeCell<Wrapper>() {
                    @Override
                    protected void updateItem(Wrapper item, boolean empty) {
                        super.updateItem(item, empty);
                        if (empty || item == null) {
                            setText(null);
                            setGraphic(null);
                        } else {
                            if (getTreeItem().isLeaf() && isSelected()) {
                                setText(null);

                                // A debug text that proves that the wrong item is being selected.
                                System.out.println("Selected wrapper: " + item);

                                TableView<ObservableList<String>> table = new TableView<ObservableList<String>>();
                                for (int i = 0; i < columns.size(); i++) {
                                    final int j = i;

                                    TableColumn<ObservableList<String>, String> column = new TableColumn<ObservableList<String>, String>(
                                            columns.get(i));

                                    column.setCellValueFactory((
                                            TableColumn.CellDataFeatures<ObservableList<String>, String> param) -> new SimpleStringProperty(
                                            param.getValue().get(j)
                                                    .toString()));

                                    table.getColumns()
                                            .add(column);
                                }

                                ObservableList<ObservableList<String>> selected_data = FXCollections
                                        .observableArrayList();

                                for(int i = 0; i < data.size(); i++) {

                                    if(Integer.parseInt(data.get(i).get(0)) == item.getKey()) {
                                        selected_data.add(data.get(i));
                                    }
                                }
                                table.setItems(selected_data);

                                VBox vbox = new VBox(new Label(item
                                        .getValue()), table);
                                setGraphic(vbox);
                            } else {
                                setText(item.getValue());
                                setGraphic(null);
                            }
                        }
                    }
                };
                return treeCell;
            }
        });

        for (int i = 0; i < items.size(); i++) {
            TreeItem<Wrapper> target = new TreeItem<Wrapper>(items.get(i));
            root.getChildren().add(target);
        }

        overview.setShowRoot(false);
        rootLayout.getChildren().add(overview);

    }

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

class Wrapper {
    private int key;
    private String value;

    Wrapper(int key, String value) {
        this.key = key;
        this.value = value;
    }

    int getKey() {
        return key;
    }

    String getValue() {
        return value;
    }

    public String toString() {
        return "Wrapper " + key;
    }
}

Answer 1

设置自定义单元工厂不是一种可行的方法。因为单元格被重用来渲染多个项目，所以如果最初所有单元格在 TreeView 的视口(viewport)中都可见，则仅默认选择一个项目将不会触发单元格的重用，因此不会调用 updateItem()。另一方面，如果视口(viewport)之外还有其他项目，并且用户向下滚动到它们，则上方不可见项目的单元格将被重用以渲染新进入视口(viewport)的项目下方。这在我看来是对下面评论中描述的行为的解释。简而言之，定义自定义 TreeCell 不是正确的方法，相反，我们可以观察项目选择的变化并在其中设置图形:

treeView.getSelectionModel().selectedItemProperty().addListener( ( ObservableValue<? extends TreeItem<Wrapper>> observable,
        TreeItem<Wrapper> oldValue, TreeItem<Wrapper> newValue ) ->
        {
            System.out.println( "Selected newValue: " + newValue );

            if ( oldValue != null )
            {
                // hide graphic of previous selected item
                oldValue.setGraphic( null );
            }

            if ( newValue != null )
            {
                TableView<ObservableList<String>> table = new TableView<>();
                for ( int i = 0; i < columns.size(); i++ )
                {
                    final int j = i;

                    TableColumn<ObservableList<String>, String> column = new TableColumn<>(
                            columns.get( i ) );

                    column.setCellValueFactory( (
                                    TableColumn.CellDataFeatures<ObservableList<String>, String> param ) -> 
                            new SimpleStringProperty( param.getValue().get( j ) ) );

                    table.getColumns().add( column );
                }

                ObservableList<ObservableList<String>> selected_data = FXCollections
                .observableArrayList();

                for ( int i = 0; i < data.size(); i++ )
                {
                    if ( Integer.parseInt( data.get( i ).get( 0 ) ) == newValue.getValue().getKey() )
                    {
                        selected_data.add( data.get( i ) );
                    }
                }
                table.setItems( selected_data );
                VBox vbox = new VBox( new Label( newValue.getValue().getValue() ), table );
                newValue.setGraphic( vbox );
            }
        } );

并且不设置treeView.setCellFactory(...)。现在的问题是如何隐藏项目的文本。