Lines movement help

Ciao, qualcuno saprebbe dirmi perchè non riesco a fare il movimento nella parte sinistra dello schermo?
Riesco a far muove la parte destra con la linea e il rect(blu) ma la parte di sinistra quella con la linea e il rect(rosso) non riesco…le ho provate tutte.

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;

int min = 0+100;
int max = w-100;

float  x_move = random (min, max);
float  x_moveNext = random(min, max);
//float  y_move = random (min, max);
//float  y_moveNext = random (min, max);

float velocitaX = 1.5;
float velocitaX2 = 1.5;

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);
  surface.setTitle("Mondrian");
  
}

void draw() {
  background(black);
  disegnaX();
  //disegnaX2();
}

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

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

  noStroke(); 

  fill(red);
  rect(0, latoMagenta, x_move, latoMagenta);  
  //rect(0, latoArancio, x_move, h); 
  
  fill(blue);
  rect(x_move, x_move, w, h);

  fill(yellow);
  rect(0, 0, x_move, latoMagenta);  

  stroke(white);
  strokeWeight(13);
  line(x_move, x_move, w, x_move); //blu
  line(0, latoMagenta, x_move, latoMagenta); //giallo rosso
  line(x_move, 0, x_move, h); //mezzeria

  //line(0, latoArancio, x_move, latoBlu);
}



Grazie

It is a minor oversight. :slightly_smiling_face: Please see the comments next to relevant lines below.

1 Like

Hello,

I often use mouseX and mouseY as I am developing code to visualize what code is doing.

Example < Click here to expand
color red     = #FF0004;
color yellow  = #F2F700;
color blue    = #0A30FF;
color black   = #000000;
color white   = #FFFFFF;

float x = 300;
float y = 300;

int w = 600;
int h = 600;

void settings()
  {
  size(w, h);
  }

void setup()
  {
  background(black);
  }

void draw() 
  {
  background(black);
  
  x = mouseX;
  y = mouseY;

  fill(yellow);
  rect(0, 0, x, y);  
  
  fill(red);
  rect(0, y, x, h);

  fill(black);
  rect(x, 0, w, y);   
  
  fill(blue);
  rect(x, y, w, h);
  
  stroke(white);
  strokeWeight(10);
  line(0, y, w, y);
  line(x, 0, x, h);

  noStroke();
  fill(0, 255, 0);
  circle(x, y, 20);  
  }

You can add\subtract an offset to x and y and use mouseX, mouseY to help troubleshoot.

:)

1 Like

si ma se io incremento i valori come mi hai suggerito, la linea del rect(blu) perde il suo flusso.
La linea di sinistra si deve muove come la linea di destra e con loro i rect()

si grazie questo lo so :smiley:

Questo è corretto:

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

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

  noStroke(); 

  fill(red);
  rect(0, x_move+100, x_move, h);  
  //rect(0, latoArancio, x_move, h); 
  
  fill(blue);
  rect(x_move, x_move, w, h);

  fill(yellow);
  rect(0, 0, x_move, x_move+100);  

  stroke(white);
  strokeWeight(13);
  line(x_move, x_move, w, x_move); //blu
  line(0, x_move+100, x_move, x_move+100); //giallo rosso
  line(x_move, 0, x_move, h); //mezzeria

  //line(0, latoArancio, x_move, latoBlu);
}

Ora mi serve sapere come far muovere le linee orizzontali:
Esempio: _ scorre verso il basso e l’altra _ scorre verso l’alto

Perhaps I do not understand the effect you are trying to achieve…
:face_with_raised_eyebrow: :slight_smile:

But if you want the left-side horizontal line to move (up and down) separately from the right-side horizontal line (up and down) then you will need to have 2 variables, one for the right side and one for the left side…

And/or a second conditional statement, one for each side to control the movements separately.

2 Likes

here is my version



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;

int min = 0+100;
int max = w-100;

float  x_move = random (min, max);
float  x_moveNext = random(min, max);
//float  y_move = random (min, max);
//float  y_moveNext = random (min, max);

float velocitaX = 1.5;
float velocitaX2 = 1.5;

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

float latoMagentaAdd=2;

void settings() {
  size(w, h);
}
void setup() {
  background(black);
  frameRate(50);
  surface.setTitle("Mondrian");
}

void draw() {
  background(black);
  disegnaX();
  //disegnaX2();
}

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

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

  noStroke(); 

  fill(red);
  rect(0, x_move, x_move, latoMagenta);  
  //rect(0, latoArancio, x_move, h); 

  fill(blue);
  rect(x_move, x_move, w, h);

  fill(yellow);
  rect(0, 0, x_move, x_move);  

  stroke(white);
  strokeWeight(13);
  line(x_move, x_move, w, x_move); //blu
  line(0, latoMagenta, x_move, latoMagenta); //giallo rosso
  line(x_move, 0, x_move, h); //mezzeria

  latoMagenta+=latoMagentaAdd;   // !!!!!!!!!!!!!!!!!!!!!!!!!!!!

  if (latoMagenta>width)  // !!!!!!!!!!!!!!!!!!!!!!!!!!!!
    latoMagentaAdd=-1; 
  if (latoMagenta<0)
    latoMagentaAdd=1; 

  //line(0, latoArancio, x_move, latoBlu);
}
1 Like