JavaFx ComboBox自定义下拉菜单

Question

我想自定义组合栏的下拉菜单.看下一张图片

我想更改蓝色悬停栏,悬停文本颜色,文本字体以及默认文本字体.

非常感谢你.

-更新-

我只做到了这一点

   comboBox.setStyle("-fx-background-image: url('" + ImageUtils.getPath() + "fieldTextBkg.png');"
            + "-fx-text-box-border: transparent;" 
            + "-fx-background-color: transparent, transparent, transparent, transparent;"
            + "-fx-text-alignment: center;");

这只是改变展开的菜单.无论我为了修改内部下拉列表而尝试什么,我都无法实现.例如,一个开始将蓝色条变为绿色.整个背景而不是白色是黑色,文本是字体Calibri.

谢谢.

Answer 1

您可以通过将以下内容放置在应用程序的外部CSS文件中来更改弹出窗口中单元格的样式：

.combo-box .combo-box-popup .list-view, .combo-box .combo-box-popup .list-cell {
    -fx-background-color: black ;
    -fx-text-fill: white ;
    -fx-font-family: "Calibri" ;
}
.combo-box .combo-box-popup .list-cell:hover {
    -fx-text-fill: yellow ;
    -fx-background-color: green ;
}

您可以将伪类:selected用于所选单元格。（即.combo-box .combo-box-popup .list-cell:selected { ... }）。

您可以使用选择器设置组合框“按钮单元格”（即，不在弹出窗口中显示的单元格）的样式

.combo-box > .list-cell { /* ... */ }

有关更多选项，请参见CSS文档或默认样式表的源代码。

Answer 2

这里有一些解释:

 /*Edit The control itself*/
 .combo-box{

-fx-background-color:purple; 

 }

/*Edit Normal Cell color */
 .combo-box .list-cell{

-fx-background-color:red;


}

/*Edit Cell Color Only when cursor hover cell */
.combo-box .list-cell:hover{

-fx-background-color:green;
}

/*Edit Cell Color Only when selected */
.combo-box .list-cell:selected{

-fx-background-color:blue; 

}