# Paint application

**URL:** <https://discourse.processing.org/t/paint-application/16356>\
**Category:** Coding Questions\
**Created:** [December 13, 2019, 12:29am UTC](https://discourse.processing.org/t/paint-application/16356 "2019-12-13T00:29:18Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![Swagific](https://avatars.discourse-cdn.com/v4/letter/s/2bfe46/32.png) [@Swagific](https://discourse.processing.org/u/Swagific)\
**Post date:** [December 13, 2019, 12:29am UTC](https://discourse.processing.org/t/paint-application/16356/1 "2019-12-13T00:29:18Z")

</div>

Im trying to make a paint application. when i click on the shape icons the shape of the brush dosent change. when i click on the save icons they dont work either. im not sure what im missing in my code to get them to work.

```auto
boolean glide;
int white;
int red;
int green;
int blue;
int yellow;
int purple;
int brown;
int grey;
int black;
int current;
PImage img;
PImage img1;
PImage png;
void setup()
{ 
  background(255);
  size(1500,700);
  white=color(255);
  red=color(255,0,0);
  green=color(0,255,0);
  blue=color(0,0,255);
  yellow=color(255,255,0);
  purple=color(255,0,255);
  brown=color(139,42,42);
  grey=color(139,139,139);
  black=color(0);
  current=color(255);
  glide=true;
  img = loadImage("eraser.png");
  img1 = loadImage("jpg.JPG");
  png = loadImage("png.JPG");
}

void draw()
{
  stroke(10);
  smooth();
  
  rectMode(CORNER);
  fill(109);
rect(0,0,500,700);
strokeWeight(5);
fill(255);
rect(50,50,100,50);
line(60,60,140, 90);
fill(255);
rect(200,50,100,50);
rect(210,60,80,30 );
fill(255);
rect(350,50,100,50);
ellipse(400,75,50,30 );

fill(255);
rect(50,150,100,50);
image(img,60,160,80,30);
fill(255);
rect(200,150,100,50);
image(img1,200,150,100,50);
fill(255);
rect(350,150,100,50);
image(png,350,150,100,50);

fill(white);
rect(50,250,100,50);
fill(red);
rect(200,250,100,50);
fill(green);
rect(350,250,100,50);

fill(blue);
rect(50,350,100,50);
fill(yellow);
rect(200,350,100,50);
fill(purple);
rect(350,350,100,50);

fill(brown);
rect(50,450,100,50);
fill(grey);
rect(200,450,100,50);
fill(black);
rect(350,450,100,50);

if (mousePressed)
{
  noStroke();
 fill(current);
if (glide)
{if((mouseX>50)&&(mouseY>50) && (mouseX<150)&&(mouseY<100))
  { glide=true;
line(mouseX-15,mouseY-15,mouseX,mouseY);}

 else if((mouseX>200)&&(mouseY>50) && (mouseX<300)&&(mouseY<100))
  { glide=true;
  rect(mouseX-25,mouseY-25,50,50);
}

 else if((mouseX>350)&&(mouseY>50) && (mouseX<450)&&(mouseY<100))
  { glide=true;
  ellipse(mouseX,mouseY,50,50);
}
  
else if(mousePressed==true&&(mouseX>200)&&(mouseY>150) && (mouseX<300)&&(mouseY<200))
  { glide=true;
saveFrame("save-###.jpg");}

 else if(mousePressed==true&&(mouseX>350)&&(mouseY>150) && (mouseX<450)&&(mouseY<200))
  { glide=true;
saveFrame("save-###.png");}
}
}
}

void mousePressed()
{
  
  

  
  
  
  if((mouseX>50)&&(mouseY>150) && (mouseX<150)&&(mouseY<200))
  { glide=true;
current=color(white);
rect(mouseX-50,mouseY-50,50,50);}
  
 if((mouseX>50)&&(mouseY>250) && (mouseX<150)&&(mouseY<300))
  { glide=true;
current=color(white);}

  if((mouseX>200)&&(mouseY>250) && (mouseX<300)&&(mouseY<300))
  { glide=true;
current=color(red);}

if((mouseX>350)&&(mouseY>250) && (mouseX<450)&&(mouseY<300))
  { glide=true;
current=color(green);}

if((mouseX>50)&&(mouseY>350) && (mouseX<150)&&(mouseY<400))
  { glide=true;
current=color(blue);}

  if((mouseX>200)&&(mouseY>350) && (mouseX<300)&&(mouseY<400))
  { glide=true;
current=color(yellow);}

if((mouseX>350)&&(mouseY>350) && (mouseX<450)&&(mouseY<400))
  { glide=true;
current=color(purple);}

if((mouseX>50)&&(mouseY>450) && (mouseX<150)&&(mouseY<500))
  { glide=true;
current=color(brown);}

  if((mouseX>200)&&(mouseY>450) && (mouseX<300)&&(mouseY<500))
  { glide=true;
current=color(grey);}

if((mouseX>350)&&(mouseY>450) && (mouseX<450)&&(mouseY<500))
  { glide=true;
current=color(black);}

  
}

```

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [December 13, 2019, 1:00am UTC](https://discourse.processing.org/t/paint-application/16356/2 "2019-12-13T01:00:51Z")

</div>

please format your code posting by pasting it into the

```auto
</> code button

```

of the editor header menu ( context name: Preformatted text )  
it looks like  
```  
type or paste code here  
```

also can use the ``` manually above and below your code.

thank you.

* * *

thanks for the project description and the code,  
but please tell us also about the problem you have?

---

<div class="post-metadata">

**Author:** ![Swagific](https://avatars.discourse-cdn.com/v4/letter/s/2bfe46/32.png) [@Swagific](https://discourse.processing.org/u/Swagific)\
**Post date:** [December 13, 2019, 1:13am UTC](https://discourse.processing.org/t/paint-application/16356/3 "2019-12-13T01:13:25Z")

</div>

I cant get my shape and save buttons to work in my program.

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [December 13, 2019, 2:21am UTC](https://discourse.processing.org/t/paint-application/16356/4 "2019-12-13T02:21:51Z")

</div>

To start with, you must define your colors as color not as int.

---

<div class="post-metadata">

**Author:** ![Swagific](https://avatars.discourse-cdn.com/v4/letter/s/2bfe46/32.png) [@Swagific](https://discourse.processing.org/u/Swagific)\
**Post date:** [December 13, 2019, 2:24am UTC](https://discourse.processing.org/t/paint-application/16356/5 "2019-12-13T02:24:50Z")

</div>

my colors are working its just the shape and save buttons

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [December 13, 2019, 2:34am UTC](https://discourse.processing.org/t/paint-application/16356/6 "2019-12-13T02:34:59Z")

</div>

Interesting, normally you just use integers with grey colors. But it really doesn’t give an error.

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [December 13, 2019, 3:13am UTC](https://discourse.processing.org/t/paint-application/16356/7 "2019-12-13T03:13:42Z")

</div>

I can’t test it. saveFrame() does not work on android(only have this). I have to find a workaround for this.

---

<div class="post-metadata">

**Author:** ![Lexyth](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/lexyth/32/7403_2.png) [@Lexyth](https://discourse.processing.org/u/Lexyth)\
**Post date:** [December 13, 2019, 3:17am UTC](https://discourse.processing.org/t/paint-application/16356/8 "2019-12-13T03:17:05Z")

</div>

color is in it‘s essence just an int. RGB is from -16milion to -1 while RGBA (with alpha) goes from -2B to 2B. See [here](https://discourse.processing.org/t/println-color-gives-strange-color-number/15654) for further information.

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [December 13, 2019, 3:18am UTC](https://discourse.processing.org/t/paint-application/16356/9 "2019-12-13T03:18:29Z")

</div>

Hehe, here is where?

---

<div class="post-metadata">

**Author:** ![Lexyth](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/lexyth/32/7403_2.png) [@Lexyth](https://discourse.processing.org/u/Lexyth)\
**Post date:** [December 13, 2019, 3:23am UTC](https://discourse.processing.org/t/paint-application/16356/10 "2019-12-13T03:23:07Z")

</div>

Sorry, took a while to find that 😅

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [December 13, 2019, 3:47am UTC](https://discourse.processing.org/t/paint-application/16356/11 "2019-12-13T03:47:38Z")

</div>

Then why the need of data type color, if you can use integer? .Can you give me an example when datatype “color” is strictly necessary.

---

<div class="post-metadata">

**Author:** ![Lexyth](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/lexyth/32/7403_2.png) [@Lexyth](https://discourse.processing.org/u/Lexyth)\
**Post date:** [December 13, 2019, 5:48am UTC](https://discourse.processing.org/t/paint-application/16356/12 "2019-12-13T05:48:35Z")

</div>

No datatype except the primitives (and not even all of them) are strictly necessary, but it‘s veeery convinient. For example, it‘s way easier to write String a = “Hello”; than to use char[] or byte[].

The Same goes for color. It‘s just an int, but it makes it a lot easier to work with if we call it color, simple to show what it represents.

There are also some other reasons, like that it‘s easier to understand for beginners, but in short, they aren‘t necessary, but they are useful (like everything other than direct programming in binary…).

[Here](https://www.processing.org/reference/color_datatype.html)‘s also some more Info about the color datatype.

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [December 13, 2019, 11:08am UTC](https://discourse.processing.org/t/paint-application/16356/13 "2019-12-13T11:08:02Z")

</div>

Still do not see char String and byte as interchangeable, otherwise you wouldn’t need convertion functions. I have to think about this.  
In the mean time I have a workaround for saveFrame()  
I have to use a boolean in draw() because noLoop() also doesn’t work in android.  
Below the code for the modified saveFrame function (example code in the doc’s).

```auto
import android.os.Environment;

int x = 0; 
boolean no_loop = true;
String my_folder = "my_frames"; // Must be an existing folder one level above absolute path
String data_folder_path = new String(Environment.getExternalStorageDirectory().getAbsolutePath()+"/"+my_folder+"/");
PImage pi;

void setup() {
  size(100, 100);
}

void draw() { 
  if (no_loop) {
    background(204); 
    if (x < 100) { 
      line(x, 0, x, 100); 
      x = x + 1;
    } else { 
      no_loop = false;
    } // Saves each frame as line-000001.png, line-000002.png, etc. 
    saveFrame("line-"); // numbers(hashtags) will be included in saveFrame()
  }
}

void saveFrame(String s) {
  int maxHashes=6; 
  int myInt = x; 
  String fs = String.format("%1$" + maxHashes + "s", myInt).replace(' ', '0');
  pi = get(0, 0, width, height);
  pi.save(data_folder_path+s+fs+".png");
}  

```

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [December 13, 2019, 1:15pm UTC](https://discourse.processing.org/t/paint-application/16356/14 "2019-12-13T13:15:05Z")

</div>

Maybe you can explain what you want to do, because you are only drawing in the “icon” boxes.

---

<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:** [December 16, 2019, 8:37pm UTC](https://discourse.processing.org/t/paint-application/16356/15 "2019-12-16T20:37:07Z")

</div>

> [@noel](#):
>
> Then why the need of data type color, if you can use integer? .Can you give me an example when datatype “color” is strictly necessary.

Although listed under primitives in the reference, the keyword `color` is “syntactic sugar”, not a real datatype separate from `int`. [color / Reference / Processing.org](https://processing.org/reference/color_datatype.html) In fact, `color` is a keyword that is synonymous with `int`, and when Processing is transpiled into Java the word is replaced with `int`. It was added to the language to help learners, but it isn’t an object or a discrete primitive. So:

- Any place you write `color` you can write `int` instead.
- However, the method `color()` does something very different from `int()`!

By contrast, p5.js has a very different implementation of Color –

> **[reference | p5.js](https://p5js.org/reference/#/p5.Color)**
>
> p5.js a JS client-side library for creating graphic and interactive experiences, based on the core principles of Processing.

…but high level API methods interact with it in more or less the same way, even though the ways that colors are stored and manipulated internally are very different.