JavaFX - Màu sắc

Để áp dụng màu cho một ứng dụng, JavaFX cung cấp nhiều lớp khác nhau trong gói javafx.scene.paintgói hàng. Gói này chứa một lớp trừu tượng có tên là Paint và nó là lớp cơ sở của tất cả các lớp được sử dụng để áp dụng màu sắc.

Sử dụng các lớp này, bạn có thể áp dụng màu theo các mẫu sau:

• Uniform - Trong mẫu này, màu được áp dụng đồng nhất trong toàn bộ nút.

• Image Pattern - Điều này cho phép bạn lấp đầy vùng của nút bằng một mẫu hình ảnh.

• Gradient- Trong mẫu này, màu áp dụng cho nút thay đổi từ điểm này sang điểm khác. Nó có hai loại gradient cụ thể làLinear Gradient và Radial Gradient.

Tất cả các lớp nút mà bạn có thể áp dụng màu, chẳng hạn như Shape, Text (bao gồm Cảnh), có các phương thức được đặt tên setFill() và setStroke(). Điều này sẽ giúp thiết lập giá trị màu của các nút và nét vẽ của chúng tương ứng.

Các phương thức này chấp nhận một đối tượng kiểu Paint. Do đó, để tạo một trong hai loại hình ảnh này, bạn cần phải khởi tạo các lớp này và chuyển đối tượng làm tham số cho các phương thức này.

Áp dụng màu cho các nút

Để đặt mẫu màu đồng nhất cho các nút, bạn cần chuyển một đối tượng có màu của lớp cho setFill(), setStroke() phương pháp như sau -

//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);

Trong khối mã trên, chúng ta đang sử dụng các biến tĩnh của lớp màu để tạo một đối tượng màu.

Theo cách tương tự, bạn cũng có thể sử dụng các giá trị RGB hoặc tiêu chuẩn HSB của màu hoặc mã băm web của màu sắc như hình dưới đây -

//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);

Thí dụ

Sau đây là một ví dụ minh họa, cách áp dụng màu cho các nút trong JavaFX. Ở đây, chúng tôi đang tạo một vòng tròn và các nút văn bản và áp dụng màu sắc cho chúng.

Lưu mã này trong một tệp có tên 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); 
   } 
}

Biên dịch và thực thi tệp java đã lưu từ dấu nhắc lệnh bằng các lệnh sau.

Javac ColorExample.java 
java ColorExample

Khi thực thi, chương trình trên tạo một cửa sổ JavaFX như sau:

Áp dụng mẫu hình ảnh cho các nút

Để áp dụng một mẫu hình ảnh cho các nút, hãy khởi tạo ImagePattern và chuyển đối tượng của nó cho setFill(), setStroke() các phương pháp.

Hàm tạo của lớp này chấp nhận sáu tham số cụ thể là:

• Image - Đối tượng của hình ảnh mà bạn muốn tạo mẫu sử dụng.

• x and y - Các biến kép đại diện cho tọa độ (x, y) của điểm gốc của hình chữ nhật neo.

• height and width - Các biến kép đại diện cho chiều cao và chiều rộng của hình ảnh được sử dụng để tạo mẫu.

• isProportional- Đây là một biến Boolean; khi đặt thuộc tính này thành true, vị trí bắt đầu và vị trí kết thúc được đặt tỷ lệ thuận.

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

Thí dụ

Sau đây là một ví dụ minh họa cách áp dụng mẫu hình ảnh cho các nút trong JavaFX. Ở đây, chúng tôi đang tạo một vòng tròn và một nút văn bản và áp dụng một mẫu hình ảnh cho chúng.

Lưu mã này trong một tệp có tên 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); 
   } 
}

Biên dịch và thực thi tệp java đã lưu từ dấu nhắc lệnh bằng các lệnh sau.

Javac ImagePatternExample.java 
java ImagePatternExample

Khi thực thi, chương trình trên tạo một cửa sổ JavaFX như sau:

Áp dụng mô hình chuyển màu tuyến tính

Để áp dụng Mẫu Gradient Tuyến tính cho các nút, hãy khởi tạo LinearGradient và chuyển đối tượng của nó cho setFill(), setStroke() các phương pháp.

Hàm tạo của lớp này chấp nhận năm tham số cụ thể là:

• startX, startY - Các thuộc tính kép này đại diện cho các tọa độ x và y của điểm bắt đầu của gradient.

• endX, endY - Các thuộc tính kép này đại diện cho tọa độ x và y của điểm kết thúc của gradient.

• cycleMethod - Đối số này xác định cách lấp đầy các vùng bên ngoài giới hạn gradient màu, được xác định bởi điểm bắt đầu và điểm kết thúc.

• proportional- Đây là một biến Boolean; về việc đặt thuộc tính này thànhtrue, vị trí bắt đầu và kết thúc được đặt theo tỷ lệ.

• Stops - Đối số này xác định các điểm dừng màu dọc theo đường gradient.

//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);

Thí dụ

Sau đây là một ví dụ minh họa cách áp dụng một mẫu gradient cho các nút trong JavaFX. Ở đây, chúng tôi đang tạo một vòng tròn và một nút văn bản và áp dụng mô hình gradient tuyến tính cho chúng.

Lưu mã này trong một tệp có tên 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); 
   } 
}

Biên dịch và thực thi tệp java đã lưu từ dấu nhắc lệnh bằng các lệnh sau.

Javac LinearGradientExample.java 
java LinearGradientExample

Khi thực thi, chương trình trên tạo một cửa sổ JavaFX như sau:

Áp dụng mô hình chuyển màu xuyên tâm

Để áp dụng Mẫu Gradient Radial cho các nút, hãy khởi tạo GradientPattern và chuyển đối tượng của nó cho setFill(), setStroke() các phương pháp.

Hàm tạo của lớp này chấp nhận một vài tham số, một số trong số đó là:

• startX, startY - Các thuộc tính kép này đại diện cho các tọa độ x và y của điểm bắt đầu của gradient.

• endX, endY - Các thuộc tính kép này đại diện cho tọa độ x và y của điểm kết thúc của gradient.

• cycleMethod - Đối số này xác định cách các vùng bên ngoài giới hạn gradient màu được xác định bởi điểm bắt đầu và điểm kết thúc và cách chúng nên được tô.

• proportional- Đây là một biến Boolean; về việc đặt thuộc tính này thànhtrue vị trí bắt đầu và kết thúc được đặt theo tỷ lệ.

• Stops - Đối số này xác định các điểm dừng màu dọc theo đường gradient.

//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);

Thí dụ

Sau đây là một ví dụ minh họa cách áp dụng một mẫu gradient xuyên tâm cho các nút trong JavaFX. Ở đây, chúng tôi đang tạo một vòng tròn và một nút văn bản và áp dụng mô hình gradient cho chúng.

Lưu mã này trong một tệp có tên 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); 
   } 
}

Biên dịch và thực thi tệp java đã lưu từ dấu nhắc lệnh bằng các lệnh sau.

Javac RadialGradientExample.java 
java RadialGradientExample

Khi thực thi, chương trình trên tạo một cửa sổ JavaFX như sau: