Problem with making a window size scale

Jrodenba

I'm trying to get a program window to scale properly.

I designed the program to fit a screen with a 3:2 aspect ratio, so I set the size to 1020,680 while building it, with the intention of using size(displayWidth, displayHeight) when finished.

Of course, that would simply run the program at a size of 1020,680 with blank spaces beyond that.

So in all of my X-locations I use the simple equation "width/(1020/X)", and in all my Y-locations use "height/(680/Y)"

I've used this method to make program windows scale to different sizes before, but never on a program as complicated as this one, and sure enough it didn't work this time. So I wrote a very simple program to figure out where the issue is and then started adding layers of complexity until eventually got to this point: (Note: it didn't get very complex before I ran into a problem)

void setup(){

size(1020,680);

}

void draw(){

background(0);

noFill();

imageMode(CORNER);

stroke(255);

ellipse( 150,100,50,50);

stroke(0,0,255);

ellipse( width/(1020/150),height/(680/100),50,50);

}

which resulted in this:

width = 1020.... height = 680...

so.... width/(1020/150) = 1020/(1020/150) = 150

and.... height/(680/100) = 680/(680/100) = 100

so why-oh-why are those two circles not in the same location?

PS- sorry the code posted so weird, can seem to figure that out either

benja

That is because of a rounding-error. Your values are treated as integers. Try this and you will see what i mean:

  println(1020/150);
  println((float)1020/150);
  println(1020.0/150);

You can avoid this by casting one of the values to float, or you can use decimals.

Jrodenba

Beautiful! That works perfectly for my little test program, I will try applying it to my larger program and see if it doesn't help Thanks!!!

GoToLoop

https://forum.Processing.org/two/discussion/8045/how-to-format-code-and-text

so.... width/(1020/150) = 1020/(1020/150) = 150

1020/150 = 6 & 1020/6 = 170.

and.... height/(680/100) = 680/(680/100) = 100

680/100 = 6 & 680/6 = 113.

Looking at my answers above you may notice they're apparently wrong! 8-}
The reason why is b/c for languages like Java, C, etc., if both operands from a division operation are of whole type, the answer is also a whole type! @-)

We can workaround that by forcing at least 1 of the operands to be a real/fractional type:
1020/150. = 6.8 & 1020/6.8 = 150.0.

Notice I've added a dot . to the literal 150. So it is now a fractional type operand.
Therefore the division's result is also a fractional type value. *-:)

What is really sad is that the reference for the division operator completely skips such critical information: X( https://Processing.org/reference/divide.html

Jrodenba

@GoToLoop Thanks! I'm still working on getting it integrated into my larger program, but I'll be sure to post an update if i get it working