您好我正在使用
JavaFx来创建一个应用程序.我有一个小的png图片,我想添加到textField的右侧.
将图片添加到textField的框架并不是一个问题,但由于某种原因,我无法将图片移动到任何可能的位置(这意味着它不会从开始的位置移动 – 这是剩下的)
我的代码如下：
#textField {
-fx-background-image:url('apr.png');
-fx-background-repeat: no-repeat;
-fx-background-image-position:right;
}
我也尝试过中心,但也没用.
解决方法
正如Marek在他的回答中指出的那样你的css属性id错了,你需要使用-fx-background-position：right center;
这是一个简短的示例,演示如何使用CSS将图片添加到TextField的右侧：
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.TextField;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class TextFieldCssSample extends Application {
@Override public void start(Stage stage) throws Exception {
TextField textField = new TextField();
textField.setId("textField");
StackPane layout = new StackPane();
layout.getChildren().addAll(textField);
layout.getStylesheets().add(this.getClass().getResource("textfield.css").toExternalForm());
stage.setScene(new Scene(layout));
stage.show();
}
public static void main(String[] args) { launch(args); }
}
Css文件：
/* textfield.css
place in same location as TextFieldCssSample.java and ensure build system copies it to output directory
image used courtesy of creative commons attribution license: http://www.rockettheme.com/blog/design/1658-free-halloween-icon-pack1
*/
.root {
-fx-padding: 15;
-fx-background-color: cornsilk;
}
#textField {
-fx-background-image:url('http://icons.iconarchive.com/icons/rockettheme/halloween/32/pumpkin-icon.png');
-fx-background-repeat: no-repeat;
-fx-background-position: right center;
-fx-font-size: 20;
}
样本输出：
If my png image is a local file in my jar file,how will I access or refer to it?
根据uri section of the css reference：
“地址可以是绝对的URI ……或相对于CSS文件的位置.”
例如
> a)将css和图像文件放在jar文件中的相同位置,并使用url(‘pumpkin-icon.png’)引用;要么
> b)将图像文件放在包含css的目录下的images目录中,并引用如url(‘images / pumpkin-icon.png’);要么
> c)将图像文件放在jar根目录的images目录中,引用如url(‘/ images / pumpkin-icon.png’);
不要使用使用..父指定符的相对引用,例如../images/pumpkin-icon.png as虽然适用于磁盘文件,但..说明符不是有效的jar协议路径,也不会从jar中提取文件.
