This original code allows processing to generate a series of vertical rectangles depends on the width of the rectangle and the width of the screen. By tracking the change of X coordinate of the mouse, it generates new rectangles with different hues and then overlay on top of the older ones.
In my modified code, I changed the background color from Black to white by alternating the RBG value. I also modified the code to generate horizontal rectangles instead of vertical ones. Moreover, it now tracks the Y coordinate of the mouse and populates hue values base on that coordinate.
Modified Code:
// Change from int barWidth to barHeigth, and change the int to a value that can be divided by the screen height.int barHeight = 72;
int lastBar = -1;
void setup()
{
size(640, 360);
// change HSB ( Hue, Saturation, and Brightness) of the color now depending on canvas width
colorMode(HSB, width, width, width);
noStroke();
// background color change from black to white
background(255);
}
void draw()
{
//change from mouseX to mouseY, now the int whichBar is depended on the Y coordinate of the mouse.
int whichBar = mouseY / barHeight;
if (whichBar != lastBar) {
int barY = whichBar * barHeight;
// change fill mouseX to mouseY now the hue will depend on the Y coordinate of the mouse
fill(mouseY, width, width);
//change the rects from vertical to horizontal
rect(0, barY, width, barHeight);
lastBar = whichBar;
}
}
Original Code:
int barWidth = 20;
int lastBar = -1;
void setup()
{
size(640, 360);
colorMode(HSB, height, height, height);
noStroke();
background(0);
}
void draw()
{
int whichBar = mouseX / barWidth;
if (whichBar != lastBar) {
int barX = whichBar * barWidth;
fill(mouseY, height, height);
rect(barX, 0, barWidth, height);
lastBar = whichBar;
}
}
No comments:
Post a Comment