PROCESSING
LESSON 05 – THE KEYBOARD

LESSON NOTE/GUIDE

Note 1: For your keypresses to work, your program needs to have a draw method in it (even if it is empty). Otherwise, since there is no looping, the program stops after executing once.

Note 2: Another reason your keypresses might not work is if the window is not in focus. On some computers, it is important to click on the window to give it focus (even right after starting the program).

PROGRAM 1 – MOUSE CLICK

· This program displays a message in the console when the mouse is clicked inside the window.

THE CODE

public void setup()

{

size(400, 300);

surface.setTitle("Press A");

}

public void draw()

{}

public void keyPressed()

{

if ((key == 'a') || (key == 'A'))

{

System.out.println("The letter A was pressed.");

}

}

RESULT

A window appears. As long as the focus is on the window, when you press the A key, the message appears in the console.

EXPLANATION

The method keyPressed() is automatically executed on frames when a key has been pressed. This is very easy to do!

PROGRAM 2 – ARROW KEYS

· This program displays a message in the console when any of the arrow keys are pressed. Note that the arrow keys are not part of the standard ascii table and are therefore called coded keys. This leads to a slightly different condition for them. See below.

THE CODE

public void setup()

{

size(600, 500);

surface.setTitle("Use Arrow Keys (when mouse is over window)");

}

public void draw()

{}

public void keyPressed()

{

if ((key == CODED) && (keyCode == UP))

{

System.out.println("UP key pressed");

}

if ((key == CODED) && (keyCode == DOWN))

{

System.out.println("DOWN key pressed");

}

if ((key == CODED) && (keyCode == LEFT))

{

System.out.println("LEFT key pressed");

}

if ((key == CODED) && (keyCode == RIGHT))

{

System.out.println("RIGHT key pressed");

}

}

RESULT

A window appears. As long is the mouse is over the window (giving it focus), whenver you hit an arrow key, a corresponding message appears in the console.

EXPLANATION

This code is pretty straight forward. Ask your teacher if you need help.

PROGRAM 3 – MOVING OBJECT WITH ARROW KEYS

· This program displays a message in the console when any of the arrow keys are pressed. Note that the arrow keys are not part of the standard ascii table and are therefore called coded keys. This leads to a slightly different condition for them. See below.

THE CODE

public int x;

public int y;

public void setup()

{

size(400, 300);

surface.setTitle("Use LEFT and RIGHT arrow");

x = width/2;

y = height - 10;

}

public void draw()

{

background(186);

line(x,y,x,y-10);

line(x-5,y,x+5,y);

}

public void keyPressed()

{

if (key == CODED && keyCode == LEFT)

{

x = x - 2;

}

else if (key == CODED && keyCode == RIGHT)

{

x = x + 2;

}

}

RESULT

The upside down T moves left and right with the arrow keys.

EXPLANATION

At the top, the x and y variables represent the location of the upside down T. They are data fields so the values are stored from frame to frame.

Inside the setup method, we create the window. Then, in the last two lines, we set the upside down T’s x and y initial values. These are conveniently based on the width and height of the entire window.

Inside the draw method, we draw the background (to erase previous frames) and then we draw the upside down T again. If it moved, it gets drawn at a different location, otherwise, it gets drawn at the same location.

Inside the keyPressed method, we move the location of the upside down T whenever the LEFT or RIGHT arrows are hit.

Note: Instead of using keyPressed(), you can also use keyReleased() that automatically gets executed whenever a keyboard key is released.