java如何设计JavaFX文本字段,使其看起来像iOS文本字段? 1 周,4 日 Questions & Answers 494 如何设计JavaFX TextField的样式,使其看起来像iOS 我想要非圆角、插入/填充、颜色和提示文本(包括字体)
# 1 楼答案 您可以使用以下CSS规则更改文本字段的外观以匹配iOS: #ios-field { -fx-background-color: white; -fx-border-color : #D7D6DC; -fx-background-insets: -0.2, 1, -1.4, 3; -fx-background-radius: 0; -fx-padding: 4 7 4 15 ; -fx-prompt-text-fill: derive(-fx-control-inner-background,-30%); } #ios-field:focused { -fx-border-color : #D7D6DC; -fx-background-color: white; -fx-background-insets: -0.2, 1, -1.4, 3; -fx-background-radius: 0; -fx-padding: 4 7 4 15 ; } 我相信CSS规则是不言自明的,你很容易做出改变。 我使用#D7D6DC颜色作为边框颜色来匹配图像中的颜色,-fx背景插图是modenas中使用的默认值。css 结果: 附言 我看不出图像中的边框(左边框和右边框)是否存在,如果您只想显示上边框和下边框,也可以通过-fx-border-width : 1 0 1 0;来显示。除字体大小和字体系列外,您还可以使用-fx-font-size和-fx-font-family。iOS使用的字体是San Francisco
# 1 楼答案
您可以使用以下CSS规则更改文本字段的外观以匹配iOS:
我相信CSS规则是不言自明的,你很容易做出改变。 我使用#D7D6DC颜色作为边框颜色来匹配图像中的颜色,-fx背景插图是modenas中使用的默认值。css
结果:
附言 我看不出图像中的边框(左边框和右边框)是否存在,如果您只想显示上边框和下边框,也可以通过
-fx-border-width : 1 0 1 0;
来显示。除字体大小和字体系列外,您还可以使用-fx-font-size
和-fx-font-family
。iOS使用的字体是San Francisco