JavaFX8 DatePicker按钮的大小更改

Question

我正在使用具有默认样式的JavaFX DatePicker。

但是，我想通过添加Scene将CSS样式应用于此scene.getStyleSheets().add("abc.css")中的所有按钮。

效果很好，我申请了：

Button {
    -fx-font-size: 20;
    -fx-font-family: "Arial";
    -fx-pref-width: 300;
    -fx-pref-height: 60;
    -fx-background-radius: 16px;
    -fx-background-color: lightgrey;
    -fx-text-fill: black;
}

但是，当我添加DatePicker时，问题就会发生。 DatePicker内部有自己的箭头按钮，用于切换月份或年份。我想为此DatePicker使用默认样式，但是由于它位于我的Scene下，其按钮从CSS ...（胖按钮）获取按钮样式

我是否可以从DatePicker删除按钮样式以使用默认的DatePicker样式？我不想删除此场景中的所有样式，因为我必须自己应用所有其余样式。

这是一张照片：

Answer 1

不幸的是，没有任何方法可以防止将样式应用于具有特定祖先的节点。这需要您

• 想出一种方法来限制您的样式所应用的节点，而不会修改例如DatePicker，或
• 将修改后的属性重置为值modena.css适用于它们。

对于第二个选项，您可以使用

Button {
    -fx-font-size: 20;
    -fx-font-family: "Arial";
    -fx-pref-width: 300;
    -fx-pref-height: 60;
    -fx-background-radius: 16px;
    -fx-background-color: lightgrey;
    -fx-text-fill: black;
}

.date-picker-popup > * > .spinner > .button {
    -fx-font-size: 1em;
    -fx-font-family: "System";
    -fx-pref-width: -1;
    -fx-pref-height: -1;
    -fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color;
    -fx-background-radius: 0;
}

.date-picker-popup > * > .spinner > .button:focused {
    -fx-background-color: -fx-focus-color, -fx-inner-border, -fx-body-color, -fx-faint-focus-color, -fx-body-color;
}

但是请注意，这需要对使用按钮的每个标准控件执行。添加一种方法来选择要设置样式的按钮可能要简单得多。您可以例如在要设置样式的按钮上添加样式类：

button.getStyleClass().add("my-style");

Button.my-style {
    -fx-font-size: 20;
    -fx-font-family: "Arial";
    -fx-pref-width: 300;
    -fx-pref-height: 60;
    -fx-background-radius: 16px;
    -fx-background-color: lightgrey;
    -fx-text-fill: black;
}

Answer 2

这不是绝对正确的解决方案，但是作为一种解决方法，您可以继承javaFX样式以进行日期选择器弹出控件

如果将其添加到abc.css中，按钮将像默认情况一样正常

.date-picker-popup > * > .spinner > .button {
    -fx-background-color: transparent;
    -fx-background-radius: 0;
    -fx-pref-width: -1;
    -fx-pref-height: -1;
}