在 caspian.css 中搜索我发现我可以自定义对话框窗格.Alert扩展了Dialog,所以我尝试了其中一些代码:
.dialog-pane {
-fx-background-color: black;
-fx-padding: 0;
.....
}
.dialog-pane > .expandable-content {
-fx-padding: 0.666em; /* 8px */
.....
}
.dialog-pane > .button-bar > .container {
-fx-padding: 0.833em; /* 10px */
.....
}
.....
但没有任何改变。
问题: 我怎样才能做到这一点?我的意思是我想自定义背景,按钮,标题和其他所有内容。
答案 0 :(得分:9)
查看here如何将样式表或|和样式列表添加到DialogPane,以便添加服装css文件。
示例(图片+ css代码):
.dialog-pane{
-fx-border-color:black;
-fx-border-width:2.0px;
}
/**Costumization of The Bar where the buttons are located**/
.dialog-pane > .button-bar > .container {
-fx-background-color:black;
}
.dialog-pane > .content.label {
-fx-padding: 0.5em 0.5em 0.5em 0.5em;
-fx-background-color: yellow;
-fx-text-fill:black;
-fx-font-size:15.0px;
}
/**Costumization of DialogPane Header**/
.dialog-pane:header .header-panel {
-fx-background-color: black;
}
.dialog-pane:header .header-panel .label{
-fx-background-color: yellow;
-fx-background-radius:10px;
-fx-text-fill:black;
-fx-font-size:15.0px;
}
/**Costumization of Buttons**/
.dialog-pane .button{
-fx-background-color:black;
-fx-text-fill:white;
-fx-wrap-text: true;
-fx-effect: dropshadow( three-pass-box, yellow, 10.0, 0.0, 0.0, 0.0);
-fx-cursor:hand;
}
.dialog-pane .button:hover{
-fx-background-color:white;
-fx-text-fill:black;
-fx-font-weight:bold;
}