JavaFX8 DatePicker 按钮大小改变

Question

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

但是，我想将 CSS 样式应用到此 Scene 中的所有按钮通过添加 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;
}