ok. the basic idea is to have a class represent one rect that listens to keypressed. then have an array to hold all the instances of that class that represents the grid.
Code:
// this is an array of KeyRect, something like a numbered list.
// KeyRect class is defined at the end, maybe jump there first ...
KeyRect[] keyrects;
void setup() {
// that's what you had before
size(375, 375);
background(255);
smooth();
noStroke();
// now fill the array with KeyRects,
// creating a new one for each position and
// passing it the initial set of values it needs to hold
keyrects = new KeyRect[] {
//First Line 6 x 6
new KeyRect(25, 25, 50, 50,'1','!'),
new KeyRect(80, 25, 50, 50,'2','@'),
new KeyRect(135, 25, 50, 50,'3', '£'),
new KeyRect(190, 25, 50, 50,'4', '$'),
new KeyRect(245, 25, 50, 50,'5', '%'),
new KeyRect(300, 25, 50, 50,'6', '^'),
//Second Line
new KeyRect(25, 80, 50, 50,'7', '&'),
new KeyRect(80, 80, 50, 50,'8', '*'),
new KeyRect(135, 80, 50, 50,'9', '('),
new KeyRect(190, 80, 50, 50,'0', ')'),
new KeyRect(245, 80, 50, 50,'q', 'Q'),
new KeyRect(300, 80, 50, 50,'w', 'W'),
//Third Line
new KeyRect(25, 135, 50, 50,'e', 'E'),
new KeyRect(80, 135, 50, 50,'r', 'R'),
new KeyRect(135, 135, 50, 50,'t', 'T'),
new KeyRect(190, 135, 50, 50,'y', 'Y'),
new KeyRect(245, 135, 50, 50,'i', 'I'),
new KeyRect(300, 135, 50, 50,'o', 'O'),
//Fourth Line
new KeyRect(25, 190, 50, 50,'p', 'P'),
new KeyRect(80, 190, 50, 50,'a', 'A'),
new KeyRect(135, 190, 50, 50,'s', 'S'),
new KeyRect(190, 190, 50, 50,'d', 'D'),
new KeyRect(245, 190, 50, 50,'f', 'F'),
new KeyRect(300, 190, 50, 50,'g', 'G'),
//Fifth Line
new KeyRect(25, 245, 50, 50,'h', 'H'),
new KeyRect(80, 245, 50, 50,'j', 'J'),
new KeyRect(135, 245, 50, 50,'k', 'K'),
new KeyRect(190, 245, 50, 50,'l', 'L'),
new KeyRect(245, 245, 50, 50,'z', 'Z'),
new KeyRect(300, 245, 50, 50,'x', 'X'),
//Sixth Line
new KeyRect(25, 300, 50, 50,'c', 'C'),
new KeyRect(80, 300, 50, 50,'v', 'V'),
new KeyRect(135, 300, 50, 50,'b', 'B'),
new KeyRect(190, 300, 50, 50,'n', 'N'),
new KeyRect(245, 300, 50, 50,'m', 'M'),
new KeyRect(300, 300, 50, 50,'.', '>')
};
}
void draw ()
{
// this line is a for-loop. it basically says:
// from 0 ( the lowest index in our array ) to almost
// how big the array is ( keyrects.length ) have
// a variable named "k" hold that value and do ...
for ( int k = 0; k < keyrects.length; k++ ) {
// k is now a number between or equal to 0 and (keyrects.length-1).
// so we can use it as index to the KeyRects stored in our array and
// call their draw method ( which will handle drawing and keyPressed
keyrects[k].draw();
}
}
// classes are like containers that hold different variables and
// functions ... super handy when simplifying things!
// the KeyRect class is there to handle the behavior of one grey rect
// that listens to a pair of keys
class KeyRect
{
// define the internal variables we need
int x,y,w,h;
char k1,k2;
color fillColor;
// this is a contructor, constructors are a way to pass an
// inital set of values to a class upon it's creation
KeyRect ( int _x, int _y, int _w, int _h, char _k1, char _k2 )
{
x = _x; y = _y; w = _w; h = _h; k1 = _k1; k2 = _k2;
fillColor = 235;
}
// KeyRect has it's own draw function,
// pretty much what you had before ..
void draw ()
{
if ( keyPressed & (key == k1 || key == k2) ) fillColor = 0;
else fillColor = 235;
fill(fillColor);
rect(x,y,w,h);
}
}
lemme know if this is clear enough .. or just ask if you have questions.
F
Pages: 1
Keypress thingy... (Read 2220 times)