How to formulate a conditional statement to prevent text items from overlapping

raanelom

Hi all! Im working on a project where i am making a random text layout. However, i want the two textblocks to - Never overlap eachother - Never display off screen -The second textblock (X2,Y2) always has to be below the first textblock.

This is the part which deals with this statement, i think im doing something wrong because the items still overlap & display off screen. (Not that much, but i want to be in total control)

float min = 0, max = 500;

 float x1 = random(min, max);
  float y1 = random(min, max);
  float x2 = random(min, max);
  float y2 = random(min, max);
  float xwidth = random(200, 400);
  float yheight = height;
  float xwidth2 = random(200, 400);
  float yheight2 = height;

  void zet()
 {
      if (x2<=width-x1+xwidth) {
      x2 = x1+xwidth+random(200, 400);

      if (x2>width-xwidth) {
        x2 = x2-xwidth-10;
      }
    }

       if (y2<=height-y1+yheight) {
      y2 = y1+yheight+random(200, 400);

      if (y2>height-yheight) {
        y2 = y2-height-10;
      }
    }

     text(totaal1, x1, y1, xwidth, yheight);
    text(totaal2, x2, y2, xwidth2, yheight2);

  }  

Im nearly there but i guess there is a part missing, im really breaking my head on this, does anyone know how i can fix this?

Thanks! Sander

Chrisir

I still don't get it.

you got two rects.

Both have the height of the display (line 8 and 10)

Shall they be next to each other or can also be one over the other?

When they are next to each other:

the first rect is left, the second is right. This you can take as given.

So when you determin the xpos of the left one, determine the width of it as well.

The xpos of the right one is then

x2 = x1 + xwidth + 10; 

The xwidth of the 2nd is

xwidth2 = width - x2 - 10; 

no need to use random here

Chrisir

do you plan to have more than two rects? Because it's in a class. I saw it in your other thread.

Chrisir

that's not perfect....

String totaal1="dlkfklsafjalk laksjf alksj fklasdjlkasdjf alksjewoiruaskf asdlkfj afalkfjda a";
String totaal2="mnvcmbxbvc mcvbnbcx m,vbx,mn ,mm,vn m,vbnvc ,mbnmb,vc ,mbn ,mcm,xcvnm, ,mvncbm,n"+
"lk laksjf alksj fklasdjlkasdjf alksjewoiruaskf asdlkfj afalkfjda a";

size(500, 500);

float min = 6, max = 500;

float x1 = random(min, 200);
float y1 = random(min, 200);

float xwidth = random(50, width-x1-100);
float yheight = height;

// float x2 = random(min, width);
float x2 = x1 + xwidth + 10; 
float y2 = random(min, 200);


float xwidth2 = width - x2 - 10; 
// float xwidth2 = random(200, 400);
float yheight2 = height;

//void zet()
{
  //  if (x2<=width-x1+xwidth) {
  //    x2 = x1+xwidth+random(200, 400);
  //
  //    if (x2>width-xwidth) {
  //      x2 = x2-xwidth-10;
  //    }
  //  }

  //
  //  if (y2<=height-y1+yheight) {
  //    y2 = y1+yheight+random(200, 400);
  //
  //    if (y2>height-yheight) {
  //      y2 = y2-height-10;
  //    }
  //  }

  fill(0);
  rect(x1, y1, xwidth, yheight);
  fill(220);
  text(totaal1+totaal1+totaal1+totaal1, x1, y1, xwidth, yheight);

  fill(255, 0, 0);
  rect(x2, y2, xwidth2, yheight2);
  fill(220);
  text(totaal2+totaal2+totaal2+totaal2+totaal2, x2, y2, xwidth2, yheight2);
}  
//

raanelom

Thanks for your feedback! @Chrisir, yes eventually i will use more rects. Will try it out soon and post the project in the share section!

Chrisir

...because when you have more rects I suggest a class Rect instead of Layout (or additionally).

Because you have two similar rects in one class now. That is not the idea of a class which would be to reduce a object / e.g. rect to its core and have that in the class.

as Philho posted in the other thread, there is a way to check if two rects collide/ overlap.

so you could move the rects until the don't overlap.

;-)