如何在Java FX应用程序中为组合框样式化提示文本？

Question

我希望修改下拉框的CSS样式，以减小提示文本的字体大小。

如何实现？

- Mehdi Boukhechba

Answer 1

如果您只想更改提示文本的大小而不是其他文本，则我认为没有任何方法：因为没有钩子可以区分提示文本和显示文本的文本节点。您可以通过特殊的CSS属性更改颜色：

.combo-box .text-field {
    -fx-prompt-text-fill: rgba(255, 0, 0, 0.5) ;
}
.combo-box .text-field:focused {
    -fx-prompt-text-fill: transparent ;
}

但我没有看到任何更改其他样式属性的方法。

- James_D

---

你确定这个属性适用于组合框吗？我好像无法让它起作用（JDK 7，Scene Builder 1.1）。我有一个包含多个文本字段和2个组合框的表单。即使我添加了一个带有“.text-field { -fx-prompt-text-fill: rgba(255, 0, 0, 0.5) ; }”的CSS文件，所有文本字段提示都会变成红色，但组合框提示仍然是黑色的。 - JJ.

是的，在JDK 7和JDK 8上进行了测试。您可能需要在CSS文件中明确包含.combo-box .text-field {...}。 - James_D

好的，谢谢 - 是的，我尝试了那个和许多其他组合。对我来说不起作用 - 奇怪。 - JJ.

@JJ. 所有组合对我都不起作用。如果你有什么想法，请告诉我。 - Sumeet Vishwas

Answer 2

只需在你的css中添加以下代码： .combo-box-base .text{ -fx-fill: rgb(130.0, 130.0, 130.0); } 这将会改变文本框的颜色。

- Ismail Sadok

Answer 3

你看过这个this了吗？试试这样的操作：

.combo-box .list-view {
    -fx-font-size: xxxx;
}

你可能需要指定其他属性和/或其他选择器以实现所需的效果（例如-fx-cell-size）。请参阅caspian.css中的相关部分（位于JRE的lib文件夹中的jfxrt.jar内）。

- Nikos Paraskevopoulos

Answer 4

正如James D所说，这段代码只在特定条件下起作用。

 .combo-box .text-field {
     -fx-prompt-text-fill: rgba(255, 0, 0, 0.5) ;
 }
 .combo-box .text-field:focused {
     -fx-prompt-text-fill: transparent ;
 }

但只有在您激活组合框的可编辑属性时才会生效。

如果您添加

.combo-box-base .text

它甚至将适用于您组合框中的元素

如果您不想让JavaFx中的组合框可编辑，则不要考虑这一点。我认为您需要通过添加PseudoClass并自己激活来自行处理…

或使您的组合框可编辑，但禁止使用键盘

或者您必须从另一个界面框架中选择另一个ComboBox

这些解决方案都是权宜之计，并非终极解决方案，我希望JavaFx开发人员能够改善这一点。

- Mr Pilli

Answer 5

我知道这很老，但可能会对某些人有帮助。

对于默认组合框：

 .combo-box{
     -fx-prompt-text-fill: #ffffff;
 }

对于 JFoenix 组合框：

 .jfx-combo-box {
     -fx-prompt-text-fill: #ffffff;
 }

如果有需要，您也可以为.list-cell、.label和.text-field这些子属性设置样式。

- yusuf.oguntola

Answer 6

通过这段代码，我可以更改组合框的样式：字体、字号、文本颜色等。

ComboBox<String> comboBox= new ComboBox<String>();
    comboBox.setPromptText("Text");

    comboBox.setButtonCell(new ListCell<String>(){
                @Override
                protected void updateItem(String item, boolean empty) {
                    super.updateItem(item, empty); 
                    setStyle("-fx-font-size: 17.0");
                    if(!(empty || item==null)){
                        setText(item.toString());
                    }
                }
            });

- M. Bartosh

---

虽然这段代码片段很受欢迎，可能会提供一些帮助，但如果它包括解释“如何”和“为什么”解决问题，那将会大有改进。请记住，您正在回答未来读者的问题，而不仅仅是现在提问的人！请编辑您的答案以添加解释，并指出适用的限制和假设。 - Toby Speight

Answer 7

使用Scenic View的小技巧

.combo-box .list-cell {
    -fx-font-size: xxxx;
}

- Anindya Chatterjee