Center text on Canvas?

Question

Can someone please give me an example on how to center text on a JavaFX 2 Canvas?

GraphicsContext has some functions like setTextAlign, but I am not sure on how to use all those methods and which of them I really need. I want to center my text vertically and horizontally.

score 23 · Accepted Answer · answered Feb 14 '13 at 20:17

Set the text align to center.
Set the text baseline to center.
Draw the text in the center of your canvas (by positioning it at half the canvas width and height).

Here is a sample:

import javafx.application.Application;
import static javafx.application.Application.launch;
import javafx.geometry.VPos;
import javafx.scene.*;
import javafx.scene.canvas.*;
import javafx.scene.layout.StackPane;
import javafx.scene.text.TextAlignment;
import javafx.stage.Stage;

public class TextCanvas extends Application {
    @Override public void start(Stage primaryStage) {
        Canvas canvas = new Canvas(175, 40);
        GraphicsContext gc = canvas.getGraphicsContext2D();
        gc.setTextAlign(TextAlignment.CENTER);
        gc.setTextBaseline(VPos.CENTER);
        gc.fillText(
            "Text centered on your Canvas", 
            Math.round(canvas.getWidth()  / 2), 
            Math.round(canvas.getHeight() / 2)
        );

        StackPane layout = new StackPane();
        layout.getChildren().addAll(canvas);

        primaryStage.setScene(new Scene(layout));
        primaryStage.show();
    }
    public static void main(String[] args) { launch(args); }
}

centered text on canvas

Thank you jewelsea, works exactly as expected and seeing the sample I now also understand the methods. — stefan.at.kotlin, Feb 14 '13 at 20:24

Rachel Gallen · Answer 2 · 2013-02-14T20:10:38.843

0

you wanna use

  control.setAlignment(Pos.CENTER); and

  control.setStyle("-fx-alignment: CENTER;");

see here for some downloadable sample code of this in action.

edited Feb 14 '13 at 20:10

answered Feb 14 '13 at 19:55

Rachel Gallen

27,943
21
72
81

1

Hmm, unfortunately a Canvas and all its content is one complete node, so I fear this won't work. – stefan.at.kotlin Feb 14 '13 at 19:57
I had a rough look at it and my impression is, that this is for positioning nodes in containers, e.g. in a HBox. However a Canvas is not a container / the text in a Canvas is not a Node? – stefan.at.kotlin Feb 14 '13 at 20:17

Center text on Canvas?

2 Answers2