Question

我有SplitPane和css文件，其中包含以下规则：

.split-pane > .split-pane-divider {  
    -fx-padding: 0 0 0 1;  
    -fx-background-color:-fx-background;
}

现在，在运行时我需要更改divider的这些规则。我试过了

SplitPane.Divider divider = splitPane.getDividers().get(0);
divider.setStyle("-fx-padding: 1 1 1 1; -fx-background-color:-fx-background;");

但setStyle类中没有方法SplitPane.Divider。

如何在运行时更改这些规则？

Answer 1

一种可能性是在CSS文件中定义一个新的样式类：

.split-pane > .split-pane-divider {
    -fx-padding: 0 0 0 1;
    -fx-background-color: green;
}

.modified-split-pane > .split-pane-divider {
    -fx-padding: 1 1 1 1;
    -fx-background-color: red;
}

然后在代码中添加/删除此样式类，因为您需要修改过的或原始的样式：

// Modified style
splitPane.getStyleClass().add("modified-split-pane");
// Original style
splitPane.getStyleClass().remove("modified-split-pane")

您还可以使用PseudoClass API：

.split-pane > .split-pane-divider {
    -fx-padding: 0 0 0 1;
    -fx-background-color: green;
}

.split-pane:version1 > .split-pane-divider {
    -fx-padding: 1 1 1 1;
    -fx-background-color: red;
}

然后在代码中激活/停用此伪类：

PseudoClass version1Pseudo = PseudoClass.getPseudoClass("version1");
splitPane.pseudoClassStateChanged(version1Pseudo, true);
splitPane.pseudoClassStateChanged(version1Pseudo, false);

通过使用Node#lookupAll（或Node）方法从场景图中获取分隔符lookup，还可以直接在代码中设置运行时中的样式属性。，但我强烈建议避免这种方法。

for (Node node: splitPane.lookupAll(".split-pane-divider"))
    node.setStyle("-fx-background-color: red; -fx-padding: 1 1 1 1;");

以编程方式更改嵌套元素的css规则

1 个答案: