如何在TreeView（JavaFX）中更改單個項目的背景顏色？

Question

我第一次使用JavaFX，到目前為止，我設法讓我想要的其他一切都很好，但現在我已經死了。 我正在使用Treeview來顯示一個對象列表，每個對象都包含一個數值（使用了多少次），我想根據使用計數器在樹視圖上單獨更改每個對象的背景顏色。

即，如果一個物體被使用了100次，它應該是紅色的，而較少使用的物體更像黃色，類似於溫度讀數器。

任何幫助都非常感謝！

謝謝，安德烈亞斯

Answer 1

使用單元工廠創建樹狀單元格，其styleProperty綁定到樹中顯示的項目的值：

import java.util.Random;

import javafx.application.Application;
import javafx.beans.binding.Bindings;
import javafx.beans.property.IntegerProperty;
import javafx.beans.property.SimpleIntegerProperty;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.TreeCell;
import javafx.scene.control.TreeItem;
import javafx.scene.control.TreeView;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;

public class TreeViewChangeBackgroundOnItem extends Application {

    private TreeView<Item> tree;

    @Override
    public void start(Stage primaryStage) {
        tree = new TreeView<>();
        tree.setRoot(new TreeItem<>(new Item(0)));
        tree.getRoot().setExpanded(true);
        Random rng = new Random();
        for (int i = 0 ; i < 10 ; i++) {
            tree.getRoot().getChildren().add(
                    new TreeItem<>(new Item(rng.nextInt(100))));
        }

        tree.setCellFactory(tv -> new TreeCell<Item>() {
            @Override
            protected void updateItem(Item item, boolean empty) {
                super.updateItem(item, empty);
                styleProperty().unbind();
                textProperty().unbind();
                if (empty) {
                    setText("");
                    setStyle("");
                } else {
                    textProperty().bind(item.valueProperty().asString("Value: %d"));
                    styleProperty().bind(Bindings.createStringBinding(() -> 
                        String.format("-fx-background: #ff%02x00;",
                                computeGreen(item.getValue())), 
                        item.valueProperty()));
                }
            }
        });

        Button inc = createAdjustButton("Increment", 1);

        Button dec = createAdjustButton("Decrement", -1);

        HBox buttons = new HBox(5, inc, dec);
        buttons.setAlignment(Pos.CENTER);
        buttons.setPadding(new Insets(10));

        BorderPane root = new BorderPane(tree, null, null, buttons, null);
        Scene scene = new Scene(root);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    private int computeGreen(int value) {
        int clamped = Math.max(0, Math.min(value, 100));
        return 255-255*clamped/100 ;
    }

    private Button createAdjustButton(String text, int delta) {
        Button button = new Button(text);
        button.setOnAction(e -> adjust(delta));
        button.disableProperty().bind(tree.getSelectionModel().selectedItemProperty().isNull());
        return button ;
    }

    private void adjust(int delta) {
        Item selected = tree.getSelectionModel().getSelectedItem().getValue();
        selected.setValue(selected.getValue()+delta);
    }

    public static class Item {
        private final IntegerProperty value = new SimpleIntegerProperty();

        public Item(int value) {
            setValue(value);
        }

        public final IntegerProperty valueProperty() {
            return this.value;
        }


        public final int getValue() {
            return this.valueProperty().get();
        }


        public final void setValue(final int value) {
            this.valueProperty().set(value);
        }

    }

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

Answer 2

自定義cellFactory可用於根據顯示的項目更改Background 。 為簡單起見，假設樹項包含IntegerProperty ：

private final static double FACTOR = -Math.log(5d) * 0.01;


    treeView.setCellFactory((t) -> new TreeCell<IntegerProperty>() {

        @Override
        protected void updateItem(IntegerProperty item, boolean empty) {
            super.updateItem(item, empty);
            if (empty || item == null) {
                textProperty().unbind();
                backgroundProperty().unbind();
                setText(null);
                setBackground(null);
            } else {
                textProperty().bind(item.asString());
                backgroundProperty().bind(Bindings.createObjectBinding(()
                        -> new Background(new BackgroundFill(
                                        Color.color(1, Math.exp(FACTOR * item.get()), 0, 1),
                                        CornerRadii.EMPTY, Insets.EMPTY)), item));
            }

        }

    });

我還使用指數函數作為綠色通道的值，以允許所有非負int值。

有關更復雜的顏色選擇算法，請參閱此頁面http://www.tannerhelland.com/4435/convert-temperature-rgb-algorithm-code/