# Color Selecting

**URL:** <https://discourse.processing.org/t/color-selecting/16144>\
**Category:** Coding Questions\
**Created:** [December 5, 2019, 8:39am UTC](https://discourse.processing.org/t/color-selecting/16144 "2019-12-05T08:39:43Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![keeg23](https://avatars.discourse-cdn.com/v4/letter/k/4da419/32.png) [@keeg23](https://discourse.processing.org/u/keeg23)\
**Post date:** [December 5, 2019, 8:39am UTC](https://discourse.processing.org/t/color-selecting/16144/1 "2019-12-05T08:39:43Z")

</div>

I am currently running into trouble having the color being selected and drawing… The colors will not work when pressed on? Not exactly sure why it is not working

```auto
PImage myElonStart, myMonroe, myLennon, 
  myBlueCan, myRedCan, myPinkCan, myGreenCan, myTanCan, 
  mySave, myRestart, myBrush1, myBrush2, myBrush3;
PFont thePopArtFont;
boolean saveTheImage =false;
boolean justSaved = false;

// ***********COLORS*****************
color bluePaint = color(0, 144, 255);
color currentColor = color(0, 144, 255);
color black = color(0);
color redPaint = color(255, 4, 4);
color greenPaint = color (92, 207, 102);
color pinkPaint = color (253, 80, 116);
color tanPaint = color (245, 170, 91);
color orgBackground = color (255, 122, 10);

boolean typeIsCan=true;

void setup() {
  size (1280, 720);
  background(orgBackground);
  //load images
  myElonStart = loadImage("elonData.png");
  myMonroe = loadImage("monroeData.png");
  myLennon = loadImage("lennonData.png");
  myBlueCan = loadImage("blueCan.png");
  myRedCan = loadImage("redCan.png");
  myPinkCan = loadImage("pinkCan.png");
  myGreenCan = loadImage("greenCan.png");
  myTanCan = loadImage("tanCan.png");
  mySave = loadImage("save.png");
  myRestart = loadImage("restart.png");
  myBrush1 = loadImage("brush1.png");
  myBrush2 = loadImage("brush2.png");
  myBrush3 = loadImage("brush3.png");

  //load font
  thePopArtFont = createFont("GoldenHillsDEMO.ttf", 50);
  textFont(thePopArtFont);
}

void draw() {
  fill(black);
  text("Pop Art Paint Program", width/3, 50);
  fill(bluePaint);
  text("Pop Art Paint Program", width/3.01, 47);
  checkRollovers();
  myBorder(); //Draws blue border around window
  myDrawPeople(); //puts three pictures of options to paint
  myButtonLayout();

  if (mousePressed)
  {
    noStroke();
    fill(black);
    if (typeIsCan)
    {
      if ((mouseX>10) && (mouseX<80) && (mouseY>5) && (mouseY<121))
      {
        fill(bluePaint);
      } else {
        fill(bluePaint);
        ellipse(mouseX, mouseY, 20, 20);
        ellipse(pmouseX, pmouseY, 20, 20);
      }
      if ((mouseX>10) && (mouseX<80) && (mouseY>130) && (mouseY>246))
      {
        fill(redPaint);
      } else {
        fill(redPaint);
        ellipse(mouseX, mouseY, 20, 20);
        ellipse(pmouseX, pmouseY, 20, 20);
      }
    }
  }
}

```

 ![05 AM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/6/6c544bf43887408fac5e93136c0b9c805db407b8.png)

---

<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 5, 2019, 9:33am UTC](https://discourse.processing.org/t/color-selecting/16144/2 "2019-12-05T09:33:11Z")

</div>

all the color and the brush ICONs are buttons.  
when they are clicked you can set a number  
for the color and brush size like

```auto
color paint=color(0);
int brush = 5;

void mousePressed() {
 if ( over(b1x,b1y,b1w,b1h) ) paint = color(200,0,0); // RED button

 if ( over(b6x,b6y,b6w,b6h) ) brush = 15; // brush 1 button ( circle diameter select)
}

void draw() {
 fill(paint);
 circle(mouseX,mouseY,brush);
}

```

no PM for coding questions please

---

<div class="post-metadata">

**Author:** ![keeg23](https://avatars.discourse-cdn.com/v4/letter/k/4da419/32.png) [@keeg23](https://discourse.processing.org/u/keeg23)\
**Post date:** [December 5, 2019, 9:36am UTC](https://discourse.processing.org/t/color-selecting/16144/3 "2019-12-05T09:36:26Z")

</div>

So should I just delete the one section I have at the bottom of my code and set it up this way?

So get rid of this part??

```auto
if (mousePressed)
  {
    noStroke();
    fill(black);
    if (typeIsCan)
    {
      if ((mouseX>10) && (mouseX<80) && (mouseY>5) && (mouseY<121))
      {
        fill(bluePaint);
      } else {
        fill(bluePaint);
        ellipse(mouseX, mouseY, 20, 20);
        ellipse(pmouseX, pmouseY, 20, 20);
      }
      if ((mouseX>10) && (mouseX<80) && (mouseY>130) && (mouseY>246))
      {
        fill(redPaint);
      } else {
        fill(redPaint);
        ellipse(mouseX, mouseY, 20, 20);
        ellipse(pmouseX, pmouseY, 20, 20);
      }
    }
  }
}

```

---

<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 5, 2019, 9:39am UTC](https://discourse.processing.org/t/color-selecting/16144/4 "2019-12-05T09:39:08Z")

</div>

sorry, it is just a idea how to restructure your program,  
if you happy with the current structure or not understand what i want to show, ignore it.

---

<div class="post-metadata">

**Author:** ![keeg23](https://avatars.discourse-cdn.com/v4/letter/k/4da419/32.png) [@keeg23](https://discourse.processing.org/u/keeg23)\
**Post date:** [December 5, 2019, 9:40am UTC](https://discourse.processing.org/t/color-selecting/16144/5 "2019-12-05T09:40:22Z")

</div>

To be honest I am just trying to get the color feature to work so when you click over the paint can it will select that color and will draw with it

---

<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 5, 2019, 9:52am UTC](https://discourse.processing.org/t/color-selecting/16144/6 "2019-12-05T09:52:32Z")

</div>

yes, that is also what i try to show,  
just not have the pictures…

```auto
color paint=color(0);
int brush = 5;
int b1x = 10, b1y = 10, b1w =80, b1h =30;
int b6x = 400, b6y = 10, b6w =80, b6h =30;

void setup() {
  size(500, 500);
  drawButtons();
  noStroke();
}

void draw() {
  fill(paint);
  circle(mouseX, mouseY, brush);
}

void mousePressed() {
  if ( over(b1x, b1y, b1w, b1h) ) paint = color(200, 0, 0); // RED button

  if ( over(b6x, b6y, b6w, b6h) ) brush = 15; // brush 1 button ( circle diameter select)
}

void drawButtons() {
  fill(200, 0, 0);
  rect(b1x, b1y, b1w, b1h); // color RED button use ICON instead
  fill(255);
  rect(b6x, b6y, b6w, b6h); // brush 15 button use ICON instead
  fill(0);
  text("brush 15", b6x+3, b6y+b6h-5);  
}

boolean over(int x, int y, int w, int h) {
  return ( mouseX > x & mouseX < x + w & mouseY > y & mouseY < y + h ) ;
}

```

but you can easy add them in / need to fix the bX settings also  
like to ICON position and size  
and use its variables for ICON position too.

anyhow that is a working program with a easier button operation.  
run it to see how it works.