JavaFX 8:在为表行使用边框时移动表格单元格

时间:2015-09-25 10:09:33

标签: java css javafx treetableview

我想在我的TreeTableView中用红色边框标记多行,但我遇到了表格单元格偏离各自列的问题。

视觉上看起来像这样:

http://i.imgur.com/KBK3hvM.png

的style.css:

.style {
    -fx-border-style: solid line-join round ;
    -fx-border-color: ...;
}

对于树中的每一列,它似乎从右边进一步移动了边界的宽度(默认为1px)。只有2列不是问题,但最终的应用程序应该包含十几列。

我可以将边框的插图设置在单元格的外部并修复移位,但是你不能再看到边框了,这看起来很奇怪。

我猜测一行的设置样式只是方便让引擎为每个单元设置它。

有没有办法阻止TreeTableCells转移?也许为单元格设置单独的样式而不是整个行的样式?

1 个答案:

答案 0 :(得分:0)

假设.style已应用于TreeTableRow

.style {
    -fx-background-color: red, -fx-background ;
    -fx-background-insets: 0, 1 ;
}

我经常发现我必须深入研究默认样式表的来源以找出这些。您可能想要使用insets并实现某种逻辑以防止应用样式类的相邻行上的双边框。

这是一个SSCCE:

import javafx.application.Application;
import javafx.beans.property.IntegerProperty;
import javafx.beans.property.SimpleIntegerProperty;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
import javafx.scene.Scene;
import javafx.scene.control.TreeItem;
import javafx.scene.control.TreeTableColumn;
import javafx.scene.control.TreeTableRow;
import javafx.scene.control.TreeTableView;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;

public class StyledTreeTableView extends Application {

    private static final int MAX_VALUE = 1000 ;

    @Override
    public void start(Stage primaryStage) {
        TreeTableView<Item> treeTable = new TreeTableView<>();
        treeTable.setRoot(createTreeItem(1));

        treeTable.setRowFactory(ttv -> new TreeTableRow<Item>() {
            @Override
            public void updateItem(Item item, boolean empty) {
                super.updateItem(item, empty);
                if (empty) {
                    setText(null);
                    getStyleClass().remove("highlight");
                } else {
                    setText(item.toString());
                    if (item.getValue() % 10 == 3 || item.getValue() % 10 == 4) {
                        if (! getStyleClass().contains("highlight")) {
                            getStyleClass().add("highlight");
                        }
                    } else {
                        getStyleClass().remove("highlight");
                    }
                }
            }
        });

        TreeTableColumn<Item, String> nameCol = new TreeTableColumn<>("Item");
        nameCol.setCellValueFactory(cellData -> cellData.getValue().getValue().nameProperty());
        treeTable.getColumns().add(nameCol);

        for (int colIndex = 1 ; colIndex < 10 ; colIndex++) {
            TreeTableColumn<Item, Number> valueCol = new TreeTableColumn<>("Value * "+colIndex);
            final int multiplier = colIndex ;
            valueCol.setCellValueFactory(cellData -> cellData.getValue().getValue().valueProperty().multiply(multiplier));
            treeTable.getColumns().add(valueCol);
        }

        BorderPane root = new BorderPane(treeTable);
        Scene scene = new Scene(root, 600, 600);
        scene.getStylesheets().add("styled-tree-table.css");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    private TreeItem<Item> createTreeItem(int value) {
        Item item = new Item("Item "+ value, value);
        TreeItem<Item> treeItem = new TreeItem<>(item);
        if (value < MAX_VALUE) {
            for (int i = 0 ; i < 10; i++) {
                treeItem.getChildren().add(createTreeItem(value * 10 + i));
            }
        }
        return treeItem ;
    }

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

        public Item(String name, int value) {
            setName(name);
            setValue(value);
        }

        public final StringProperty nameProperty() {
            return this.name;
        }

        public final java.lang.String getName() {
            return this.nameProperty().get();
        }

        public final void setName(final java.lang.String name) {
            this.nameProperty().set(name);
        }

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

使用样式表:

.highlight {
    -fx-background-color: red, -fx-background ;
    -fx-background-insets: 0, 1 ;
}