Same as before, I have not posted the QuadGrid class code because I want to show how easy it is to use. This video shows the final version of QuadGrid in action, it is created using the code shown below.
This is the code the user would have written for this sketch, just 48 lines.
QuadGrid.Builder builder;
QuadGrid front, side;
boolean isVisible;
int animDuration = 500; // milliseconds
void setup() {
size(450, 400, P2D);
textSize(24);
textAlign(CENTER, CENTER);
// Create the builder object
builder = new QuadGrid.Builder();
// Build the front face
PImage img = loadImage("transport.jpg");
builder.useImage(img).detail(8, 6)
.staticEdge(100, 100, 100, 350).movingEdge(400, 130, 400, 320)
.zoom(50, 225, 0.9f); // left of static edge centre to give enlargement to right
front = builder.build();
// Build the left side
img = loadImage("brick.jpg");
builder.useImage(img).detail(2, 8)
.movingEdge(50, 150, 50, 300).uvCoords(0, 0.2f, 0, 1);
side = builder.build();
// All done simulate mouse click to get things started
isVisible = false;
mouseClicked();
}
void mouseClicked() {
if (!front.isAnimating() && !side.isAnimating()) {
if (isVisible) {
front.anim(this, 1, 0, animDuration);
side.anim(this, 1, 0, animDuration);
isVisible = false;
} else {
front.anim(this, 0, 1, animDuration);
side.anim(this, 0, 1, animDuration);
isVisible = true;
}
}
}
void draw() {
background(200, 210, 255);
fill(0);
text("Click mouse anywhere\nto animate", 0, 0, width, 100);
front.drawGrid(this);
side.drawGrid(this);
}
You can click here to download the archived sketch used to produce this video.
The QuadGrid class uses the builder pattern to create the QuadGrid instances so if you have questions about using this class then feel free to ask…