制作更小的JavaFX ComboBox

Question

我试图制作一个较小版本的ComboBox，但无论我做什么，文本和箭头按钮之间的差距都是不变的。

如果我使用css：

.combo-box-base > *.arrow-button {
    -fx-padding: 0 0 0 0;
    -fx-background-color: pink, pink, pink, pink;
}

箭头按钮变小但是ComboBox本身仍然具有相同的大小，只是增加了箭头和文本之间的差距来补偿。

如果我这样做

.combo-box > .list-cell {
    -fx-padding: 0 0 0 0;
    -fx-border-insets: 0 0 0 0;
}

组合得到一个较小的高度，但宽度保持不变。

有没有办法通过缩小文本和箭头之间的大小来缩小组合的首选大小？

Answer 1

我知道这个问题已经很老了，但是我遇到了同样的问题，想解决这个问题。因此，我开始逐步调试JavaFX代码，以了解额外空间的来源。 我花了比预期更长的时间，因为我忽略了影响很小的一小段代码。

默认情况下，类ComboBoxListViewSkin负责ComboBox宽度的计算。其计算方法将计算委托给超类和字段prefWidth的{​​{1}}方法，并选择更大的结果。

listView

/** {@inheritDoc} */ @Override protected double computePrefWidth(double height, double topInset, double rightInset, double bottomInset, double leftInset) { double superPrefWidth = super.computePrefWidth(height, topInset, rightInset, bottomInset, leftInset); double listViewWidth = listView.prefWidth(height); double pw = Math.max(superPrefWidth, listViewWidth); reconfigurePopup(); return pw; } 字段实际上是扩展listView的{​​{1}}的实例，该实例执行某些Anonymous Classes特定的事情并覆盖某些方法。这些方法之一是ListView。它包含导致我们无法摆脱的多余空格问题的行。

ComboBox

我们不希望将最宽单元格的宽度加30。因为它是硬编码的，所以我们不能轻易更改它。乍一看，我忽略了它，导致调试代码时有些WTF时刻。 当然，您可以扩展protected double computePrefWidth(double height)并覆盖其pw = Math.max(comboBox.getWidth(), skin.getMaxCellWidth(rowsToMeasure) + 30); 方法，但是我认为默认的ComboBoxListViewSkin类应该提供轻松更改此多余空白的可能性。所以我提起issue at GitHub。

Answer 2

您是否尝试过设置.combox-box＆gt;的填充？ .text-input？
根据Oracles ComboBox CSS documentation，这可能是填充的另一个来源 如果您计划开发更多CSS规则，可以查看SceneBuilder2的CSS检查器或使用ScenicView。 ScenicView还允许对CSS进行实时修改，从而显着提高调试速度。

Answer 3

你检查了Hgrow财产吗？你应该在组合框的布局管理器中设置它

ComboBox field = new ComboBox(); HBox.setHgrow(field, Priority.NEVER);

同时检查您应将它们设置为USE_COMPUTED_SIZE的首选宽度和最大宽度（在SceneBuilder中，不知道如何通过代码执行此操作）。