Question

在尝试CSS样式TreeView时，我遇到了这个奇怪的问题此TreeView是可过滤的，仅显示我正在寻找的项目这是在没有任何过滤的情况下显示树时的外观

当有过滤活动时，这就是它的样子

我希望所有展开的节点都有彩色背景（本例中为绿色）所以我添加了一个包含以下代码的样式表

.search-tree .tree-cell:expanded {
    -fx-background-color: green;
    -fx-text-fill: white;
}

但是正如您所看到的，即使没有任何内容，第二张图像中的空单元格仍然是彩色的我还用ScenicView检查了组件，而且pseudoClassState仍然是“扩展”的。

有没有人知道为什么这个空单元格仍然处于这种状态？

以下是我使用的示例代码：

import java.io.File;
import java.util.ArrayList;

import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.scene.Scene;
import javafx.scene.control.TextField;
import javafx.scene.control.TreeItem;
import javafx.scene.control.TreeView;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class TreeTest extends Application {
    TreeView<Object> t;
    private TextField searchField;
    private TreeViewHelper helper;

    @Override
    public void start(Stage s) throws Exception {
        helper = new TreeViewHelper();
        t = new TreeView<>();
        t.getStyleClass().add("search-tree");
        TreeItem rootItem = new TreeItem("");

        TreeItem cars = new TreeItem("Cars");
        cars.getChildren().addAll(helper.getCars());
        cars.setExpanded(true);

        TreeItem buses = new TreeItem("Buses");
        buses.getChildren().addAll(helper.getBuses());
        buses.setExpanded(true);
        rootItem.setExpanded(true);
        rootItem.getChildren().add(cars);
        rootItem.getChildren().add(buses);
        t.setRoot(rootItem);
        t.setShowRoot(false);
        VBox root = new VBox();
        root.getChildren().add(t); 
        searchField = new TextField();
        searchField.textProperty().addListener(new ChangeListener<String>() {

            @Override
            public void changed(ObservableValue<? extends String> prop, String lastValue, String v) {

                scanItems();
            }
        });
        root.getChildren().add(searchField); 
        Scene scene = new Scene(root,400,400);
        scene.getStylesheets().add(new File("style.css").toURI().toURL().toExternalForm());
        s.setScene(scene);
        s.show();     
    }

    void scanItems()
    {
        t.getRoot().getChildren().clear();

        TreeItem cars = new TreeItem("Cars");
        helper.getCars().stream().filter(e -> e.getValue().toString().toLowerCase().contains(searchField.getText().toLowerCase()))
            .forEach(item -> cars.getChildren().add(item));
        t.getRoot().getChildren().add(cars);
        cars.setExpanded(true);

        TreeItem buses = new TreeItem("Buses");
        helper.getBuses().stream().filter(e -> e.getValue().toString().toLowerCase().contains(searchField.getText().toLowerCase()))
            .forEach(item -> buses.getChildren().add(item));
        t.getRoot().getChildren().add(buses);
        buses.setExpanded(true);

    }

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

    class TreeViewHelper 
    {
        public TreeViewHelper()
        {
        }

        // This method creates an ArrayList of TreeItems (Products)
        public ArrayList<TreeItem> getProducts()
        {
            ArrayList<TreeItem> products = new ArrayList<TreeItem>();

            TreeItem cars = new TreeItem("Cars");
            cars.getChildren().addAll(getCars());
            cars.setExpanded(true);

            TreeItem buses = new TreeItem("Buses");
            buses.getChildren().addAll(getBuses());
            buses.setExpanded(true);

            products.add(cars);
            products.add(buses);

            return products;
        }

        // This method creates an ArrayList of TreeItems (Cars)
        ArrayList<TreeItem> getCars()
        {
            ArrayList<TreeItem> cars = new ArrayList<TreeItem>();

            TreeItem ferrari = new TreeItem("Ferrari");
            TreeItem porsche = new TreeItem("Porsche");
            TreeItem ford = new TreeItem("Ford");
            TreeItem mercedes = new TreeItem("Mercedes");

            cars.add(ferrari);
            cars.add(porsche);
            cars.add(ford);
            cars.add(mercedes);

            return cars;        
        }

        // This method creates an ArrayList of TreeItems (Buses)
        ArrayList<TreeItem> getBuses()
        {
            ArrayList<TreeItem> buses = new ArrayList<TreeItem>();

            TreeItem gm = new TreeItem("GM");
            TreeItem vw = new TreeItem("VW");
            TreeItem man = new TreeItem("MAN");
            TreeItem volvo = new TreeItem("Volvo");

            buses.add(gm);
            buses.add(man);
            buses.add(volvo);
            buses.add(vw);

            return buses;       
        }

    }

}

编辑：我在使用Java 1.8.0_77b3的MacOSX 10.11上遇到此问题

Answer 1

我想我找到了解决方案。只需添加以下样式并定义空状态

即可

.search-tree .tree-cell:empty {
  -fx-background-color: transparent;
  -fx-text-fill: white;
}

它按预期工作。

JavaFX8：TreeView样式的问题

1 个答案: