Hi, I’m writing some code where I need to draw smiley’s. Now I already have the smiley’s but I need to change the position and the size of the smiley with functions. The only thing I still need to do is change the size but every time I change it, the eyes and the mouth of the smiley don’t stay in place.
Remember that you can format your code by using the </> parameter in the message editor.
First of all, you should consider making your drawing functions as more generic as possible by giving them the parameters of where and how the smiley should be drawn.
In fact, you are calling two functions (smiley() and positionSmiley()) that have exactly the same behavior.
This is an example of how it would look :
void drawSmiley(float x, float y, color smiley_color, float size){
//Draw the smiley at location (x,y)
//With the ellipse color as smiley_color
//The size is controlling the scale of the smiley
}
For the size, one solution is to give a size parameter and in your smiley function, then you draw each elements (eyes, mouth and ellipse) proportional to that size.
This could be the solution :
CODE
void setup() {
size(500, 500);
}
void draw() {
background(#C2C6F0);
//Smiley size proportional to mouseX position
float smiley_size = map(mouseX, 0, width, 0, 400);
//We draw the smiley in the middle of the screen
drawSmiley(width/2, height/2, color(#EFF02C), smiley_size);
}
void drawSmiley(float x, float y, color smiley_color, float size){
//Head
strokeWeight(5);
fill(smiley_color);
ellipse(x, y, size, size);
//Eyes
float face_factor = 6;
strokeWeight(size / 10);
stroke(0);
point(x - size/face_factor, y - size/face_factor);
point(x + size/face_factor, y - size/face_factor);
//Mouth
line(x - size/face_factor, y + size/face_factor,
x + size/face_factor, y + size/face_factor);
}
There is an excellent tutorial for beginner coders on youtube by Khan Academy that walks through the steps of resizing shapes with variable expressions.