Problem with bouncing numbers

Hi need help with this. I have 6 png and all of them load to program and they count from 0 to 5. What to do after that count down from 5 to 0, i mean 0,1,2,3,4,5,4,3,2,1,0

PImage[] zdjecia=new PImage[6];
int i=0;

void setup()
{
  size(200, 200);
  frameRate(2);

  zdjecia[0]=loadImage("zdjecie0.jpeg");
  zdjecia[1]=loadImage("zdjecie1.jpeg");
  zdjecia[2]=loadImage("zdjecie2.jpeg");
  zdjecia[3]=loadImage("zdjecie3.jpeg");
  zdjecia[4]=loadImage("zdjecie4.jpeg");
  zdjecia[5]=loadImage("zdjecie5.jpeg");
}

void draw()
{
  image(zdjecia[i], 0, 0, 200, 200);
  if (i<=5) i++;
}
1 Like

You need to know to what direction numbers are changing to. You could use

boolean up = true;

and add ‘if(up) {i++;}’

when i is five you would set up = false; in else part of if(up) you decrease i instead of increasing it.

2 Likes

Have you tried using subset() to eliminate second use of 5, and then reverse() in the array functions?

Another approach: a bouncing number is also called a triangle wave.

Start with a sawtooth wave:

int counter = 0;
max = 6;

counter++;
sawtooth = counter%(max+1);

0 1 2 3 4 5 6 0 1 2 3 4 5 6 0 1 2 3 4 5 6

Now double the ramp length, then fold each in half to make down ramps.

triwave = abs((counter%(max*2))-max);

0 1 2 3 4 5 6 5 4 3 2 1 0 1 2 3 4 5 6 5 4 3 2 1

For any counter x, this gives you the position on a triangle wave.

p5.js demo of concept

1 Like

Hi!
This is a solution :wink:

The code:

// Animation example by: Luis lopez martinez. 27/05/2020.
// luislopezmartinez1979@gmail.com
// UTILS_gameLibZero is a litle part of game engine called "gameLibZero" for processing.
// Enjoy it!

int st = 0;        // main state machine..
PImage[] img;      // images for game..

int[] seq_00 = {0,0,0,0,1,1,1,1,2,2,2,2,3,3,3,3,4,4,4,4,5,5,5,5};    // animation sequence..
int[] seq_01 = {5,5,5,5,4,4,4,4,3,3,3,3,2,2,2,2,1,1,1,1,0,0,0,0};    // animation sequence..
int anima = 0;                                                       // animation iterator..
//------------------------------------------------------------------------------------
void setup(){
    size(640, 360);
    img = loadImages("images");
}
//------------------------------------------------------------------------------------
void draw(){
    background(0);
    switch(st){
        case 0:
            if(key(_LEFT)){
                anima = (anima+1)%seq_00.length;
                screenDrawGraphic(img[seq_00[anima]], 320, 180, 0, 100, 100, 255);
            }
            if(key(_RIGHT)){
                anima = (anima+1)%seq_01.length;
                screenDrawGraphic(img[seq_01[anima]], 320, 180, 0, 100, 100, 255);
            }
            
            if(!key(_LEFT) && !key(_RIGHT)){
                screenDrawGraphic(img[0], 320, 180, 0, 100, 100, 255);
            }
            break;
        case 10:
            
            break;
    }
}
//------------------------------------------------------------------------------------

This code includes a litle collection of minimal function set to draw graphics easy on screen and check multi key system :wink:
Enjoy it man!