9-10XIST
Text Align Command
PFont f;
void setup() {
size(640, 400);
// Create the font
printArray(PFont.list());
f = createFont("Arial", 24);
textFont(f);
}
void draw() {
background(255);
textAlign(RIGHT);
drawType(width * 0.25);
textAlign(CENTER);
drawType(width * 0.5);
textAlign(LEFT);
drawType(width * 0.75);
}
void drawType(float x) {
line(x, 0, x, 65);
line(x, 335, x, height);
fill(0,75,153);
text("reimagining", x, 95);
fill(0,102,204);
text("empathy", x, 130);
fill(0,128,255);
text("for a", x, 165);
fill(51,153,255);
text("whole", x, 210);
fill(102,178,255);
text("new", x, 245);
fill(153,204,255);
text("connected", x, 280);
fill(204,229,255);
text("world", x, 315);
}
Code
Image
This code aligns the texts in a straight line on the right, centre and left side of the screen. The main function used, hence the name is textAlign(). This exercise uses all the parameters LEFT, CENTER and RIGHT. I modified the exercise by using a sentence instead of a single word. I used one of the phases that I had submitted for the empathy project, “Reimagining empathy for a whole new connected world” Because the phrase was long, I had to input new text() functions into the code. To make the exercise more interesting, I changed the colours of the text to different shades of blue. The first word had the darkest shade and the last word had the lightest shade. This created a gradient effect. I feel like this exercise highlights the phrase well as the colours draw the audience’s attention.
​
(click the functions underlined to learn more about them)