# Size() Bug in Processing 3.5.4

**URL:** <https://discourse.processing.org/t/size-bug-in-processing-3-5-4/21431>\
**Category:** Coding Questions\
**Created:** [May 30, 2020, 5:48pm UTC](https://discourse.processing.org/t/size-bug-in-processing-3-5-4/21431 "2020-05-30T17:48:18Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![brent](https://avatars.discourse-cdn.com/v4/letter/b/ec9cab/32.png) [@brent](https://discourse.processing.org/u/brent)\
**Post date:** [May 30, 2020, 5:48pm UTC](https://discourse.processing.org/t/size-bug-in-processing-3-5-4/21431/1 "2020-05-30T17:48:18Z")

</div>

I’m trying to position rectangles for the UI of a basic painting program in relation to the Width and Height of the window. I’ve looked elsewhere and found I should introduce ‘size()’ in ‘settings()’ as opposed to ‘setup()’. The window size appears appropriately, though later in the code Processing thinks that the size is the default (100, 100). Introducing in ‘setup()’ does the same as in ‘settings()’.

I put in some ‘println’ functions at the top of draw which are giving me contradictory information. For example I made a ‘testHeight’ variable which equals ‘height’. I printed the value of ‘height’ and it gives me 800, I printed the value of ‘testHeight’ and it gives me 50. Is there something I’m missing?  
(I know my code is a mess, I’m new to this.)

```auto
void settings() {
  size(1000, 800);
}

void setup() {
  background(255);
}

int x = 320;
int y = 180;

// Brush object
void Brush() {
  this.x = mouseX;
  this.y = mouseY;
  this.brushSize = brushSize;
  this.brushColor = brushColor;
  this.brushStatus = brushStatus;
}

int sliderX = 10;

int brushSize;
color brushColor = color(0);
String[] brushStatus = {"Draw", "Erase"};

void mouseDragged() { // Adjusts size of brush by moving slider along X axis with mouse.
  if (mousePressed == true && mouseX > 35 && mouseX < 274 && mouseX >= (sliderX - 4) 
    && mouseX <= (sliderX + 4) && sliderX >= 32 && sliderX <= 278 && mouseY >= 342 && mouseY <= 353) {
    sliderX = mouseX;
    brushSize = floor((sliderX - 35) / 2.5);
  }
}

int testHeight = height;

// Slider box Dimension
int sliderBoxX = width*1/20; 
int sliderBoxY = height/2; // boxY Position = windowHeight/2

void draw() {
  // The values given by println seems contradictory.
  println("height/2 = ", height/2); // returns value of 400
  println("sliderBoxY = ", sliderBoxY); // returns value of 50
  println("testHeight = ", testHeight);
  println("height = ", height);
  println("width*1/20 = ", width*1/20);
  println("sliderBoxX = ", sliderBoxX);
  
  
  // Drawing Area Centre
  noFill();
  stroke(0);
  strokeWeight(1);
  rectMode(CENTER);
  rect(width/2, height/2, width*4/5, height);

  // Brush Size Slider
  fill(255);
  stroke(0);
  strokeWeight(1);
  rectMode(CENTER);
  rect(sliderBoxX, sliderBoxY, width*9/100, 15); // outer box
  fill(200);
  rectMode(CENTER);
  rect(sliderX, 348, 8, 11); // draggable slider

  /*
  println("mouseX= ", mouseX);
   println("sliderX= ", sliderX);
   println("brushSize= ", brushSize);
   */

  // Increase / Decrease brush size
  fill(255);
  stroke(0);
  strokeWeight(1);
  rectMode(CORNER);
  rect(15, 10, 50, 15);
  fill(0);
  text(brushSize, 20, 22);
  /*
  if (brushSize > 0 && brushSize < 250) {
   if (keyPressed == true && keyCode == UP) {
   brushSize++;
   } else if (keyPressed == true && keyCode == DOWN) {
   brushSize--;
   }
   } else if (brushSize == 0) {
   if (keyPressed == true && keyCode == UP) {
   brushSize++;
   }
   } else if (brushSize == 250) {
   if (keyPressed == true && keyCode == DOWN) {
   brushSize--;
   }
   }
   */
  // erase tool
  int brushSelection = 0;
  if (keyPressed == true && (key == 'E' || key == 'e')) {
    brushColor = color(255);
    brushSelection = 1;
  } else if (keyPressed == true && (key == 'B' || key == 'b')) {
    brushColor = color(0);
    brushSelection = 0;
  }
  fill(255);
  rect(15, 35, 50, 15);
  fill(0);
  text(brushStatus[brushSelection], 20, 47);

  // Brush
  stroke(brushColor);
  strokeWeight(this.brushSize);
  if (mousePressed == true && mouseX > width*1/10 && mouseX < width*9/10) {
    line(pmouseX, pmouseY, mouseX, mouseY);
  }

  // Clear All Button
  fill(255);
  stroke(0);
  strokeWeight(1);
  rect(15, 60, 60, 15);
  fill(0);
  text("Clear All", 20, 72);
  if (mousePressed == true && mouseX >= 15 && mouseX <= 75 && mouseY >= 55 && mouseY <= 70) {
    background(255);
  }

  // Color Buttons
  fill(255);
  rect(567, 10, 70, 15);
  fill(0);
  text("Pick Colour", 570, 22);
  // Red Button
  stroke(0);
  strokeWeight(1);
  fill(255, 0, 0);
  rect(570, 30, 50, 15);
  // Green Button
  fill(0, 255, 0);
  rect(570, 50, 50, 15);
  // Blue Button
  fill(0, 0, 255);
  rect(570, 70, 50, 15);
  if (mousePressed == true && mouseX >= 575 && mouseX <= 625 && mouseY >= 30 && mouseY <= 45) {
    brushColor = color(255, 0, 0);
  } else if (mousePressed == true && mouseX >= 575 && mouseX <= 625 && mouseY >= 50 && mouseY <= 65) {
    brushColor = color(0, 255, 0);
  } else if (mousePressed == true && mouseX >= 575 && mouseX <= 625 && mouseY >= 70 && mouseY <= 85) {
    brushColor = color(0, 0, 255);
  }
}

```

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [May 30, 2020, 6:20pm UTC](https://discourse.processing.org/t/size-bug-in-processing-3-5-4/21431/2 "2020-05-30T18:20:43Z")

</div>

Hello,

Hope this helps:

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/b/bf490649d2a6f11d5539704b4cec89888f326813.png)

Global variables outside of setup(), settings(), draw() are all declared first regardless of where they are placed in your code between those methods.

Read this to understand size():  
[https://processing.org/reference/size\_.html](https://processing.org/reference/size_.html)

`:)`

---

<div class="post-metadata">

**Author:** ![brent](https://avatars.discourse-cdn.com/v4/letter/b/ec9cab/32.png) [@brent](https://discourse.processing.org/u/brent)\
**Post date:** [May 30, 2020, 6:59pm UTC](https://discourse.processing.org/t/size-bug-in-processing-3-5-4/21431/3 "2020-05-30T18:59:35Z")

</div>

Thank you for the quick response! I think this helps, I just have one question. Should I declare all global variables before setup()/settings(), then assign their values within setup()/settings()? Or at least any variables that use width/height?

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [May 30, 2020, 7:43pm UTC](https://discourse.processing.org/t/size-bug-in-processing-3-5-4/21431/4 "2020-05-30T19:43:09Z")

</div>

You can declare and initialize global variables anywhere outside of setup(), settings() and draw() and then you can change them later in code with some constraints (see references to understand order of execution).

Go to the [Processing](https://processing.org/) page and do some research. `:)`

To get you started:

> **[setup() / Reference](https://processing.org/reference/setup_.html)**
>
> The setup() function is run once, when the program starts. It's used to define initial environment properties such as screen size and to load media such as images and fonts as the program start…

> **[settings() / Reference](https://processing.org/reference/settings_.html)**
>
> The settings() function is new with Processing 3.0. It's not needed in most sketches. It's only useful when it's absolutely necessary to define the parameters to size() with a variable. …

> **[draw() / Reference](https://processing.org/reference/draw_.html)**
>
> Called directly after setup(), the draw() function continuously executes the lines of code contained inside its block until the program is stopped or noLoop() is called. draw()…

One of the best tools in a programmers tool chest is knowing the resources available to you and learning to navigate them.

This is a very short list:

> **Resources \< Click here to expand !**
>
> I encourage you to review the resources available here:
> 
> - The Processing _website_ has references, examples, tutorials, etc.  
> [https://processing.org/](https://processing.org/)
> - The Processing PDE (IDE) has lots to offer!  
> An exploration of the tabs will reveal what is available; libraries, tools and local examples there.
> - The Coding Train  
> [https://www.youtube.com/channel/UCvjgXvBlbQiydffZU7m1\_aw](https://www.youtube.com/channel/UCvjgXvBlbQiydffZU7m1_aw)  
> [https://thecodingtrain.com/](https://thecodingtrain.com/)
> - Happy Coding  
> [Processing Tutorials - Happy Coding](https://happycoding.io/tutorials/processing/)
> - The source code can give insight if you are adventurous:  
> [GitHub - processing/processing: Source code for the Processing Core and Development Environment (PDE)](https://github.com/processing/processing)  
> Many of the Processing functions are here:  
> [processing/core/src/processing/core/PApplet.java at master · processing/processing · GitHub](https://github.com/processing/processing/blob/master/core/src/processing/core/PApplet.java)
> - The Processing Foundation  
> [https://processingfoundation.org/](https://processingfoundation.org/)  
> Check out the tabs.  
> In the education tab, there is a reference to the Coding Train.
> - And the Internet. `:)`

`:)`

---

<div class="post-metadata">

**Author:** ![brent](https://avatars.discourse-cdn.com/v4/letter/b/ec9cab/32.png) [@brent](https://discourse.processing.org/u/brent)\
**Post date:** [May 31, 2020, 5:24pm UTC](https://discourse.processing.org/t/size-bug-in-processing-3-5-4/21431/5 "2020-05-31T17:24:22Z")

</div>

Thanks for your help! It’s working now.

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [June 2, 2020, 3:13pm UTC](https://discourse.processing.org/t/size-bug-in-processing-3-5-4/21431/6 "2020-06-02T15:13:38Z")

</div>

> [@brent](#):
>
> Should I declare all global variables before setup()/settings()

> [@glv](#):
>
> You can declare and initialize global variables anywhere outside

One further point. You **can** put global declarations anywhere, in any order, and they will always be evaluated before settings, setup, draw. Important to know.

However, by convention, global declarations **should** be placed at the top, after any import statements and before settings/setup. This helps make code easy to read. If you flip through the reference, tutorials, and examples, you will notice that they always do this without exception–it is a good habit to learn.