#### Howdy, Stranger!

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

# How do I make these objects loop?

edited May 2015

Hi, I am currently working on a simple sketch of a piano keyboard moving infinitely across the screen. I've plotted the keys, and using xPos I've made them all move across screen together. I've put a line saying that if xPos is less than -70 (off screen) it should then become 1860 (just off screen on the right but ready to move back on screen), but when I do this it moves all of the objects off screen to the right.

I sort of understand what I'm doing wrong, but I don't know how to fix it. What should I do?

Here is my code:

``````int xPos=0;

void setup(){
size(1800, 900);
background(194, 237, 222);
}

void draw(){
background(194, 237, 222);

xPos=xPos-1;

noStroke();
fill(255, 100);

rect (xPos-40, 10, 50, 200);
rect (xPos+20, 10, 50, 200);
rect (xPos+80, 10, 50, 200);
rect (xPos+140, 10, 50, 200);
rect (xPos+200, 10, 50, 200);
rect (xPos+260, 10, 50, 200);
rect (xPos+320, 10, 50, 200);
rect (xPos+380, 10, 50, 200);
rect (xPos+440, 10, 50, 200);
rect (xPos+500, 10, 50, 200);
rect (xPos+560, 10, 50, 200);
rect (xPos+620, 10, 50, 200);
rect (xPos+680, 10, 50, 200);
rect (xPos+740, 10, 50, 200);
rect (xPos+800, 10, 50, 200);
rect (xPos+860, 10, 50, 200);
rect (xPos+920, 10, 50, 200);
rect (xPos+980, 10, 50, 200);
rect (xPos+1040, 10, 50, 200);
rect (xPos+1100, 10, 50, 200);
rect (xPos+1160, 10, 50, 200);
rect (xPos+1220, 10, 50, 200);
rect (xPos+1280, 10, 50, 200);
rect (xPos+1340, 10, 50, 200);
rect (xPos+1400, 10, 50, 200);
rect (xPos+1460, 10, 50, 200);
rect (xPos+1520, 10, 50, 200);
rect (xPos+1580, 10, 50, 200);
rect (xPos+1640, 10, 50, 200);
rect (xPos+1700, 10, 50, 200);
rect (xPos+1760, 10, 50, 200);
rect (xPos+1820, 10, 50, 200);

fill(0);
rect (xPos+64,10,30,120);
rect (xPos+124,10,30,120);
rect (xPos+244,10,30,120);
rect (xPos+304,10,30,120);
rect (xPos+364,10,30,120);
rect (xPos+364,10,30,120);
rect (xPos+484,10,30,120);
rect (xPos+544,10,30,120);
rect (xPos+664,10,30,120);
rect (xPos+724,10,30,120);
rect (xPos+784,10,30,120);
rect (xPos+904,10,30,120);
rect (xPos+964,10,30,120);
rect (xPos+1024,10,30,120);
rect (xPos+1144,10,30,120);
rect (xPos+1204,10,30,120);
rect (xPos+1324,10,30,120);
rect (xPos+1384,10,30,120);
rect (xPos+1444,10,30,120);
rect (xPos+1564,10,30,120);
rect (xPos+1624,10,30,120);

if (xPos < -60) xPos = 1860;

}
``````
Tagged:

• unfortunately this sounds more easy than it is

• edited May 2015

It could be that it would make you happy not to check the left border of the screen against the first but against the last key

make your `if` against the last key of the keyboard

thus it looks more natural and it jumps over only when the entire keyboard has almost dissapeared on the left

maybe that it what you are aiming at

it turned out to be a lot easier than I first thought ;-)

Chrisir ;-)

• I see what you mean, but what I want is for it to be a continual flow of keys. The idea being that as each key leaves screen it loops around, meaning it is essentially an infinite keyboard.

• yes, I afraid you say that.

• I think you need an array of tto store all the positions there.

then you can tell each key separately when to jump from the left to the right side

see reference

• when you use arrays, the simple idea is to use a for-loop over them

you can have one array for the white and one for the black keys

ARGH! CUSS WORDS! I GIVE UP!

``````int startX = 10;

void setup(){
size(1000,300);
noStroke();
}

void draw(){
background(0,120,0);

startX--;
if(startX < -480){
startX+=480;
}
fill(255);
for( int i=startX; i<2*width; i+=60){
rect(i, 10, 50, 200);
}
int j = 0;
fill(0);
for( int i = startX; i<2*width; i+=60){
j++;
j %= 7;
if(j!=2 && j != 5){
rect (i-20,10,30,120);
}
}
}
``````
• Wow! Perfect! I don't suppose you could link me a page or somethine with the basic concepts of what you did just so I could learn? But wow! That's exactly what I was looking for! Thank you!

• NO! It's not perfect! That's not what you want at all! kicks the air Watch it for a while and you'll see why. breaks things The black keys jump! rage quit

• edited May 2015
• make one array with all black keys xpos

• make one array with all white keys xpos

in setup() use a for loop: fill both with data like i*60+4

in draw() use a for loop: display all keys

in draw() use a for loop: move all keys using -1 and check them for being < 0

;-)

• edited May 2015

hopefully this is clear.

i've left the key drawing as is. but it should be a loop. or two.

``````    // scrolling keyboard
// acd 2015

public static final int WIDTH_OF_KEYS = 420;
int xPos=0;

void setup(){
size(1800, 900);
background(194, 237, 222);
noStroke();
}

void draw(){
background(194, 237, 222);

xPos = xPos - 1;

// draw enough sets of keys to fill the screen and a couple more
// as the first and last will be partial
for (int i = 0 ; i < 2 + (width / WIDTH_OF_KEYS) ; i++) {
drawKeys(xPos + (i * WIDTH_OF_KEYS));
}

// if the first set is entirely off the screen
// reset to left edge
if (xPos <= -WIDTH_OF_KEYS) {
xPos = 0;
}
}

// draws one set of keys
void drawKeys(int x) {
// white keys (make this a loop)
fill(255, 100);
rect (x, 10, 50, 200);
rect (x + 60, 10, 50, 200);
rect (x + 120, 10, 50, 200);
rect (x + 180, 10, 50, 200);
rect (x + 240, 10, 50, 200);
rect (x + 300, 10, 50, 200);
rect (x + 360, 10, 50, 200);

// black keys (make this a loop)
fill(0);
rect (x + 44, 10, 30, 120);
rect (x + 104, 10, 30, 120);
rect (x + 224, 10, 30, 120);
rect (x + 284, 10, 30, 120);
rect (x + 344, 10, 30, 120);
}
``````