Skip to content

Instantly share code, notes, and snippets.

@KrabCode
Created July 23, 2024 09:53
Show Gist options
  • Save KrabCode/afc1cdd2f84f1683db21665cea2e7814 to your computer and use it in GitHub Desktop.
Save KrabCode/afc1cdd2f84f1683db21665cea2e7814 to your computer and use it in GitHub Desktop.
float count = 10;
float step = 40;
float xPos = 400;
PGraphics gradient;
void setup() {
size(800, 600, P2D);
createGradient();
rectMode(CORNER);
frameRate(6);
}
void draw() {
xPos += step;
xPos %= width;
background(32);
image(gradient, width/2 - 80, height / 2 - 200, 160, 160); // debug gradient visual
noStroke();
float gradientMiddleX = gradient.width/2f;
float y = height / 2 + 100;
for (int i = 1; i < count; i++) {
// find this rectangle's slice of the gradient
float texCoordY = norm(i, 0, count-1);
float texCoordYPrevious = norm(i-1, 0, count-1);
float x = (xPos + i * step) % width;
beginShape(); // draw a shape, one rectangle in our case
texture(gradient); // using this texture
textureMode(NORMAL); // using texture coords in range [0-1]
vertex(x+step, y, gradientMiddleX, texCoordY); // top right, start of local gradient segment
vertex(x+step, y+step, gradientMiddleX, texCoordY); // bot right, start of local gradient segment
vertex(x, y+step, gradientMiddleX, texCoordYPrevious); // bot left, end of local gradient segment
vertex(x, y, gradientMiddleX, texCoordYPrevious); // top left, end of local gradient segment
endShape();
}
}
void createGradient() {
int topColor = color(150, 255, 100);
int botColor = color(255, 0, 125);
gradient = createGraphics(width, height, P2D);
gradient.beginDraw();
gradient.clear();
gradient.beginShape();
gradient.fill(topColor);
gradient.vertex(0, 0);
gradient.vertex(gradient.width, 0);
gradient.fill(botColor);
gradient.vertex(gradient.width, gradient.height);
gradient.vertex(0, gradient.height);
gradient.endShape();
gradient.endDraw();
}
@KrabCode
Copy link
Author

18

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment