| Name | textAlign() |
||||
|---|---|---|---|---|---|
| Processing.js Behavior | Font support for the Canvas element varies across browsers. FireFox currently has the best support, but still uses a pre-defined set of fonts. (Documentation to follow soon.) Good alternatives to the browser's Canvas-font functions are available: such as the Glyph method. See also: Canvas Text, BurntToys Bauhaus.
Please use the following demos to learn how fonts can be rendered in Firefox with Processing.js: Letters, Words, width() |
||||
| Examples |  PFont font;
// The font must be located in the current sketch's
// "data" directory to load successfully
font = loadFont("EurekaMonoCond-Bold.ttf");
textFont(font, 20);
textAlign(RIGHT);
text("word", 50, 30);
textAlign(CENTER);
text("word", 50, 50);
textAlign(LEFT);
text("word", 50, 70); |
||||
| Description | Sets the current alignment for drawing text. The parameters LEFT, CENTER, and RIGHT set the display characteristics of the letters in relation to the values for the x and y parameters of the text() function. An optional second parameter can be used to vertically align the text. BASELINE is the default, and the vertical alignment will be reset to BASELINE if the second parameter is not used. The TOP and CENTER parameters are straightforward. The BOTTOM parameter offsets the line based on the current textDescent(). For multiple lines, the final line will be aligned to the bottom, with the previous lines appearing above it. When using text() with width and height parameters, BASELINE is ignored, and treated as TOP. (Otherwise, text would by default draw outside the box, since BASELINE is the default setting. BASELINE is not a useful drawing mode for text drawn in a rectangle.) The vertical alignment is based on the value of textAscent(), which many fonts do not specify correctly. It may be necessary to use a hack and offset by a few pixels by hand so that the offset looks correct. To do this as less of a hack, use some percentage of textAscent() or textDescent() so that the hack works even if you change the size of the font. |
||||
| Syntax | textAlign(ALIGN) textAlign(ALIGN, YALIGN) |
||||
| Parameters |
|
||||
| Returns | None | ||||
| Usage | Web & Application | ||||
| Related |
loadFont() PFont text() |
This reference is licensed under the CC BY-NC-SA 2.0 license:
