JavaFX - 圖片

上一頁
下一頁

圖片是任何應用程式（包括 JavaFX 應用程式）中最常用的元素之一。圖片可以有多種形式，例如照片、圖形或單個影片幀等。JavaFX 還支援各種數字圖片格式，例如：

  • BMP

  • GIF

  • JPEG

  • PNG

您可以使用 JavaFX 在包 **javafx.scene.image** 中提供的類載入和修改上述所有格式的圖片。

本章將教您如何將圖片載入到 JavaFX 中，如何在多個檢視中投影圖片，以及如何更改圖片的畫素。

載入圖片

您可以透過例項化包 **javafx.scene.image** 中名為 **Image** 的類來載入 JavaFX 中的圖片。

對於 Image 類的建構函式，您必須傳遞以下任一項作為圖片源：

  • 要載入的圖片的 **InputStream** 物件，或

  • 包含圖片 **URL** 的字串變數。

圖片在載入時也可以調整大小，以減少其記憶體儲存量。這可以透過向 Image 類的建構函式傳遞以下可選引數來完成。

  • **requestedWidth** 用於設定顯示圖片的目標寬度。

  • **requestedHeight** 用於設定顯示圖片的目標高度。

  • **preserveRatio** 是一個布林值，用於指定最終圖片的縱橫比是否必須與原始圖片相同。

  • **smooth** 表示應用於圖片的濾鏡質量。

  • **backgroundLoading** 表示圖片是否需要在後臺載入。

載入圖片後，您可以透過例項化 ImageView 類來檢視它。多個 ImageView 類可以使用相同的圖片例項來顯示它。

語法

以下是載入和檢視圖片的語法：

//Passing FileInputStream object as a parameter 
FileInputStream inputstream = new FileInputStream("C:\\images\\image.jpg"); 
Image image = new Image(inputstream); 
         
//Loading image from URL 
//Image image = new Image(new FileInputStream("url for the image));

載入圖片後，您可以透過例項化 **ImageView** 類並將圖片傳遞給它的建構函式來設定圖片的檢視，如下所示：

ImageView imageView = new ImageView(image);

示例

以下示例演示瞭如何在 JavaFX 中載入圖片並設定檢視。

將此程式碼儲存在名為 **ImageExample.java** 的檔案中。

import java.io.FileInputStream; 
import java.io.FileNotFoundException; 
import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;  
import javafx.stage.Stage;  

public class ImageExample extends Application {  
   @Override 
   public void start(Stage stage) throws FileNotFoundException {         
      //Creating an image 
      Image image = new Image(new FileInputStream("path of the image"));  
      
      //Setting the image view 
      ImageView imageView = new ImageView(image); 
      
      //Setting the position of the image 
      imageView.setX(50); 
      imageView.setY(25); 
      
      //setting the fit height and width of the image view 
      imageView.setFitHeight(455); 
      imageView.setFitWidth(500); 
      
      //Setting the preserve ratio of the image view 
      imageView.setPreserveRatio(true);  
      
      //Creating a Group object  
      Group root = new Group(imageView);  
      
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 500);  
      
      //Setting title to the Stage 
      stage.setTitle("Loading an image");  
      
      //Adding scene to the stage 
      stage.setScene(scene);
      
      //Displaying the contents of the stage 
      stage.show(); 
   }  
   public static void main(String args[]) { 
      launch(args); 
   } 
}

使用以下命令從命令提示符編譯並執行儲存的 java 檔案。

javac --module-path %PATH_TO_FX% --add-modules javafx.controls ImageExample.java 
java --module-path %PATH_TO_FX% --add-modules javafx.controls ImageExample

輸出

執行後，上述程式將生成一個 JavaFX 視窗，如下所示：

Loading Image

示例

在這個例子中，讓我們嘗試透過傳遞最終尺寸和濾鏡質量到 Image 類的建構函式來調整圖片大小（例如之前的輸出圖片）。將程式碼儲存在名為 **ResizedImageExample.java** 的檔案中。

import java.io.FileInputStream; 
import java.io.FileNotFoundException; 
import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;  
import javafx.stage.Stage;  

public class ResizedImageExample extends Application {  
   @Override 
   public void start(Stage stage) throws FileNotFoundException {         
      //Creating an image 
	  FileInputStream fis = new FileInputStream("C:/Apache24/htdocs/javafx/images/loading_image.jpg");
      Image image = new Image(fis, 250, 300, false, false);
      
      //Setting the image view 
      ImageView imageView = new ImageView(image); 
      
      //Setting the position of the image 
      imageView.setX(50); 
      imageView.setY(25); 
      
      //Creating a Group object  
      Group root = new Group(imageView);  
      
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 500);  
      
      //Setting title to the Stage 
      stage.setTitle("Loading an image");  
      
      //Adding scene to the stage 
      stage.setScene(scene);
      
      //Displaying the contents of the stage 
      stage.show(); 
   }  
   public static void main(String args[]) { 
      launch(args); 
   } 
}

使用以下命令從命令提示符編譯並執行儲存的 java 檔案。

javac --module-path %PATH_TO_FX% --add-modules javafx.controls ResizedImageExample.java 
java --module-path %PATH_TO_FX% --add-modules javafx.controls ResizedImageExample

輸出

執行後，上述程式將生成一個 JavaFX 視窗，如下所示：

Loading Image

圖片的多個檢視

在某些情況下，應用程式需要以不同的方式顯示圖片：具有不同的尺寸、更好的質量、縮放後等等。

無需每次需要不同檢視的圖片時都建立一個新的應用程式，JavaFX 允許您在同一場景中為圖片設定多個檢視。一旦使用 Image 類載入圖片，就可以透過多次例項化 ImageView 類來建立多個 ImageView 物件。

ImageView 類是一個 JavaFX 節點，它繪製使用 Image 類載入的圖片。為了顯示圖片的多個檢視，可以在 Application 類的 start() 方法中多次例項化此類。

這些多個檢視的大小、質量可能有所不同，也可能是原始圖片的精確副本。

但是，要做到這一點，您需要傳遞 Image 物件或源圖片的 URL 字串。建立 ImageView 物件的語法如下：

語法

// A new ImageView object is allocated
ImageView = new ImageView()

// ImageView object is allocated using
// the given Image object
ImageView imageview = new ImageView(Image image)

// ImageView object is allocated using
// the image loaded from a URL
ImageView imageview = new ImageView(String URL)

示例

以下程式是一個示例，演示瞭如何在 JavaFX 的場景中為圖片設定各種檢視。

將此程式碼儲存在名為 **MultipleViews.java** 的檔案中。

import java.io.FileInputStream; 
import java.io.FileNotFoundException; 
import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.image.Image;  
import javafx.scene.image.ImageView; 
import javafx.stage.Stage;  

public class MultipleViews extends Application {  
   @Override 
   public void start(Stage stage) throws FileNotFoundException {         
      //Creating an image 
      Image image = new Image(new FileInputStream("file path"));  
      
      //Setting the image view 1 
      ImageView imageView1 = new ImageView(image); 
      
      //Setting the position of the image 
      imageView1.setX(50); 
      imageView1.setY(25); 
      
      //setting the fit height and width of the image view 
      imageView1.setFitHeight(300); 
      imageView1.setFitWidth(250);         
      
      //Setting the preserve ratio of the image view 
      imageView1.setPreserveRatio(true); 
         
      //Setting the image view 2 
      ImageView imageView2 = new ImageView(image);
      
      //Setting the position of the image 
      imageView2.setX(350); 
      imageView2.setY(25); 
      
      //setting the fit height and width of the image view 
      imageView2.setFitHeight(150); 
      imageView2.setFitWidth(250);          
      
      //Setting the preserve ratio of the image view 
      imageView2.setPreserveRatio(true); 
         
      //Setting the image view 3 
      ImageView imageView3 = new ImageView(image);  
      
      //Setting the position of the image 
      imageView3.setX(350); 
      imageView3.setY(200); 
      
      //setting the fit height and width of the image view 
      imageView3.setFitHeight(100); 
      imageView3.setFitWidth(100);         
      
      //Setting the preserve ratio of the image view 
      imageView3.setPreserveRatio(true);  
      
      //Creating a Group object  
      Group root = new Group(imageView1, imageView2, imageView3);  
      
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 400);  
      
      //Setting title to the Stage 
      stage.setTitle("Multiple views of an image");  
      
      //Adding scene to the stage 
      stage.setScene(scene);  
      
      //Displaying the contents of the stage
      stage.show(); 
   }  
   public static void main(String args[]) { 
      launch(args); 
   } 
}

使用以下命令從命令提示符編譯並執行儲存的 java 檔案。

javac --module-path %PATH_TO_FX% --add-modules javafx.controls MultipleViews.java 
java --module-path %PATH_TO_FX% --add-modules javafx.controls MultipleViews

輸出

執行後，上述程式將生成一個 JavaFX 視窗，如下所示：

Multiple View

讀取和寫入圖片畫素

圖片的讀取和寫入在資料處理技術中很常見。圖片從根本上是由多個畫素組成的二維網格。它可以與人體細胞相關聯；因為它們包含圖片中的資訊。

因此，為了讀取和寫入圖片，我們通常指的是讀取和寫入其畫素。

JavaFX 還提供各種類和介面，例如 WritableImage、PixelReader、PixelWriter，以便讀取和寫入此類圖片畫素。

WritableImage 類用於根據應用程式提供的畫素或 PixelReader 物件從各種來源（包括檔案或 URL 中的圖片）讀取的畫素來構建自定義圖形圖片。

JavaFX 提供名為 **PixelReader** 和 **PixelWriter** 的介面來讀取和寫入圖片的畫素。

示例

以下示例演示瞭如何讀取和寫入圖片的畫素。在這裡，我們正在讀取圖片的顏色值並使其變暗。

將此程式碼儲存到名為WritingPixelsExample.java的檔案中。

import java.io.FileInputStream; 
import java.io.FileNotFoundException;  
import javafx.application.Application; 

import javafx.scene.Group;  
import javafx.scene.Scene; 

import javafx.scene.image.Image; 
import javafx.scene.image.ImageView; 
import javafx.scene.image.PixelReader; 
import javafx.scene.image.PixelWriter; 
import javafx.scene.image.WritableImage;
 
import javafx.scene.paint.Color; 
import javafx.stage.Stage;  

public class WritingPixelsExample extends Application {  
   @Override 
   public void start(Stage stage) throws FileNotFoundException {         
      //Creating an image 
      Image image = new Image(new FileInputStream("C:\\images\\logo.jpg")); 
      int width = (int)image.getWidth(); 
      int height = (int)image.getHeight(); 
         
      //Creating a writable image 
      WritableImage wImage = new WritableImage(width, height); 
         
      //Reading color from the loaded image 
      PixelReader pixelReader = image.getPixelReader(); 
      
      //getting the pixel writer 
      PixelWriter writer = wImage.getPixelWriter();           
      
      //Reading the color of the image 
      for(int y = 0; y < height; y++) { 
         for(int x = 0; x < width; x++) { 
            //Retrieving the color of the pixel of the loaded image   
            Color color = pixelReader.getColor(x, y); 
              
            //Setting the color to the writable image 
            writer.setColor(x, y, color.darker());              
         }
      }	
      //Setting the view for the writable image 
      ImageView imageView = new ImageView(wImage); 
              
      //Creating a Group object  
      Group root = new Group(imageView);  
            
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 500);  
            
      //Setting title to the Stage 
      stage.setTitle("Writing pixels ");  
            
      //Adding scene to the stage 
      stage.setScene(scene);  
            
      //Displaying the contents of the stage 
      stage.show();  
   }
   public static void main(String args[]) { 
      launch(args); 
   } 
}

使用以下命令從命令提示符編譯並執行儲存的 java 檔案。

javac --module-path %PATH_TO_FX% --add-modules javafx.controls WritingPixelsExample.java 
java --module-path %PATH_TO_FX% --add-modules javafx.controls WritingPixelsExample

輸出

執行後，上述程式將生成一個 JavaFX 視窗，如下所示：

Writing Pixels
列印頁面
上一頁
下一頁
廣告