如何在JFXTextField或TextField中使用JavaFX中的CSS获取圆角
如何在JFXTextField或TextField中使用JavaFX中的CSS获取圆角
提问于 2019-10-13 14:11:07
我正在使用JavaFX构建一个应用程序，我有一个使用JFXTextFields和JFXComboBoxes的表单。如下图所示，我需要把它们像圆角一样圈起来。
如下所示：
我已经尝试了以下CSS代码：
.jfx-text-field {
-fx-border-radius: 20px;
-fx-background-radius: 20 20 20 20;
-fx-border-color: #609;
}但结果是：
那么如何在JavaFX中使用CSS对文本字段和组合框进行舍入呢？
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-10-15 05:00:45
JFoenix使用的.css-files可以在JFoenix-master\jfoenix\src\main\resources\com\jfoenix\assets\css\controls上找到。属于JFXTextField的.css-file是jfx-text-field.css，属于JFXComboBox的.css-file是jfx-combo-box.css。
这些文件中定义的样式必须根据需要在用户定义的.css-file中进行调整，例如：
.jfx-text-field,
.jfx-combo-box {
-fx-border-radius: 20px;
-fx-border-color: #CCCCCC;
}
.jfx-text-field {
-fx-padding: 0.333333em 1em 0.333333em 1em;
}
.jfx-combo-box {
-fx-padding: 0em 1em 0em 1em;
}
.jfx-text-field > .input-line,
.jfx-combo-box > .input-line {
-fx-background-color: transparent;
-fx-pref-height: 0px;
-fx-translate-y: 0px;
}
.jfx-text-field > .input-focused-line,
.jfx-combo-box > .input-focused-line {
-fx-background-color: transparent;
-fx-pref-height: 0px;
}在第一个块中定义了边框半径和边框颜色，在接下来的两个块中定义了填充。在最后两个块中，输入行被禁用，它在上面最初发布的屏幕截图中仍然可见。结果是：
发布的样式只是一个示例，必须根据您的需求进行调整/优化。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58361030
复制相关文章
相似问题
腾讯云开发者
