JavaFX8 image display

1. Specifications

  1. When executed, a window will open.
  2. In the initial state, the image is not displayed and only the display button can be pressed.
  3. When you press the display button, the image is displayed and you can press only the hide button.
  4. If you press the hide button, the image will be hidden and you will be able to press only the show button.

2. File structure

Create a project in Eclipse.

imageView ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ (1) └ src ・ ・ ・ ・ ・ ・ ・ ・ (2) ├ test.jpg ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ (3) └ viewer ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ (4) ├ Main.java ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ (5) ├ MainController.java ・ ・ ・ ・ (6) └ screen.fxml ・ ・ ・ ・ ・ ・ ・ ・ (7)

(1) Project to be created (2) Source file directory created arbitrarily when creating a project (3) Test image (4) Package to create (5) Source file (described in the next chapter) (6) Source file (described in the next chapter) (7) Source file (described in the next chapter, created by SceneBuilder)

3. Source code

3.1. Main.java

Main.java


package viewer;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class Main extends Application {
	@Override
	public void start(Stage primaryStage) {
		try {
			//Loading the scene graph from FXML
			FXMLLoader loader = new FXMLLoader(getClass().getResource("screen.fxml"));//screen.Place fxml in the same package
			Parent root = loader.load();

			//Creating a scene with the root node of the scene graph
			Scene scene = new Scene(root, 600, 400);
			//Setting the scene on the stage
			primaryStage.setScene(scene);
			primaryStage.setTitle("Viewer");
			primaryStage.show();
		} catch (Exception e) {
			e.printStackTrace();
		}
	}

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

3.2. MainController.java

MainController.java


package viewer;

import java.net.URL;
import java.util.ResourceBundle;

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.control.Button;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;

public class MainController {

	@FXML
	private ResourceBundle resources;

	@FXML
	private URL location;

	@FXML
	private ImageView img;

	@FXML
	private Button imgDisplayButton;

	@FXML
	private Button imgHideButton;

	@FXML
	void initialize() {
		assert img != null : "fx:id=\"img\" was not injected: check your FXML file 'screen.fxml'.";
		assert imgDisplayButton != null : "fx:id=\"imgDisplayButton\" was not injected: check your FXML file 'screen.fxml'.";
		assert imgHideButton != null : "fx:id=\"imgHideButton\" was not injected: check your FXML file 'screen.fxml'.";

        //(1),(2)Enable one and comment out the other

        //(1)When specifying an image in the URL-----------------------------------------------
		//String url="http://example.com/sample.jpg ";
		//Image image = new Image(url);
        //---------------------------------------------------------------------

        //(2)When specifying an image in a file-------------------------------------------
		Image image = new Image("test.jpg ");//test.Place jpg directly under src
        //---------------------------------------------------------------------

		img.setImage(image);
		img.setVisible(false);
		imgHideButton.setDisable(true);
		imgDisplayButton.setDisable(false);
	}

	@FXML
	public void OnclickedImgDisplayButton(ActionEvent event) {
		img.setVisible(true);
		imgDisplayButton.setDisable(true);
		imgHideButton.setDisable(false);
	}

	@FXML
	public void OnclickedImgHideButton(ActionEvent event) {
		img.setVisible(false);
		imgHideButton.setDisable(true);
		imgDisplayButton.setDisable(false);
	}

}

3.3. screen.fxml

screen.fxml


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

<?import javafx.scene.control.Button?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.Pane?>
<?import javafx.scene.text.Font?>

<Pane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8.0.171" xmlns:fx="http://javafx.com/fxml/1" fx:controller="viewer.MainController">
   <children>
      <Button fx:id="imgHideButton" layoutX="86.0" layoutY="341.0" mnemonicParsing="false" onAction="#OnclickedImgHideButton" prefHeight="45.0" prefWidth="124.0" text="Hide">
         <font>
            <Font size="20.0" />
         </font>
      </Button>
      <Button fx:id="imgDisplayButton" layoutX="384.0" layoutY="341.0" mnemonicParsing="false" onAction="#OnclickedImgDisplayButton" prefHeight="45.0" prefWidth="124.0" text="display">
         <font>
            <Font size="20.0" />
         </font>
      </Button>
      <ImageView fx:id="img" fitHeight="330.0" fitWidth="588.0" layoutX="5.0" layoutY="6.0" pickOnBounds="true" preserveRatio="true" />
   </children>
</Pane>

4. Supplementary information

Recommended Posts

JavaFX8 image display
Display a loading image in JavaFX and then display another image
Display text on top of the image
Display an image on the base64 screen
[JavaFX] IllegalArgumentException occurs in new Image (path)
JavaFx memorandum
Image upload
Display the background image in the production environment
Display Mat type image on GUI with Swing
Earth display in equatorial coordinate system in JavaFX 3D (1)