hello,

better stick to one thread instead of opening a new discussion...

check whether it's inside the box and if it's not, paint (see if line in bold script)

at the moment when mouse is clicked, store the mouse pos in an extra var ellipseX, ellipseY and paint the ellipse using that extra var


3.
it's like this...

1. boolean bCircleShow=false;
2. float opacity;
3. int diameter=0;
4. float ellipseX, ellipseY;
5. //
6. void setup () {
7.   size (400, 300);
8.   background (255);
9.   smooth ();
10.   opacity=255;
11. }
12. //
13. void draw() {
14.   background (122);
15.   //
16.   stroke (255, 0, 0);
17.   noFill();
18.   rect(100, 220, 100, 60); // must be the same as below
    
19.   //
20.   noStroke();
21.   fill(255);
22.   if (bCircleShow) {
23.     fill(255, 2, 2, opacity);
24.     ellipse (ellipseX, ellipseY, diameter, diameter );
25.     diameter ++;
26.     opacity--;
27.     if (opacity<=0) {
28.       bCircleShow=false; // end
29.     }
30.   }
31. }
32. //
33. void mouseClicked() {
34.   // check whether it is not (this is the !-sign) within rect
    
35.   if (!(mouseX>100 && mouseX<200&&
36.     mouseY>220 && mouseY<280)) {
37.     // take the mouse pos into ellipseX and ellipseY
38.     ellipseX=mouseX;
39.     ellipseY=mouseY;
40.     bCircleShow=true;
41.     opacity=255;
42.     diameter=0;
43.   }
44. }

also with rectmode CENTER before it

Hello,

yeah, remember: with rect you say xpos, ypos, width, height :

1. rect(width/2,height/2,width/2,height/2);

in mouseClicked you check the same rect
with asking:

• is mouseX>xpos
• is mouseX<the xpos of the right side (so it's xpos+width!!!!!!)
• is mouseY>ypos
• is mouseY<the ypos of the lower side (so it's ypos+height!!!!!!)

or for your values

• mouseX>width/2
• mouseX<width/2+width/2
• mouseY>height/2
• mouseY<height/2+height/2

so it's

1.   if (!(mouseX>width/2 && mouseX<width/2+width/2&&
2.     mouseY>height/2 && mouseY<height/2+height/2)) {

Remark:
you should store xpos and ypos and width and height in global variables (or constants) and
thus when you change it in this one place, it's painted right and is right in mouseClicked as well.

1. final float rectXPos=width/2 ;
2. final float rectYPos=height/2 ;
3. final float rectWidth=width/2 ;
4. final float rectHeight=height/2 ;

and then use those values in rect and in mouseClicked.

Greetings, Chrisir