Javafx-组合框文本字段bg颜色

我在谷歌上搜索过，但不幸的是，我没有找到如何通过css使不可编辑的组合框包含白色背景的文本字段的方法

换句话说，如何使不可编辑的组合框看起来像可编辑的组合框（即相同的焦点、箭头按钮等）

守则：

.combo-box .text-field{
    -fx-background-color: white;
}

不起作用

---

有人能帮忙吗

我不确定这是否是您想要的，因为我无法很好地想象“不可编辑的带有文本字段的组合框”，但它们之间可能有一个逗号

.combo-box, .text-field{
-fx-background-color: white;
}

这是我的输出：

---

这就是您想要的吗？

您可以添加以下css：

.combo-box > .list-cell{
    -fx-background-color: -fx-outer-border, white;
    -fx-background-insets: 1 -3 1 1, 1 -2 1 1 ;
}

但是要从edditable combobox获得所有样式，您必须从

/jfxrt.jar中找到
。combobox base:editable
/com/sun/javafx/scene/control/skin/modena/modena.css

并将.text字段替换为.list单元格，因为只有可编辑的组合框才有.text字段

.combo-box > .arrow-button {
    -fx-background-color: -fx-shadow-highlight-color, -fx-outer-border, -fx-inner-border, -fx-body-color;
    -fx-background-insets: 0 0 -1 0, 0, 1, 2;
    -fx-background-radius: 3px, 3px, 2px, 1px;
    -fx-padding: 0.333333em 0.666667em 0.333333em 0.666667em; /* 4 8 4 8 */
    -fx-text-fill: -fx-text-base-color;
    -fx-alignment: CENTER;
    -fx-content-display: LEFT;
}

.combo-box  > .arrow-button{
    -fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color;
    -fx-background-insets: 1 1 1 0, 1, 2;
    -fx-background-radius: 0 3 3 0, 0 2 2 0, 0 1 1 0;
}
.combo-box > .list-cell {
    -fx-background-color:
    linear-gradient(to bottom, derive(-fx-text-box-border, -10%), -fx-text-box-border),
    linear-gradient(from 0px 0px to 0px 5px, derive(-fx-control-inner-background, -9%), -fx-control-inner-background);
    -fx-background-insets: 1 0 1 1;
    -fx-background-radius: 2 0 0 2;
}
.combo-box:contains-focus {
    -fx-background-color: -fx-focus-color;
    -fx-background-insets: -0.2;
    -fx-background-radius: 3;
}
.combo-box:focused > .list-cell{
    -fx-background-color:
    -fx-control-inner-background,
    -fx-faint-focus-color,
    linear-gradient(from 0px 0px to 0px 5px, derive(-fx-control-inner-background, -9%), -fx-control-inner-background);
    -fx-background-insets: 1 0 1 1, 1 0 1 1, 3 2 3 3;
    -fx-background-radius: 2 0 0 2, 1 0 0 1, 0;
}

.combo-box :contains-focus > .arrow-button{
    -fx-background-color: -fx-inner-border, -fx-body-color, -fx-faint-focus-color, -fx-body-color;
    -fx-background-insets: 1, 2, 1, 2.6;
    -fx-background-radius: 0 2 2 0, 0 1 1 0, 0 1 1 0, 0 1 1 0;
}

结果如下：

第一个盒子的样式只有两行

2-nd具有testComboBox2.setEditable（true）

使用默认样式中的大css设置三维样式

---

我在一个项目中需要这个。我希望你没有像我那样一直把头撞在它身上

.combo-box:disabled, .combo-box:disabled > .text-field {
    -fx-opacity: 1.0;
}

---

然后，如果您的组合框被禁用，它将看起来正常，但您不能使用下拉列表或在可编辑文本字段中键入内容。

否，它不同。因为您的箭头与“可编辑”中的箭头不同。除了你的散焦颜色。@Uluk Biy Ok。我可以使用和ChoiceBox，但如何制作有背景的ChoiceBox？下面的答案是什么？哦，很抱歉误解了。我以为你要的是禁用的组合框。