css - Javafx不可编辑的组合框提示文本样式与CSS

Question

我正在尝试让我的不可编辑组合框具有提示文本，其填充文本颜色比实际文本填充颜色(对于文本输入)要浅一些。

我越过了这个主题，它解释了一个通过覆盖纽扣电池的解决方案:JavaFX 8 - How to change the color of the prompt text of a NOT editable combobox via CSS?

我的问题很简单:我们能否通过 CSS 文件实现本文中描述的机制？我觉得这是不可能的，但由于我根本不是 CSS 专家，我想知道我是否错过了什么。

Answer 1

Skin 可以从 CSS 分配。您可以在 Skin 的构造函数中对 Skinnable 应用修改，这不是 Skin 应该做的。

每当未选择任何元素时分配一个 PseudoClass 将是 Skin 可以做的事情。

有了这样一个伪类，buttonCell 可以从 CSS 中设置样式。

package combobox.promptstyle;

import com.sun.javafx.scene.control.skin.ComboBoxListViewSkin;
import javafx.beans.value.ChangeListener;
import javafx.css.PseudoClass;
import javafx.scene.control.ComboBox;
import javafx.scene.control.SelectionModel;

// extend default ComboBox Skin
public class PromptSkin<T> extends ComboBoxListViewSkin<T> {

    private static final PseudoClass PROMPT = PseudoClass.getPseudoClass("prompt");

    public PromptSkin(final ComboBox<T> comboBox) {
        super(comboBox);

        ChangeListener<Number> selectionIndexChangeListener = (observable, oldIndex, newIndex) -> {
            getNode().pseudoClassStateChanged(PROMPT, newIndex.intValue() < 0);
        };

        ChangeListener<SelectionModel> modelChangeListener = (observable, oldSelectionModel, newSelectionModel) -> {
            if (oldSelectionModel != null) {
                oldSelectionModel.selectedIndexProperty().removeListener(selectionIndexChangeListener);
            }

            if (newSelectionModel != null) {
                newSelectionModel.selectedIndexProperty().addListener(selectionIndexChangeListener);
                selectionIndexChangeListener.changed(null, null, newSelectionModel.getSelectedIndex());
            } else {
                selectionIndexChangeListener.changed(null, null, -1);
            }
        };

        comboBox.selectionModelProperty().addListener(modelChangeListener);
        modelChangeListener.changed(null, null, comboBox.getSelectionModel());
    }

}

使用皮肤的例子:

ComboBox comboBox = ...
comboBox.setId("combo");

// set stylesheet

CSS 样式表

#combo {
    /* set skin to use */
    -fx-skin: 'combobox.promptstyle.PromptSkin';
}

#combo:prompt > .list-cell {
    -fx-text-fill: derive(-fx-control-inner-background,-30%);
}

请注意，Skin 扩展了 com.sun 包中的一个类，该类可能会发生变化。