JavaFX - 切變變換

使物件形狀傾斜的變換稱為切變變換。有兩種切變變換，**X 切變**和**Y 切變**。一種移動 X 座標值，另一種移動 Y 座標值。但是，在這兩種情況下，只有一個座標改變其座標，另一個座標保持其值不變。切變也稱為**傾斜**。

示例 1

以下是演示 JavaFX 中切變變換的程式。在這裡，我們在相同位置建立了 2 個多邊形（節點），具有相同的尺寸，但顏色不同（藍色和透明）。我們還在透明多邊形上應用了切變變換。

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

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.paint.Color; 
import javafx.scene.shape.Polygon; 
import javafx.scene.transform.Shear; 
import javafx.stage.Stage; 
         
public class XShearingExample extends Application { 
   @Override 
   public void start(Stage stage) {      
      Polygon hexagon1 = new Polygon();        
      
      //Adding coordinates to the hexagon 
      hexagon1.getPoints().addAll(new Double[]{         
         200.0, 50.0,
         400.0, 50.0, 
         450.0, 150.0,          
         400.0, 250.0, 
         200.0, 250.0,                   
         150.0, 150.0, 
      }); 
      //Setting the fill color for the hexagon 
      hexagon1.setFill(Color.BLUE); 
      
      hexagon1.setStroke(Color.BLACK); 
      Polygon hexagon2 = new Polygon();        
      
      //Adding coordinates to the hexagon 
      hexagon2.getPoints().addAll(new Double[]{        
         200.0, 50.0, 
         400.0, 50.0, 
         450.0, 150.0,          
         400.0, 250.0, 
         200.0, 250.0,                   
         150.0, 150.0, 
      }); 
      //Setting the fill color for the hexagon 
      hexagon2.setFill(Color.TRANSPARENT); 
      hexagon2.setStroke(Color.BLACK); 
       
      //Creating shear transformation 
      Shear shear = new Shear(); 
      
      //Setting the pivot points 
      shear.setPivotX(200); 
      shear.setPivotY(250); 
      
      //Setting the dimensions for the shear 
      shear.setX(0.5); 
      shear.setY(0.0); 
       
      //Adding the transformation to the polygon  
      hexagon2.getTransforms().addAll(shear); 
      
      //Creating a Group object  
      Group root = new Group(hexagon1, hexagon2); 
         
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 300);  
      
      //Setting title to the Stage 
      stage.setTitle("Shearing Example "); 
         
      //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 XShearingExample.java 
java --module-path %PATH_TO_FX% --add-modules javafx.controls XShearingExample

輸出

執行後，上述程式將生成如下所示的 JavaFX 視窗。

示例 2

在前面的示例中，我們已經看到了如何透過相對於 X 軸傾斜六邊形來執行 X 切變。在本例中，讓我們看看對另一個 JavaFX 二維形狀（例如五邊形）執行 Y 切變。

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

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.paint.Color; 
import javafx.scene.shape.Polygon; 
import javafx.scene.transform.Shear; 
import javafx.stage.Stage; 
         
public class YShearingExample extends Application { 
   @Override 
   public void start(Stage stage) {      
      Polygon pentagon1 = new Polygon();        
      
      //Adding coordinates to the pentagon 
      pentagon1.getPoints().addAll(new Double[]{         
         200.0, 50.0,
         400.0, 50.0, 
         450.0, 150.0,          
         400.0, 250.0, 
         200.0, 250.0,                    
      }); 
      //Setting the fill color for the pentagon 
      pentagon1.setFill(Color.ORANGE); 
      
      pentagon1.setStroke(Color.BLACK); 
      Polygon pentagon2 = new Polygon();        
      
      //Adding coordinates to the pentagon 
      pentagon2.getPoints().addAll(new Double[]{        
         200.0, 50.0, 
         400.0, 50.0, 
         450.0, 150.0,          
         400.0, 250.0, 
         200.0, 250.0,                    
      }); 
      //Setting the fill color for the pentagon 
      pentagon2.setFill(Color.TRANSPARENT); 
      pentagon2.setStroke(Color.BLACK); 
       
      //Creating shear transformation 
      Shear shear = new Shear(); 
      
      //Setting the pivot points 
      shear.setPivotX(200); 
      shear.setPivotY(250); 
      
      //Setting the dimensions for the shear 
      shear.setX(0.0); 
      shear.setY(0.5); 
       
      //Adding the transformation to the polygon  
      pentagon2.getTransforms().addAll(shear); 
      
      //Creating a Group object  
      Group root = new Group(pentagon1, pentagon2); 
         
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 400);  
      
      //Setting title to the Stage 
      stage.setTitle("Shearing Example "); 
         
      //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 YShearingExample.java 
java --module-path %PATH_TO_FX% --add-modules javafx.controls YShearingExample

輸出

執行後，上述程式將生成如下所示的 JavaFX 視窗。