#### Howdy, Stranger!

We are about to switch to a new forum software. Until then we have removed the registration on this forum.

# How make key combos?

edited December 2015

So I am working on a simple UI and What the hope is that when I press UP a small ellipse goes up, when I press LEFT it goes left. However when I press UP && LEFT it goes to the upper left hand corner.So far I have tried to get this with this code

``````void trackerKeys(){
if(keyPressed== true){
switch(keyCode){
case LEFT:
ellipse(50,125, 25, 25);
break;
case RIGHT:
ellipse(200,125, 25, 25);
break;
case UP:
ellipse(125,50, 25, 25);
break;
case DOWN:
ellipse(125,200, 25, 25);
break;
default:
ellipse(125,125, 25, 25);
break;
}
}
else{
ellipse(125,125, 25, 25);
}
}
``````

But all that gets me is one plane of movement. Then there was this code

``````void trackerKeys(){
switch(keyCode){
case LEFT:
g= 50;
break;
case RIGHT:
g= 200;
break;
case UP:
f= 50;
break;
case DOWN:
f= 200;
break;
default:
f=125;
g=125;
break;
}
ellipse(g,f,25,25);
}
``````

And all that gets me is the ellipse is stuck in the corners, so close.... I played with some if/else stuff but that wasn't to good at all. Any ideas?

Tagged:

• edited December 2015

``````/**
* JoyStick Circle (v1.0)
* GoToLoop (2015/Dec/05)
*
* forum.Processing.org/two/discussion/13786/how-make-key-combos
*/

static final int CIRCLE_SIZE = 25;

static final PVector UP_POS     = new PVector(125, 50);
static final PVector DOWN_POS   = new PVector(125, 200);
static final PVector LEFT_POS   = new PVector(50, 125);
static final PVector RIGHT_POS  = new PVector(200, 125);
static final PVector CENTER_POS = new PVector(125, 125);

PVector circlePos = CENTER_POS;

void keyPressed() {
switch (keyCode) {
case UP:
circlePos = UP_POS;
break;
case DOWN:
circlePos = DOWN_POS;
break;
case LEFT:
circlePos = LEFT_POS;
break;
case RIGHT:
circlePos = RIGHT_POS;
break;
default:
circlePos = CENTER_POS;
}

redraw();
}

void keyReleased() {
circlePos = CENTER_POS;
redraw();
}

void setup() {
size(250, 250);
smooth(4);
noLoop();

ellipseMode(CENTER);
strokeWeight(2.5);
stroke(0);
fill(#FFFF00);
}

void draw() {
background(0350);
ellipse(circlePos.x, circlePos.y, CIRCLE_SIZE, CIRCLE_SIZE);
}
``````
• Thanks for the help, but I already have a code able to achieve the same result. What I am looking for will have the ellipse move to say (50,50) when UP AND LEFT are pressed. Right now with your code and the one I created it is either (0,50) or (50,0) not (50,50). I hope this helps elaborate what I am trying to do.

``````boolean[] keys = {
false, false, false, false
};

void setup() {
size(200, 200);
}

void draw() {
background(255);
translate(100, 100);
fill(255, 0, 0);
stroke(0);
ellipse(
(keys[2]?-50:0) + (keys[3]?50:0),
(keys[0]?-50:0) + (keys[1]?50:0),
50,
50
);
}

void keyPressed() {
k(keyCode, true);
}

void keyReleased() {
k(keyCode, false);
}
void k(int c, boolean b) {
if (c == UP) keys[0] = b;
if (c == DOWN) keys[1] = b;
if (c == LEFT) keys[2] = b;
if (c == RIGHT) keys[3] = b;
}
``````
• This is what I was looking for, if you get a chance could you briefly explain how it works? Thank you very much.

No. By forcing you to examine it, you will earn more than if I just explained it.

Here are some questions you can answer to better understand it. 1) What is the array called keys used for? 2) How do the values in the keys array change? 3) Where is the ellipse being drawn? 4) What's the deal with the question marks and colons?

• edited December 2015

Fair enough, what I little I know is by reading others codes and crossing it with the reference page.

So what I have read into it so far is that X-axis is equal to the values of LEFT + Right and the same for the Y-axis. Now the way you got the values is by assigning the keys a boolean value of false. From there you had altered the keyPressed functions to alter the state of the relay between true and false.

Now onto the ellipse itself. As said above the X and Y values are made by adding their respective keys, but your array only changes between true and false. That is where the question mark and colons come in. Those two when combined are like short hand for the IF and ELSE functions. So in (keys[2]?-50:0) the key[2] is what we are checking for and IF it is true return "-50" otherwise return "0".

Finally this make the ellipse move around upper left hand corner with eight different positions. As a bit of preference you used the TRANSLATION function to move the ellipse to the center but you could have also done (keys[2]?-50:100.

So that is what I have come up with reading and crossing what you shown me. Is there anything I should look into farther or I did cover everything?

• edited December 2015

Once again thanks for the help.

• I've got the following online example which we can move a circle in all 8 directions: