Help color movement

Ciao a tutti!
Ho bisogno di un suggerimento per il mio lavoro: devo far in modo che le mie linee insieme ai miei rect() si muovano nel seguente modo:

il mio codice è il seguente:

color red = #FF0004;
color yellow = #F2F700;
color blue = #0A30FF;
color black = #000000;
color white = #FFFFFF;

float x = 300;
float y1 = 300;
float y2 = 500;

int w = 600;
int h = 600;

float x_move = 0.0;
float x_moveNext = 0.0;

float baseA = x_move;
float altA = h;
float baseB = w-baseA;
float altB = h;

int min = 0+100;
int max = w-100;
float velocita = 2;

float latoArancio = x;
float latoRosso = y1;
float latoMagenta = y2;
float latoGiallo = h-latoRosso;
float latoAzzurro = h-latoMagenta; 
float latoBlu = w-latoArancio; 

void settings() {
  size(w, h);
}
void setup() {
  background(black);
  frameRate(50);
  x_move = random (min, max);
  x_moveNext = random(min, max);
  surface.setTitle("Mondrian");
}

void draw() {  
  disegna();
}

void disegna() {
  if (x_move < x_moveNext) {
    x_move += velocita;
    if (x_move >= x_moveNext) {
      x_move = x_moveNext;
      x_moveNext = random (min, max);
    }
  }

  if (x_move > x_moveNext) {
    x_move -= velocita;
    if (x_move <= x_moveNext) {
      x_move = x_moveNext;
      x_moveNext = random(min, max);
    }
  }  

  noStroke(); 

  fill(red);
  rect(0, latoBlu, x_move, altA);  

  fill(blue);
  rect(x_move, latoBlu, baseB, altB);

  stroke(white);
  strokeWeight(13);
  line(x_move, 0, x_move, h);
}

Ma sto avendo problemi sia con le linee sia con i rect().
Qualcuno che mi può dare una mano?

Grazie

Hello @marika20,

Please can you outline more specifically the desired effect you want?

In your diagram it looks like you want the left side and right side to move up and down independent of each other?
And you want the entire window to move back and forth?

Please confirm if this is correct OR you want something different…

Also, it appears all of your variables are not being used, and I assume this is intentional?
:nerd_face:

ciao, ti ringrazio per avermi risposto.
Si esatto le due linee in orizzontale che si muovano su e giù in autonomia e quella centrale anche a destra e a sinistra.
Così come ho rappresentato io.

Si le variabili per ora non sono ancora utilizzate, corretto. :slight_smile:

Instead of doing the left - right movement first, can you post code for only the left side of up - down movement?

è il problema…
non capisco come inserire gli altri movimenti purtroppo: ho inserito il movimento destra-sinistra ma mancano i due movimenti su-giù

Yes, I understand the code for the other two up-down movements are missing.
:slight_smile:

BUT I think it will be easier for you if you solve the up-down movement first and then after that the left-right movement.

Once you solve the left side up-down, it will be very easy to apply to the right side up-down with minor adjustment(s).

Then the overall left-right (x variable) movement can be applied.

You will need to make your y variable your primary variable. Currently your x variable is primary.
For example, instead of:

To start, change to:

float y_move = 0.0;
float y_moveNext = 0.0;

and then apply the same thinking you did with your previous code.
And of course, you will need to revise your other variables as needed because your primary reference is now y and not x.

This is just my approach, someone else may have another opinion that is equally valid of course…

:nerd_face:

1 Like

I this solved?

Chrisir

ma nell’esempio che mi hai mandato adesso abbastanza, a me serve che le linee si muovano in corrispondenza dei rect().
Nel tuo esempio ha creato lo stroke() ai rect() ma non le linee :face_with_head_bandage:

1 Like

Yes, each rect() has its line around it with

  strokeWeight(13);
  stroke(white);

but you can draw also lines.

1 Like

si esatto, a me servono le linee che muovono i rect()
Grazie

1 Like