如何使用javafx和fxml中的ImageView组件显示图像？

Question

我想这是一件非常简单的事情,但我无法支持它.我想要的只是在链接到fxml的ImageView上显示图像.这是我的代码:

package application;

import java.io.File;

import javafx.application.Application;
import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.AnchorPane;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;


public class Main extends Application
{
    @FXML
    private ImageView imageView;

    @Override
    public void start(Stage primaryStage) 
    {
        try 
        {
        AnchorPane root = (AnchorPane)FXMLLoader.load(getClass().getResource("Sample.fxml"));
        Scene scene = new Scene(root,400,400);
        scene.getStylesheets().add(getClass().getResource("application.css").toExternalForm());
        primaryStage.setTitle("Hello World");

        File file = new File("src/Box13.jpg");
        Image image = new Image(file.toURI().toString());
        imageView = new ImageView(image);

        //root.getChildren().add(imageView);
        primaryStage.setScene(scene);
        primaryStage.show();
    } catch(Exception e) {
        e.printStackTrace();
    }
}

public static void main(String[] args) {
    launch(args);
}
}

还有我的fxml文件

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane prefHeight="316.0" prefWidth="321.0" xmlns:fx="http://javafx.com/fxml/1"     xmlns="http://javafx.com/javafx/2.2" fx:controller="application.SampleController">
  <children>
    <ImageView fx:id="imageView" fitHeight="150.0" fitWidth="200.0" layoutX="61.0" layoutY="83.0" pickOnBounds="true" preserveRatio="true" >

    </ImageView>
  </children>
</AnchorPane>

文件链接应该没有问题,因为当我包含outcommented行时它工作正常.这将是它只在java中完成的方式,但我想在这里使用fxml,因为我对所有其他组件使用fxml但它只是不适用于ImageView,我不知道为什么.我还尝试创建一个新的控制器类并将ImageView链接到那里,但这两者都不起作用.谁能帮我？

谢谢

Answer 1

如果你想使用FXML,你应该将控制器分开(就像你在使用SampleController一样).然后你fx:controller的FXML应该指向那个.

可能你错过了initialize控制器中的方法,这是Initializable接口的一部分.加载FXML后调用此方法,因此我建议您在此处设置图像.

你的SampleController班级必须是这样的:

public class SampleController implements Initializable {

    @FXML
    private ImageView imageView;

    @Override
    public void initialize(URL location, ResourceBundle resources) {
        File file = new File("src/Box13.jpg");
        Image image = new Image(file.toURI().toString());
        imageView.setImage(image);
    }
}

我在这里测试了它的工作原理.

Answer 2

除非每次动态加载不同的图像,否则不需要初始化程序.我认为在fxml中尽可能多地做更有条理的事情.这是一个fxml文件,可以满足您的需求.

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.layout.*?>

<AnchorPane
    xmlns:fx="http://javafx.co/fxml/1"
    xmlns="http://javafx.com/javafx/2.2"
    fx:controller="application.SampleController"
    prefHeight="316.0"
    prefWidth="321.0"
    >
    <children>
        <ImageView
                fx:id="imageView"
                fitHeight="150.0"
                fitWidth="200.0"
                layoutX="61.0"
                layoutY="83.0"
                pickOnBounds="true"
                preserveRatio="true"
            >
            <image>
                <Image
                    url="src/Box13.jpg"
                    backgroundLoading="true"
                    />
            </image>
        </ImageView>
    </children>
</AnchorPane>

在Image标记中指定backgroundLoading属性是可选的,它默认为false.当加载图像花费片刻或更长时间时,最好将backgroundLoading设置为true,这样就可以使用占位符直到图像加载,并且程序在加载时不会冻结.

Answer 3

代码部分：

Image imProfile = new Image(getClass().getResourceAsStream("/img/profile128.png"));

ImageView profileImage=new ImageView(imProfile);

在 javafx Maven 中：