Questions over questions, a newbie asks...

Programming Questions

werbefrau

Questions over questions, a newbie asks...

in Programming Questions • 9 months ago

Hello out there,

I'm a newbie from Germany. The past weeks I've spend a lot of time with working in Processing, but now I don't know how to go on.

My code looks like this:

float x = 800;

float y = 0;

float r = 200;

float speed = 0;

float gravity = 0.1;

void setup() {

size(1600 ,900);

}

void draw() {

background(255);

fill(255,40,26);

noStroke () ;

ellipseMode(CENTER);

ellipse(x,y,r,r);

r++ ;

if (r > 340)

r = 320;

y = y + speed;

speed = speed + gravity;

if (y > height) {

speed = speed * -0.95;

}

Now I would like to add some random circles, which all follow the movement of the big red circle - some stay closer to the circle, others have a bigger distance. How can I do this? Is there an easy solution for a Processing beginner? You would be my hero! :)

Thanks,

Werbefrau

Replies(6)

GoToLoop

Re: Questions over questions, a newbie asks...

9 months ago

Just some preliminary tips:

Inside function setup() , you put some general characteristics for your canvas screen.
The reason for it, is that draw() keeps repeating by default 60 times/second (FPS) the same configuration.
And that's pretty redundant!

Now, to have many copies from the same object you have to use arrays.
And even better, you can make yourself a class to define all aspects and actions an object can do!

Take a look at these 2 articles to learn how to do it:
From_several_variables_to_arrays
From_several_arrays_to_classes

Now a more compact version of your program above:

int x, y;     
float r = 200;
float spd, grav = .1f;  

void setup() {
    size(1000, 800);
    noStroke();
    ellipseMode(CENTER);
    fill(255, 40, 26);

    x = width/2;
}

void draw() {
    background(255);
    ellipse(x, y, r, r);

    if (++r > 340)    r = 320;
    if ( (y += spd += grav) > height )   spd *= -.95f;
}

werbefrau

Re: Questions over questions, a newbie asks...

9 months ago

Thanks for your answer, GoToLoop!

Now I have a lot to read and to try ;) But if it should work, that there would be a class of balls moving around - how can I tell them: Follow the movement of the big ball!? Is that possible?

GoToLoop

Re: Questions over questions, a newbie asks...

9 months ago

The coordinates of the big ball is (x,y).

So, the small balls just need to chase the values stored in x & y!

In a Object Oriented Programming perspective -> x, y, r, spd & grav are fields from class BigBall.

And ellipse(x, y, r, r) would be its method to draw it on the canvas.
And the If blocks, the math and check update method.

All of it would define our BigBall class object.

Just read those 2 articles and you're gonna understand the concept very quickly.

Good studies!

werbefrau

Re: Questions over questions, a newbie asks...

9 months ago

Okay...now I made this:

int anzahl = 200;

float x[] = new float[anzahl];

float y[] = new float[anzahl];

float s[] = new float[anzahl];

float t[] = new float[anzahl];

void setup() {

size(1600, 900);

fill(255);

smooth();

noStroke();

for (int i = 0; i < anzahl; i++) {

s[i] = random(0, 10); //breite

t[i] = random(0, 10); //höhe

}

void draw() {

background(0);

fill(25,50,23);

for (int i = 0; i < anzahl; i++) {

ellipse(x[i], y[i], 20, 20);

x[i] = x[i] + s[i];

if (x[i] > width || x[i] < 0) {

s[i] = - s[i];

}

y[i] = y[i] + t[i];

if (y[i] > height || y[i] < 0) {

t[i] = - t[i];

}

This creates 200 balls, moving around...but now the next problem for me is how to combine this with the code of the big red ball which jumps up and down. I have no idea how to do it, it always says, I was mixing static and active modes or there's a syntax error - can you help me? :)

GoToLoop

Re: Questions over questions, a newbie asks...

9 months ago

Here's the merged codes:

// Big Ball Fields:
float x, y;
float r = 200f, spd;

final static float grav = .1f;
final static color bigCol  = #FF281A;

// Little Balls Fields:
final static byte  ballSz  = 20;
final static byte  ballSpd = 30;

final static color ballCol = #193217;
final static short ballNum = 200;

final static float bx[] = new float[ballNum];
final static float by[] = new float[ballNum];
final static float bs[] = new float[ballNum];
final static float bt[] = new float[ballNum];

void setup() {
  size(1600, 900);
  smooth();
  noStroke();

  x = width>>1;  // <- Big Ball Init

  // Little Balls Init:
  for (int i = 0; i < ballNum; i++) {
    bs[i] = random(ballSpd);
    bt[i] = random(ballSpd);
  }
}

void draw() {
  background(0);

  // Big Ball Section:
  fill(bigCol);
  ellipse(x, y, r, r);

  if (++r > 340)    r = 320;
  if ( (y += spd += grav) > height )   spd *= -.95f;

  // Little Balls Section:
  fill(ballCol);

  for (int i = 0; i < ballNum; i++) {
    ellipse(bx[i], by[i], ballSz, ballSz);

    if ( (bx[i] += bs[i]) > width  || bx[i] < 0 )    bs[i] *= -1;
    if ( (by[i] += bt[i]) > height || by[i] < 0 )    bt[i] *= -1;
  }
}

werbefrau

Re: Questions over questions, a newbie asks...

9 months ago

Thanks a lot, GoToLoop! The last days I've tried to create a heart which is surrounded by some ellipse and triangles. That's the result:

float x = 400;

float y = 0;

float r = 200;

float speed = 0;

float gravity = 0.1;

float b ;

float c;

float d;

float e;

float k = 0;

float angle;

void setup() {

size(800, 950);

smooth();

}

void draw() {

background(0);

k++;

angle += 1.2;

b = x + cos (angle) * random(r, r * 1.5);

c = y + sin (angle) * random(r, r * 1.5);

if (speed < -0.95) {

fill(0, 255, 0); // Große, halbtransparente Kreise // grün

ellipse(b, c, 2, 2);

k = 2;

k = 0;

}

if (speed > - 0.95) {

fill(33, 34, 255); // Große, halbtransparente Kreise

ellipse(b, c, 2, 2);

}

angle += 2.3;

b = x + cos (angle) * -random(r * 2.0);

c = y + sin (angle) * -random(r * 2.0);

if (speed < -0.95) {

fill(0, 255, 0); // Große, halbtransparente Kreise

ellipse(b+100, c+100, 40, 40);

}

if (speed > - 0.95) {

fill(33, 34, 255); // Große, halbtransparente Kreise

ellipse(b, c, 50, 50);

}

angle += 0.8;

b = x + cos (angle) * random(r, r * 2.0); //Entfernung von Kreis

c = y + sin (angle) * random(r, r *2.0);

if (speed < -0.95) {

fill(0, 255, 0); // Große, halbtransparente Kreise

ellipse(b, c, 5, 5);

}

if (speed > - 0.95) {

fill(33, 34, 123); // Große, halbtransparente Kreise

ellipse(b, c, 15, 15);

}

angle += 3.5;

b = x + cos (angle) * -random(r * 2.5);

c = y + sin (angle) * -random(r * 2.5);

if (speed < -0.95) {

fill(0, 255, 0, 123); // Große, halbtransparente Kreise

ellipse(b+20, c+20, 25, 25);

k = 2;

k = 0;

}

if (speed > - 0.95) {

fill(33, 34, 255); // Große, halbtransparente Kreise

ellipse(b+20, c+20, 25, 25);

}

d = x + cos (angle) * random(r, r * 1.5);

e = y + sin (angle) * random(r, r * 1.5);

if (speed < -0.95) {

fill(0, 255, 0); // Große, halbtransparente Kreise

triangle(d+30, e+75, d+58, e+20, d+86, e+75);

}

if (speed > - 0.95) {

fill(33, 34, 255); // Große, halbtransparente Kreise

triangle(d+30, e+75, d+58, e+20, d+86, e+75);

}

smooth();

fill(133, 13, 40);

noStroke () ;

beginShape();

vertex(x+r+50, y+r+15);

bezierVertex(x+r+50, y+r-5, x+r+90, y+r+5, x+r+50, y+r+40);

vertex(x+r+50, y+r+15);

bezierVertex(x+r+50, y+r-5, x+r+10, y+r+5, x+r+50, y+r+40);

endShape();

r++ ;

if (r > 220)

r = 200;

y = y + speed;

speed = speed + gravity;

if (y > height) {

speed = speed * -0.95;

}

Do you see the problem? The heart is far away from being in the middle of all those balls and triangles...how can I change it? I know, there must be something changed in the code of the bezierVertex...but don't know what. It would be great, if you could help me :)

Thanks,

Werbefrau

Top Reply