JavaFX - TextFlow 佈局

JavaFX 中的 TextFlow 佈局

TextFlow 是一種佈局，它允許我們在單個流中設定多個文字節點，並根據 TextFlow 的字型、寬度和行間距調整其位置和對齊方式。它還可以嵌入物件，例如影像或形狀，這些物件可以插入文字內容中。名為 textFlow 的 javafx.scene.layout 包中的類表示文字流。要建立 TextFlow，我們可以使用下面列出的其中一個建構函式：

• TextFlow() - 建立一個空的 TextFlow。

• TextFlow(Node childNodes) - 使用給定的節點作為子節點建立 TextFlow。

要自定義 TextFlow 的外觀和行為，此類提供了兩個屬性，如下所示：

• lineSpacing - 此屬性為雙精度型別，用於定義文字物件之間的間距。您可以使用名為 setLineSpacing() 的方法設定此屬性。

• textAlignment - 此屬性表示窗格中文字物件的對齊方式。您可以使用 setTextAlignment() 方法為該屬性設定值。在此方法中，您可以傳遞四個值：CENTER、JUSTIFY、LEFT、RIGHT。

示例

以下程式是文字流佈局的示例。在此，我們使用字型 15 建立三個文字物件。將此程式碼儲存在名為 TextFlowExample.java 的檔案中。

import javafx.application.Application; 
import javafx.scene.Scene; 
import javafx.scene.paint.Color; 
import javafx.scene.text.Font; 
import javafx.scene.text.Text; 
import javafx.scene.text.TextAlignment; 
import javafx.scene.text.TextFlow; 
import javafx.stage.Stage; 
         
public class TextFlowExample extends Application { 
   @Override 
   public void start(Stage stage) {                     
      //Creating text objects  
      Text text1 = new Text("Welcome to Tutorialspoint "); 
      
      //Setting font to the text 
      text1.setFont(new Font(15)); 
      
      //Setting color to the text  
      text1.setFill(Color.DARKSLATEBLUE); 
       
      Text text2 = new Text("We provide free tutorials for readers in various technologies  "); 
      
      //Setting font to the text 
      text2.setFont(new Font(15)); 
      
      //Setting color to the text 
      text2.setFill(Color.DARKGOLDENROD); 
      Text text3 = new Text("\n Recently we started free video tutorials too "); 
      
      //Setting font to the text 
      text3.setFont(new Font(15)); 
      
      //Setting color to the text 
      text3.setFill(Color.DARKGRAY); 
       
      Text text4 = new Text("We believe in easy learning"); 
      
      //Setting font to the text 
      text4.setFont(new Font(15)); 
      text4.setFill(Color.MEDIUMVIOLETRED); 
       
      //Creating the text flow plane 
      TextFlow textFlowPane = new TextFlow(); 
       
      //Setting the line spacing between the text objects 
      textFlowPane.setTextAlignment(TextAlignment.JUSTIFY); 
       
      //Setting the width  
      textFlowPane.setPrefSize(600, 300); 
       
      //Setting the line spacing  
      textFlowPane.setLineSpacing(5.0); 
      
      //Adding cylinder to the pane  
      textFlowPane.getChildren().addAll(text1, text2, text3, text4);        
         
      //Creating a scene object 
      Scene scene = new Scene(textFlowPane, 400, 300);  
      
      //Setting title to the Stage 
      stage.setTitle("Textflow Layout in JavaFX");
      
      //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 TextFlowExample.java 
java --module-path %PATH_TO_FX% --add-modules javafx.controls TextflowExample

輸出

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

向 TextFlow 新增影像

也可以在 TextFlow 中嵌入影像。這是透過使用 JavaFX 的 Image 和 ImageView 類實現的。我們只需要例項化這些類並將 ImageView 物件傳遞給 TextFlow 類的建構函式，如下面的示例所示。將此程式碼儲存在名為 JavafxTextflow.java 的 Java 檔案中。

示例

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.FontPosture;
import javafx.scene.text.FontWeight;
import javafx.scene.text.Text;
import javafx.scene.text.TextAlignment;
import javafx.scene.text.TextFlow;
import javafx.stage.Stage;

public class JavafxTextflow extends Application {
   @Override
   public void start(Stage stage) {
      // Create some text nodes with different styles
      Text text1 = new Text("Hello");
      text1.setFill(Color.RED);
      text1.setFont(Font.font("Arial", FontWeight.BOLD, 20));

      Text text2 = new Text("JavaFX");
      text2.setFill(Color.BLUE);
      text2.setFont(Font.font("Arial", FontPosture.ITALIC, 20));

      Text text3 = new Text("\nThis is a ");
      text3.setFill(Color.BLACK);
      text3.setFont(Font.font("Arial", 16));

      Text text4 = new Text("TextFlow");
      text4.setFill(Color.GREEN);
      text4.setFont(Font.font("Arial", FontWeight.BOLD, FontPosture.ITALIC, 16));

      Text text5 = new Text(" example.");
      text5.setFill(Color.BLACK);
      text5.setFont(Font.font("Arial", 16));

      // Create an image node
      Image image = new Image("faviconTP.png");
      ImageView imageView = new ImageView(image);
      imageView.setFitWidth(100);
      imageView.setPreserveRatio(true);

      // Create a text flow with the text nodes and the image node
      TextFlow textFlow = new TextFlow(text1, text2, text3, text4, text5, imageView);

      // Set some properties of the text flow
      textFlow.setLineSpacing(10);
      textFlow.setTextAlignment(TextAlignment.CENTER);
      textFlow.setPrefWidth(300);

      // Create a scene and a stage
      Scene scene = new Scene(textFlow, 400, 300);
      stage.setTitle("TextFlow 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 JavafxTextflow.java 
java --module-path %PATH_TO_FX% --add-modules javafx.controls JavafxTextflow

輸出

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