Align content of a TextArea in JavaFX

Question

I'm making a simple text editor for training purposes. I want to create a button which would center my text input from TextArea just like in MS Word. I have my button in FXML, but I don't know what method should I use for my TextArea object, I tried setStyle() or getChild() but neither worked.

<Button onAction="#toTheCenter"  text="center"/>

Thats my button in FXML

<center>
    <TextArea fx:id="textArea"/>
</center>

Thats TextArea

@FXML
private void toTheCenter(ActionEvent event){
    String text = textArea.getText();
}

And thats the method from controller.

Netbeans is the ide , but like i wanted to know did you use scenebuiler for styling the fx application, i gave an answer please check if it helps — Rahul Singh, Oct 31 '16 at 11:48

score 2 · Accepted Answer · answered Oct 31 '16 at 11:53

You need to set the -fx-text-alignment property on the text node of the text area.

The best way to do this dynamically is to define a custom CSS pseudoclass for the text area:

PseudoClass centered = PseudoClass.getPseudoClass("centered");

and then in your external CSS file you can do

.text-area:centered .text {
    -fx-text-alignment: center ;
}

Then you can call

textArea.pseudoClassStateChanged(centered, true);

to switch centering on, and

textArea.pseudoClassStateChanged(centered, false);

to switch it off.

Here is a SSCCE (put the CSS code above in centering-text-area.css):

import javafx.application.Application;
import javafx.css.PseudoClass;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.TextArea;
import javafx.scene.control.ToggleButton;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;

public class TextAreaWithCentering extends Application {

    @Override
    public void start(Stage primaryStage) {

        TextArea textArea = new TextArea();

        PseudoClass centered = PseudoClass.getPseudoClass("centered");

        ToggleButton center = new ToggleButton("Center");
        center.selectedProperty().addListener((obs, wasCentered, isNowCentered) -> 
                textArea.pseudoClassStateChanged(centered, isNowCentered));

        BorderPane.setAlignment(center, Pos.CENTER);
        BorderPane.setMargin(center, new Insets(5));
        BorderPane root = new BorderPane(textArea, null, null, center, null);

        Scene scene = new Scene(root, 600, 600);

        scene.getStylesheets().add("centering-text-area.css");

        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

score 1 · Answer 2 · edited Oct 31 '16 at 11:55

1

#text-area *.text { -fx-text-alignment: center; }

Create a style.css file in your project folder and then add the following line to the java code.

scene.getStylesheets().addAll(this.getClass().getResource("style.css").toExternalForm()); primaryStage.setScene(scene);

edited Oct 31 '16 at 11:55

fabian

80,457
12
86
114

answered Oct 31 '16 at 11:47

Rahul Singh

19,030
11
64
86

Updated the answer, but you should have asked this in your question – Rahul Singh Oct 31 '16 at 11:53

Align content of a TextArea in JavaFX

2 Answers2

Linked