Keyboard Functions.

Keyboard Functions. Modified from code by Martin. Original ‘Color Typewriter’ concept by John Maeda.

Click on the window to give it focus and press the letter keys to type colors. The keyboard function keyPressed() is called whenever a key is pressed. keyReleased() is another keyboard function that is called when a key is released.

 
int maxHeight = 40;
int minHeight = 20;
int letterHeight = maxHeight; // Height of the letters
int letterWidth = 20;          // Width of the letter

int x = -letterWidth;          // X position of the letters
int y = 0;                      // Y position of the letters

boolean newletter;              

int numChars = 26;      // There are 26 characters in the alphabet
color[] colors = new color[numChars];

void setup() {
  size(640, 360);
  noStroke();
  colorMode(HSB, numChars);
  background(numChars/2);
  // Set a hue value for each key
  for(int i = 0; i < numChars; i++) {
    colors[i] = color(i, numChars, numChars);    
  }
}

void draw() {
  if(newletter == true) {
    // Draw the "letter"
    int y_pos;
    if (letterHeight == maxHeight) {
      y_pos = y;
      rect( x, y_pos, letterWidth, letterHeight );
    } else {
      y_pos = y + minHeight;
      rect( x, y_pos, letterWidth, letterHeight );
      fill(numChars/2);
      rect( x, y_pos-minHeight, letterWidth, letterHeight );
    }
    newletter = false;
  }
}

void keyPressed()
{
  // If the key is between 'A'(65) to 'Z' and 'a' to 'z'(122)
  if((key >= 'A' && key <= 'Z') || (key >= 'a' && key <= 'z')) {
    int keyIndex;
    if(key <= 'Z') {
      keyIndex = key-'A';
      letterHeight = maxHeight;
      fill(colors[keyIndex]);
    } else {
      keyIndex = key-'a';
      letterHeight = minHeight;
      fill(colors[keyIndex]);
    }
  } else {
    fill(0);
    letterHeight = 10;
  }

  newletter = true;

  // Update the "letter" position
  x = ( x + letterWidth ); 

  // Wrap horizontally
  if (x > width - letterWidth) {
    x = 0;
    y+= maxHeight;
  }

  // Wrap vertically
  if( y > height - letterHeight) {
    y = 0;      // reset y to 0
  }
}

Functions Used

fill()

Sets the color used to fill shapes

Learn More
size()

Defines the dimension of the display window width and height in units of pixels

Learn More
if

Allows the program to make a decision about which code to execute

Learn More
rect()

Draws a rectangle to the screen

Learn More
setup()

The setup() function is run once, when the program starts

Learn More
color()

Creates colors for storing in variables of the color datatype

Learn More
keyPressed()

The keyPressed() function is called once every time a key is pressed

Learn More
colorMode()

Changes the way Processing interprets color data

Learn More
draw()

Called directly after setup(), the draw() function continuously executes the lines of code contained inside its block until the program is stopped or noLoop() is called

Learn More
for

Controls a sequence of repetitions

Learn More
noStroke()

Disables drawing the stroke (outline)

Learn More
background()

The background() function sets the color used for the background of the Processing window

Learn More