JavaFX - สี

ในการใช้สีกับแอปพลิเคชัน JavaFX มีคลาสต่างๆในแพ็คเกจ javafx.scene.paintแพ็คเกจ แพคเกจนี้ประกอบด้วยคลาสนามธรรมชื่อ Paint และเป็นคลาสพื้นฐานของคลาสทั้งหมดที่ใช้ในการใช้สี

เมื่อใช้คลาสเหล่านี้คุณสามารถใช้สีในรูปแบบต่อไปนี้ -

• Uniform - ในรูปแบบนี้สีจะถูกใช้อย่างสม่ำเสมอตลอดทั้งโหนด

• Image Pattern - ช่วยให้คุณสามารถเติมเต็มพื้นที่ของโหนดด้วยรูปแบบรูปภาพ

• Gradient- ในรูปแบบนี้สีที่ใช้กับโหนดจะแตกต่างกันไปในแต่ละจุด มีการไล่ระดับสี 2 แบบคือLinear Gradient และ Radial Gradient.

คลาสโหนดทั้งหมดที่คุณสามารถใช้สีเช่น Shape, Text (รวมถึงฉาก) มีชื่อเมธอด setFill() และ setStroke(). สิ่งเหล่านี้จะช่วยในการกำหนดค่าสีของโหนดและจังหวะตามลำดับ

วิธีการเหล่านี้ยอมรับวัตถุประเภท Paint ดังนั้นในการสร้างรูปภาพประเภทใดประเภทหนึ่งเหล่านี้คุณต้องสร้างอินสแตนซ์คลาสเหล่านี้และส่งออบเจ็กต์เป็นพารามิเตอร์ไปยังเมธอดเหล่านี้

การใช้สีกับโหนด

ในการตั้งค่ารูปแบบสีสม่ำเสมอให้กับโหนดคุณต้องส่งออบเจ็กต์ของสีคลาสไปยังไฟล์ setFill(), setStroke() วิธีการดังนี้ -

//Setting color to the text 
Color color = new Color.BEIGE 
text.setFill(color); 

//Setting color to the stroke 
Color color = new Color.DARKSLATEBLUE 
circle.setStroke(color);

ในบล็อกโค้ดด้านบนเราใช้ตัวแปรคงที่ของคลาสสีเพื่อสร้างวัตถุสี

ในทำนองเดียวกันคุณยังสามารถใช้ค่า RGB หรือมาตรฐาน HSB ของการระบายสีหรือรหัสสีแฮชของเว็บดังที่แสดงด้านล่าง -

//creating color object by passing RGB values 
Color c = Color.rgb(0,0,255);   

//creating color object by passing HSB values
Color c = Color.hsb(270,1.0,1.0);  

//creating color object by passing the hash code for web 
Color c = Color.web("0x0000FF",1.0);

ตัวอย่าง

ต่อไปนี้เป็นตัวอย่างที่แสดงให้เห็นถึงวิธีการใช้สีกับโหนดใน JavaFX ที่นี่เรากำลังสร้างวงกลมและโหนดข้อความและใช้สีกับมัน

บันทึกรหัสนี้ในไฟล์ที่มีชื่อ ColorExample.java.

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.paint.Color; 
import javafx.stage.Stage; 
import javafx.scene.shape.Circle; 
import javafx.scene.text.Font; 
import javafx.scene.text.Text; 
         
public class ColorExample 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); 
       
      //Setting color to the circle 
      circle.setFill(Color.DARKRED);    
      
      //Setting the stroke width 
      circle.setStrokeWidth(3); 
      
      //Setting color to the stroke  
      circle.setStroke(Color.DARKSLATEBLUE);
      
      //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 color to the text 
      text.setFill(Color.BEIGE); 
      text.setStrokeWidth(2); 
      text.setStroke(Color.DARKSLATEBLUE); 
         
      //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("Color 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 ColorExample.java 
java ColorExample

ในการดำเนินการโปรแกรมด้านบนจะสร้างหน้าต่าง JavaFX ดังนี้ -

การนำรูปแบบรูปภาพไปใช้กับโหนด

ในการใช้รูปแบบรูปภาพกับโหนดให้สร้างอินสแตนซ์ไฟล์ ImagePattern คลาสและส่งผ่านวัตถุไปยัง setFill(), setStroke() วิธีการ

ตัวสร้างของคลาสนี้ยอมรับพารามิเตอร์หกตัว ได้แก่ -

• Image - วัตถุของภาพที่คุณต้องการสร้างรูปแบบ

• x and y - ตัวแปรคู่ที่แสดงพิกัด (x, y) จุดกำเนิดของรูปสี่เหลี่ยมผืนผ้าจุดยึด

• height and width - ตัวแปรคู่แทนความสูงและความกว้างของรูปภาพที่ใช้ในการสร้างรูปแบบ

• isProportional- นี่คือตัวแปรบูลีน ในการตั้งค่าคุณสมบัตินี้เป็นจริงตำแหน่งเริ่มต้นและจุดสิ้นสุดจะถูกกำหนดให้เป็นสัดส่วน

ImagePattern radialGradient = new ImagePattern(dots, 20, 20, 40, 40, false);

ตัวอย่าง

ต่อไปนี้เป็นตัวอย่างที่สาธิตวิธีการใช้รูปแบบรูปภาพกับโหนดใน JavaFX ที่นี่เรากำลังสร้างวงกลมและโหนดข้อความและใช้รูปแบบภาพกับพวกเขา

บันทึกรหัสนี้ในไฟล์ที่มีชื่อ ImagePatternExample.java.

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

import javafx.scene.paint.Color; 
import javafx.scene.paint.ImagePattern; 
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 ImagePatternExample 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 image pattern 
      String link = "https://encrypted-tbn1.gstatic.com" 
         + "/images?q=tbn:ANd9GcRQub4GvEezKMsiIf67U" 
         + "rOxSzQuQ9zl5ysnjRn87VOC8tAdgmAJjcwZ2qM";       
      
      Image image = new Image(link); 
      ImagePattern radialGradient = new ImagePattern(image, 20, 20, 40, 40, false); 
       
      //Setting the linear 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("Image pattern 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 ImagePatternExample.java 
java ImagePatternExample

ในการดำเนินการโปรแกรมด้านบนจะสร้างหน้าต่าง JavaFX ดังนี้ -

ใช้ Linear Gradient Pattern

หากต้องการใช้รูปแบบการไล่ระดับสีเชิงเส้นกับโหนดให้สร้างอินสแตนซ์ไฟล์ LinearGradient คลาสและส่งผ่านวัตถุไปยัง setFill(), setStroke() วิธีการ

ตัวสร้างของคลาสนี้ยอมรับพารามิเตอร์ห้าตัว ได้แก่ -

• startX, startY - คุณสมบัติคู่เหล่านี้แสดงถึงพิกัด x และ y ของจุดเริ่มต้นของการไล่ระดับสี

• endX, endY - คุณสมบัติคู่เหล่านี้แสดงถึงพิกัด x และ y ของจุดสิ้นสุดของการไล่ระดับสี

• cycleMethod - อาร์กิวเมนต์นี้กำหนดวิธีการเติมพื้นที่นอกขอบเขตการไล่ระดับสีซึ่งกำหนดโดยจุดเริ่มต้นและจุดสิ้นสุด

• proportional- นี่คือตัวแปรบูลีน ในการตั้งค่าคุณสมบัตินี้เป็นtrueสถานที่เริ่มต้นและจุดสิ้นสุดจะถูกกำหนดเป็นสัดส่วน

• Stops - อาร์กิวเมนต์นี้กำหนดจุดหยุดสีตามเส้นไล่ระดับสี

//Setting the linear gradient 
Stop[] stops = new Stop[] { 
   new Stop(0, Color.DARKSLATEBLUE),  
   new Stop(1, Color.DARKRED)
};  
LinearGradient linearGradient = 
   new LinearGradient(0, 0, 1, 0, true, CycleMethod.NO_CYCLE, stops);

ตัวอย่าง

ต่อไปนี้เป็นตัวอย่างที่สาธิตวิธีการใช้รูปแบบการไล่ระดับสีกับโหนดใน JavaFX ที่นี่เรากำลังสร้างวงกลมและโหนดข้อความและใช้รูปแบบการไล่ระดับสีเชิงเส้นกับพวกเขา

บันทึกรหัสนี้ในไฟล์ที่มีชื่อ LinearGradientExample.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.LinearGradient; 
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 LinearGradientExample 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", 55)); 
      
      //Setting the position of the text 
      text.setX(140); 
      text.setY(50); 
       
      //Setting the linear gradient 
      Stop[] stops = new Stop[] { 
         new Stop(0, Color.DARKSLATEBLUE),  
         new Stop(1, Color.DARKRED)
      };  
      LinearGradient linearGradient = 
         new LinearGradient(0, 0, 1, 0, true, CycleMethod.NO_CYCLE, stops); 
       
      //Setting the linear gradient to the circle and text 
      circle.setFill(linearGradient); 
      text.setFill(linearGradient); 
         
      //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("Linear 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 LinearGradientExample.java 
java LinearGradientExample

ในการดำเนินการโปรแกรมด้านบนจะสร้างหน้าต่าง JavaFX ดังนี้ -

ใช้ Radial Gradient Pattern

หากต้องการใช้รูปแบบการไล่ระดับสีแบบเรเดียลกับโหนดให้สร้างอินสแตนซ์ไฟล์ 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 RadialGradientExample.java 
java RadialGradientExample

ในการดำเนินการโปรแกรมด้านบนจะสร้างหน้าต่าง JavaFX ดังนี้ -