如何在 JavaFX 的组合框中用文本替换向下箭头答案

【问题标题】：How to replace down arrow with text in a combobox in JavaFX如何在 JavaFX 的组合框中用文本替换向下箭头
【发布时间】：2021-11-03 07:48:44
【问题描述】：

我正在尝试从组合框中删除向下箭头。我找到的所有解决方案都只是让箭头消失，例如this one。

有没有办法完全删除箭头出现的空间并只用所选选项的文本填充框？

【问题讨论】：

不，不支持 - 您可以尝试自定义皮肤（将按钮设置为不可见和/或调整布局。不过，用户体验会很差。您为什么想要它？
我想用组合框填充 25X30 网格窗格的每个单元格，并且箭头以及文本和箭头之间的填充所占据的空间使网格窗格变得很大。否则，我必须减小组合框内文本的字体大小，使其变得非常小以便阅读。

标签： javafx combobox

【解决方案1】：

如果您想完全消除箭头和箭头按钮空间，您可以尝试使用下面的自定义 ComboBox。

以下代码将箭头按钮和箭头节点的大小设置为 0，并要求重新渲染组合框。空检查是让这个更改只应用一次。

public class MyComboBox<T> extends ComboBox<T>{
    Region arrowBtn ;

    @Override
    protected void layoutChildren() {
        super.layoutChildren();
        if(arrowBtn==null){
            arrowBtn= (Region)lookup(".arrow-button");
            arrowBtn.setMaxSize(0,0);
            arrowBtn.setMinSize(0,0);
            arrowBtn.setPadding(new Insets(0));

            Region arrow= (Region)lookup(".arrow");
            arrow.setMaxSize(0,0);
            arrow.setMinSize(0,0);
            arrow.setPadding(new Insets(0));

            // Call again the super method to relayout with the new bounds.
            super.layoutChildren();
        }
    }
}

更新：

根据@kleopatra 的建议，我们也可以使用 css 获得相同的行为（无需为 ComboBox 创建新类）。

.combo-box .arrow-button,
.combo-box .arrow{
   -fx-max-width:0px;
   -fx-min-width:0px;
   -fx-padding:0px;
}

下图将告诉您普通组合框和此自定义组合框的区别。左边是普通的comboBox，使用ScenicView查看时可以看到列表单元格。正确的是自定义的。列表单元格被完全占用，抑制了箭头空间。

【讨论】：

不错的技巧 :) 也可以通过 css 访问。
非常感谢。它正在工作！
@kleopatra。谢谢你的建议。事实上，它也适用于 css :)