I still Need HELP TO FINALIZE MY PAINT PROGRAM. by May 4th 2012. PLEASE HELP!!!

Programming Questions

Yohan

I still Need HELP TO FINALIZE MY PAINT PROGRAM. by May 4th 2012. PLEASE HELP!!!

in Programming Questions • 1 year ago

I need help to finish my paint program. I want to relocate the rectangles and circles on the right side of the GUI screen on the Y axis in two rows one for rectangles and one for circles. The only problem is is that when I did just that the paint program could not paint the colours of the shapes it could only paint black.

This is what I have so far.

int Yellow;
int Red;
int Green;
int Blue;
int black;
int LightGrey;
color currentColor;
boolean typeIsRect;

void setup()
{
size(640,480);
background(0);
frameRate(59);

Yellow = color(255,255,0);
Red = color(255,0,0);
Green = color(0,255,0);
Blue = color(0,0,255);
black = color(0);
LightGrey = color(200);
currentColor = color(102);
typeIsRect = true;
PFont font;
textAlign(CENTER);
fill(95, 245, 183);
text("Paint Pro 3000", 300, 60);

}

void draw()
{
stroke(5);
smooth();

fill(LightGrey);
rect(10,10,190,70);

fill(Yellow);
rect(20,20,20,20);
fill(Red);
rect(50,20,20,20);
fill(Green);
rect(80,20,20,20);
fill(Blue);
rect(110,20,20,20);

fill(black);
rect(140,20,50,50);

fill(Yellow);
ellipse(30,60,20,20);
fill(Red);
ellipse(60,60,20,20);
fill(Green);
ellipse(90,60,20,20);
fill(Blue);
ellipse(120,60,20,20);

if (mousePressed)
{
    noStroke();
    fill(currentColor);
    if (typeIsRect)
    {
      if ((mouseX>140) && (mouseY>20) && (mouseX<190) && (mouseY<70))
      {
        rect(mouseX-25,mouseY-25,50,50);
      }
      else
      {
        rect(mouseX-10,mouseY-10,20,20);
      }
    }
    else
    {
      ellipse(mouseX,mouseY,20,20);
    }
}
}

void mousePressed()
{

if ((mouseX>20) && (mouseY>20) && (mouseX<40) && (mouseY<40))
{
    typeIsRect = true;
    currentColor = color(Yellow);
}
if ((mouseX>50) && (mouseY>20) && (mouseX<70) && (mouseY<40))
{
    typeIsRect = true;
    currentColor = color(Red);
}
if ((mouseX>80) && (mouseY>20) && (mouseX<100) && (mouseY<40))
{
    typeIsRect = true;
    currentColor = color(Green);
}
if ((mouseX>110) && (mouseY>20) && (mouseX<130) && (mouseY<40))
{
    typeIsRect = true;
    currentColor = color(Blue);
}
if ((mouseX>140) && (mouseY>20) && (mouseX<190) && (mouseY<70))
{
    typeIsRect = true;
    currentColor = color(black);
}

if ((mouseX>20) && (mouseY>50) && (mouseX<40) && (mouseY<70))
{
    typeIsRect = false;
    currentColor = color(Yellow);
}
if ((mouseX>50) && (mouseY>50) && (mouseX<70) && (mouseY<70))
{
    typeIsRect = false;
    currentColor = color(Red);
}
if ((mouseX>80) && (mouseY>50) && (mouseX<100) && (mouseY<70))
{
    typeIsRect = false;
    currentColor = color(Green);
}
if ((mouseX>110) && (mouseY>50) && (mouseX<130) && (mouseY<70))
{
    typeIsRect = false;
    currentColor = color(Blue);
}
}

Replies(10)

Jonny Stu..

Re: I Need HELP and I am a rookie

1 year ago

The first thing I suggest you do is define the location of all the rectangles and squares with variables instead numbers in the code. This will make it much easier to change the layout. For example:

int yellowRectX = 20;
int yellowRectY = 20;
int yellowRectSize = 20;
void draw() {
rect(yellowRectX, yellowRectY, yellowRectSize, yellowRectSize);
}
void mousePressed() {
if ((mouseX > yellowRectX) && (mouseY > yellowRectY) && ((mouseX < yellowRectX + yellowRectSize) //and so on...

In your case it probably makes more sense to just define rectSize and use that throughout.

Yohan

Re: Re: I Need HELP and I am a rookie

1 year ago

Hi Jonny Stutter got your message I appreciate the help. However I am still having problems with your solution. Processing is dyning your code because of the unexpected token int syntax.

Everything from int yellowRectSize = 20; is denied please help

many tnx.

int yellowRectSize = 20;

int Red;
int redRectX = 50;
int redRectY = 20;
int redRectSize = 20;

int Green;
int greenX = 80;
int greenY = 20;
int greenRectSize = 20;

int Blue;
int blueX = 110;
int blueY = 20;
int blueRectSize = 20;

int black;
int blackX = 140;
int blackY = 20;
int blackRectSize = 50

int LightGrey;
color currentColor;
boolean typeIsRect;

void setup()
{
size(640,480);
background(0);
frameRate(59);

void draw()
{
stroke(5);
smooth();

fill(LightGrey);
rect(10,10,190,70);

void mousePressed()
{

Chrisir

Re: I Need HELP and I am a rookie

1 year ago

Yes, or have a real array with the buttons, their position and their colors

or use a lib

without lib see
http://www.openprocessing.org/sketch/48351

jamesmano..

Re: I Need HELP and I am a rookie

1 year ago

here is a variation using OOP, this way you can make each "button" draw itself.

class Button {
color c;
boolean isRect;
float h;
float w;
float x;
float y;
Button() {
h = 20;
w = 20;
}
Button(color cVal, boolean isRectVal, float xVal, float yVal) {
this(); // call base constructor
c = cVal;
isRect = isRectVal;
x = xVal;
y = yVal;
}
boolean within(float xVal, float yVal) {
if (isRect) {
return(xVal > x - w/2 && xVal < x + w/2 && yVal > y - h/2 && yVal < y + h/2);
} else {
// assume a circle
return(dist(xVal, yVal, x, y) < h/2);
}
}
void display() {
stroke(0);
strokeWeight(1);
fill(c);
if (isRect) {
rectMode(CENTER);
rect(x,y,w,h);
} else {
ellipseMode(CENTER);
ellipse(x,y,w,h);
}
}
}
int Yellow;
int Red;
int Green;
int Blue;
int black;
int LightGrey;
color currentColor;
boolean typeIsRect;
Button[] colorButton = new Button[8]; // allocate space for 8 buttons
void setup()
{
size(640,480);
background(0);
frameRate(59);
Yellow = color(255,255,0);
Red = color(255,0,0);
Green = color(0,255,0);
Blue = color(0,0,255);
black = color(0);
LightGrey = color(200);
currentColor = color(102);
typeIsRect = true;
PFont font;
textAlign(CENTER);
fill(95, 245, 183);
text("Paint Pro 3000", 300, 60);
// rects
colorButton[0] = new Button(Yellow, true, 30, 30);
colorButton[1] = new Button(Red, true, 60, 30);
colorButton[2] = new Button(Green, true, 90, 30);
colorButton[3] = new Button(Blue, true, 120, 30);
// circles
colorButton[4] = new Button(Yellow, false, 30, 60);
colorButton[5] = new Button(Red, false, 60, 60);
colorButton[6] = new Button(Green, false, 90, 60);
colorButton[7] = new Button(Blue, false, 120, 60);
}
void draw()
{
rectMode(CORNER);
stroke(5);
smooth();
fill(LightGrey);
rect(10,10,190,70);
fill(black);
rect(140,20,50,50);
// display all buttons
boolean overButton = false;
for (int i = 0; i < colorButton.length; i++) {
colorButton[i].display();
if (colorButton[i].within(mouseX, mouseY)) overButton = true;
}
if (overButton) cursor(HAND); else cursor(CROSS);
if (mousePressed)
{
noStroke();
rectMode(CENTER);
fill(currentColor);
if (typeIsRect)
{
if ((mouseX>140) && (mouseY>20) && (mouseX<190) && (mouseY<70))
{
rect(mouseX-25,mouseY-25,50,50);
}
else
{
rect(mouseX-10,mouseY-10,20,20);
}
}
else
{
ellipse(mouseX,mouseY,20,20);
}
}
}
void mousePressed() {
for (int i = 0; i < colorButton.length; i++) { // cycle through each button
if (colorButton[i].within(mouseX, mouseY)) { // is the mouse within the button's space
switch(i) { // is so hanle based on i, or the button
case 0:
currentColor = Yellow;
typeIsRect = true;
break;
case 1:
currentColor = Red;
typeIsRect = true;
break;
case 2:
currentColor = Green;
typeIsRect = true;
break;
case 3:
currentColor = Blue;
typeIsRect = true;
break;
case 4:
currentColor = Yellow;
typeIsRect = false;
break;
case 5:
currentColor = Red;
typeIsRect = false;
break;
case 6:
currentColor = Green;
typeIsRect = false;
break;
case 7:
currentColor = Blue;
typeIsRect = false;
break;
}
}
}
}

Yohan

Re: I Need HELP and I am a rookie

1 year ago

Thankyou for the help. I am new to processing I have only used it for a month. I never used the OPP syntax please help if you can with a more basic approach thankyou.

jamesmano..

Re: I still Need HELP TO FINALIZE MY PAINT PROGRAM. by May 4th 2012. PLEASE HELP!!!

1 year ago

one way is to create two variables and use them to offset what you have already drawn. for example:

int xOffset = 100;
int yOffset = 100;

then in your code you need to update every single instance where you draw a rect or ellipse, for example:

rect(20,20,20,20);

becomes:

rect(xOffset + 20,yOffset + 20,20,20);

therefore, instead of having the rect start at 20, 20 it starts at 120, 120. Once you update your code, you can just change the xOffset and yOffset to change where it is being displayed.

calsign

Re: Re: I still Need HELP TO FINALIZE MY PAINT PROGRAM. by May 4th 2012. PLEASE HELP!!!

1 year ago

Perhaps a more efficient way would be to use Transformations.

Yohan

Re: I still Need TO FINALIZE MY PAINT PROGRAM. by May 4th 2012. PLEASE HELP!!!

1 year ago

I still do not understand? what's offset. I have never used such a syntax before. I have been using processing for only 30 days! Is there a more basic solution for me to comprehend? I checked processing there is no offset command in refrence.

jamesmano..

Re: I still Need HELP TO FINALIZE MY PAINT PROGRAM. by May 4th 2012. PLEASE HELP!!!

1 year ago

These are both variables, that I am suggesting you use.

you can take a look at these links to get an idea of how variables are used:

http://www.processing.org/learning/basics/variables.html

http://www.learningprocessing.com/examples/

Chapter 4

Example 4-1: Variable Declaration and Initialization Examples

Example 4-2: Using Variables

Example 4-3: Varying Variables

Example 4-4: Many Variables

Example 4-5: Using System Variables

Example 4-6: Ellipse with Variables

Example 4-7: Filling Variables with Random Values

Example 4-8: Variable Zoog

Jonny Stu..

Re: I still Need HELP TO FINALIZE MY PAINT PROGRAM. by May 4th 2012. PLEASE HELP!!!

1 year ago

What everyone else is saying in this thread is absolutely correct - OOP and offsets are a much better way of doing what you're doing and you should learn about them. I'm hoping that the code below is similar enough to what you wrote that you'll understand it. I've made the changes so that the yellow rect is fully defined by variables at the top. You need to go through yourself and make the changes for the other rectangle colours and the circles.

int red;
int redRectX = 50;
int redRectY = 20;
int redRectSize = 20;
int green;
int greenX = 80;
int greenY = 20;
int greenRectSize = 20;
int blue;
int blueX = 110;
int blueY = 20;
int blueRectSize = 20;
int black;
int blackX = 140;
int blackY = 20;
int blackRectSize = 50;
int yellow;
int yellowRectX = 20;
int yellowRectY = 20;
int yellowRectSize = 20;
int lightGrey;
color currentColor;
boolean typeIsRect;
void setup()
{
size(640,480);
background(0);
frameRate(59);
yellow = color(255,255,0);
red = color(255,0,0);
green = color(0,255,0);
blue = color(0,0,255);
black = color(0);
lightGrey = color(200);
currentColor = color(102);
typeIsRect = true;
PFont font;
textAlign(CENTER);
fill(95, 245, 183);
text("Paint Pro 3000", 300, 60);
}
void draw()
{
stroke(5);
smooth();
fill(lightGrey);
rect(10,10,190,70);
fill(yellow);
rect(yellowRectX,yellowRectY,yellowRectSize,yellowRectSize);
fill(red);
rect(50,20,20,20);
fill(green);
rect(80,20,20,20);
fill(blue);
rect(110,20,20,20);
fill(black);
rect(140,20,50,50);
fill(yellow);
ellipse(30,60,20,20);
fill(red);
ellipse(60,60,20,20);
fill(green);
ellipse(90,60,20,20);
fill(blue);
ellipse(120,60,20,20);
if (mousePressed)
{
noStroke();
fill(currentColor);
if (typeIsRect)
{
if ((mouseX>140) && (mouseY>20) && (mouseX<190) && (mouseY<70))
{
rect(mouseX-25,mouseY-25,50,50);
}
else
{
rect(mouseX-10,mouseY-10,20,20);
}
}
else
{
ellipse(mouseX,mouseY,20,20);
}
}
}
void mousePressed()
{
if ((mouseX>yellowRectX) && (mouseY>yellowRectY) && (mouseX<yellowRectX + yellowRectSize) && (mouseY<yellowRectY + yellowRectSize))
{
typeIsRect = true;
currentColor = color(yellow);
}
if ((mouseX>50) && (mouseY>20) && (mouseX<70) && (mouseY<40))
{
typeIsRect = true;
currentColor = color(red);
}
if ((mouseX>80) && (mouseY>20) && (mouseX<100) && (mouseY<40))
{
typeIsRect = true;
currentColor = color(green);
}
if ((mouseX>110) && (mouseY>20) && (mouseX<130) && (mouseY<40))
{
typeIsRect = true;
currentColor = color(blue);
}
if ((mouseX>140) && (mouseY>20) && (mouseX<190) && (mouseY<70))
{
typeIsRect = true;
currentColor = color(black);
}
if ((mouseX>20) && (mouseY>50) && (mouseX<40) && (mouseY<70))
{
typeIsRect = false;
currentColor = color(yellow);
}
if ((mouseX>50) && (mouseY>50) && (mouseX<70) && (mouseY<70))
{
typeIsRect = false;
currentColor = color(red);
}
if ((mouseX>80) && (mouseY>50) && (mouseX<100) && (mouseY<70))
{
typeIsRect = false;
currentColor = color(green);
}
if ((mouseX>110) && (mouseY>50) && (mouseX<130) && (mouseY<70))
{
typeIsRect = false;
currentColor = color(blue);
}
}

Top Reply