TextArea

A TextArea enables the user to enter multiple lines of text.

If you want to let the user enter multiple lines of text, you may create several instances of TextField. A better alternative, however, is to use TextArea, which enables the user to enter multiple lines of text. Figure below lists the properties and constructors in TextArea.

Here is an example of creating a text area with 5 rows and 20 columns, wrapped to the next line, red text color, and Courier font 20 pixels.

TextArea taNote = new TextArea("This is a text area");
taNote.setPrefColumnCount(20);
taNote.setPrefRowCount(5);
taNote.setWrapText(true);
taNote.setStyle("-fx-text-fill: red");
taNote.setFont(Font.font("Times", 20));

TextArea provides scrolling, but often it is useful to create a ScrollPane object to hold an instance of TextArea and let ScrollPane handle scrolling for TextArea, as follows:

// Create a scroll pane to hold text area
ScrollPane scrollPane = new ScrollPane(taNote);

You can place any node in a ScrollPane. ScrollPane provides vertical and horizontal scrolling automatically if the control is too large to fit in the viewing area.

We now give a program that displays an image and a short text in a label, and a long text in a text area, as shown in Figure below.

Here are the major steps in the program:

1. Define a class named DescriptionPane that extends BorderPane, as shown in the code below (a). This class contains a text area inside a scroll pane, and a label for displaying an image icon and a title. The class DescriptionPane will be reused in later examples.
2. Define a class named TextAreaDemo that extends Application, as shown in the code below (b). Create an instance of DescriptionPane and add it to the scene. The relationship between DescriptionPane and TextAreaDemo is shown in Figure below.

(a)

package application;
import javafx.geometry.Insets;
import javafx.scene.control.Label;
import javafx.scene.control.ContentDisplay;
import javafx.scene.control.ScrollPane;
import javafx.scene.control.TextArea;
import javafx.scene.image.ImageView;
import javafx.scene.layout.BorderPane;
import javafx.scene.text.Font;

public class DescriptionPane extends BorderPane {
    /** Label for displaying an image and a title */
    private Label lblImageTitle = new Label();

    /** Text area for displaying text */
    private TextArea taDescription = new TextArea();

    public DescriptionPane() {
        // Center the icon and text and place the text under the icon
        lblImageTitle.setContentDisplay(ContentDisplay.TOP);
        lblImageTitle.setPrefSize(200, 100);

        // Set the font in the label and the text field
        lblImageTitle.setFont(new Font("SansSerif", 16));
        taDescription.setFont(new Font("Serif", 14));

        taDescription.setWrapText(true);
        taDescription.setEditable(false);

        // Create a scroll pane to hold the text area
        ScrollPane scrollPane = new ScrollPane(taDescription);

        // Place label and scroll pane to hold the text area
        setLeft(lblImageTitle);
        setCenter(scrollPane);
        setPadding(new Insets(5, 5, 5, 5));
    }

    /** Set the title */
    public void setTitle(String title) {
        lblImageTitle.setText(title);
    }

    /** Set the image view */
    public void setImageView(ImageView icon) {
        lblImageTitle.setGraphic(icon);
    }

    /** Set the text description */
    public void setDescription(String text) {
        taDescription.setText(text);
    }
}

The text area is inside a ScrollPane (line 31), which provides scrolling functions for the text area.

The wrapText property is set to true (line 27) so that the line is automatically wrapped when the text cannot fit in one line. The text area is set as noneditable (line 28), so you cannot edit the description in the text area.

It is not necessary to define a separate class for DescriptionPane in this example. However, this class was defined for reuse in the next section, where you will use it to display a description pane for various images.

(b)

The program creates an instance of DescriptionPane (line 11), and sets the title (line 14), image (line 16), and text in the description pane (line 17). DescriptionPane is a subclass of Pane. DescriptionPane contains a label for displaying an image and a title, and a text area for displaying a description of the image.