JavaFX - 徑向漸變圖案



類似線性漸變圖案,還有各種型別的漸變圖案,它們描述了漸變的流動方式。其他型別包括徑向、角形、反射和菱形漸變圖案。在本章中,我們將學習徑向漸變圖案。

徑向漸變圖案是另一種型別的漸變圖案,它從中心點開始,以圓形方式流動到半徑處。簡單來說,徑向漸變包含以同心圓形式表示的兩個或多個顏色停止點。

JavaFX 還提供這種型別的顏色圖案來填充圓形型別的 2D 形狀,例如正圓形或橢圓形等。

應用徑向漸變圖案

要將徑向漸變圖案應用於節點,請例項化 GradientPattern 類並將它的物件傳遞給 setFill()、setStroke() 方法。

此類的建構函式接受一些引數,其中一些引數是 -

  • startX, startY - 這些雙精度屬性表示漸變起點的 x 和 y 座標。

  • endX, endY - 這些雙精度屬性表示漸變終點的 x 和 y 座標。

  • cycleMethod - 此引數定義如何透過起點和終點定義顏色漸變邊界外的區域,以及如何填充這些區域。

  • proportional - 這是一個布林變數;將此屬性設定為 true 時,將開始和結束位置設定為比例。

  • Stops - 此引數定義沿漸變線的顏色停止點。

//Setting the radial gradient 
Stop[] stops = new Stop[] { 
   new Stop(0.0, Color.WHITE),  
   new Stop(0.3, Color.RED), 
   new Stop(1.0, Color.DARKRED) 
};        

RadialGradient radialGradient = 
   new RadialGradient(0, 0, 300, 178, 60, false, CycleMethod.NO_CYCLE, stops);

示例

以下示例演示瞭如何在 JavaFX 中將徑向漸變圖案應用於節點。在這裡,我們建立了一個圓形和一個文字節點,並向它們應用漸變圖案。

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

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 

import javafx.scene.paint.Color; 
import javafx.scene.paint.CycleMethod; 
import javafx.scene.paint.RadialGradient;  
import javafx.scene.paint.Stop; 

import javafx.stage.Stage; 
import javafx.scene.shape.Circle; 
import javafx.scene.text.Font; 
import javafx.scene.text.Text;   

public class RadialGradientExample extends Application {  
   @Override 
   public void start(Stage stage) { 
      //Drawing a Circle 
      Circle circle = new Circle(); 
      
      //Setting the properties of the circle 
      circle.setCenterX(300.0f); 
      circle.setCenterY(180.0f); 
      circle.setRadius(90.0f);  
      
      //Drawing a text 
      Text text = new Text("This is a colored circle"); 
      
      //Setting the font of the text 
      text.setFont(Font.font("Edwardian Script ITC", 50)); 
      
      //Setting the position of the text 
      text.setX(155); 
      text.setY(50);  
      
      //Setting the radial gradient 
      Stop[] stops = new Stop[] { 
         new Stop(0.0, Color.WHITE),  
         new Stop(0.3, Color.RED), 
         new Stop(1.0, Color.DARKRED) 
      };        
      RadialGradient radialGradient = 
         new RadialGradient(0, 0, 300, 178, 60, false, CycleMethod.NO_CYCLE, stops);  
      
      //Setting the radial gradient to the circle and text 
      circle.setFill(radialGradient); 
      text.setFill(radialGradient);  
      
      //Creating a Group object  
      Group root = new Group(circle, text);  
      
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 300); 
      
      //Setting title to the Stage 
      stage.setTitle("Radial Gradient 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 RadialGradientExample.java 
java --module-path %PATH_TO_FX% --add-modules javafx.controls RadialGradientExample

輸出

執行後,上述程式生成一個 JavaFX 視窗,如下所示 -

Radial Gradient

示例

徑向漸變圖案不適用於非圓形形狀;也就是說,您只能在圓形和橢圓形形狀上應用徑向漸變。

在下面的示例中,讓我們嘗試將徑向漸變圖案應用於矩形形狀。將此程式碼儲存在名為 RectangleRadialGradient.java 的檔案中。

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.paint.Color; 
import javafx.scene.paint.CycleMethod; 
import javafx.scene.paint.RadialGradient;  
import javafx.scene.paint.Stop; 
import javafx.stage.Stage; 
import javafx.scene.shape.Rectangle;  

public class RectangleRadialGradient extends Application {  
   @Override 
   public void start(Stage stage) { 
      Rectangle rct = new Rectangle(50.0f, 50.0f, 200.0f, 100.0f); 
 
      
      Stop[] stops = new Stop[] { 
         new Stop(0.0, Color.WHITE),  
         new Stop(0.3, Color.RED), 
         new Stop(1.0, Color.DARKRED) 
      };        
      RadialGradient radialGradient = 
         new RadialGradient(0, 0, 300, 178, 60, false, CycleMethod.NO_CYCLE, stops);  
 
      rct.setFill(radialGradient);  
  
      Group root = new Group(rct);  
      Scene scene = new Scene(root, 300, 300); 
      stage.setTitle("Radial Gradient Example");   
      stage.setScene(scene);  
      stage.show(); 
   }
   public static void main(String args[]) { 
      launch(args); 
   } 
}

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

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

輸出

執行後,您將只看到形狀中最外層的漸變顏色,如下所示 -

Rectangle Radial Gradient
廣告