Percentage Widgets

pwidget.pde

void fancyCirclePercentWidget(int percent) {
    float p = percent/50.;
    pushMatrix();
    translate(50,50);
    rotate(radians(270));
    ellipseMode(CENTER);
    stroke(0);
    strokeWeight(1);
    noFill();
    ellipse(0,0,30,30);
    ellipse(0,0,50,50);
    for(int i = 1; i < 20; i++) {
        stroke(50+10*abs(i-10));
        arc(0,0,30+i,30+i,0,PI*p);
    }
    popMatrix();
}

void fastCirclePercentWidget(int percent) {
    float p = percent/50.;
    pushMatrix();
    translate(130,50);
    rotate(radians(270));
    strokeWeight(10);
    strokeCap(SQUARE);
    stroke(0);
    noFill();
    arc(0,0,35,35,0,PI*p);
    popMatrix();
}

void boxCirclePercentWidget(int percent) {
    float p = percent/50.;
    pushMatrix();
    translate(200,50);
    rotate(radians(270));
    strokeWeight(10);
    strokeCap(SQUARE);
    stroke(0);
    noFill();
    arc(0,0,35,35,0,PI*p);
    strokeWeight(1);
    ellipse(0,0,25,25);
    ellipse(0,0,45,45);
    popMatrix();
}

void fancyBar(int percent) {
    rectMode(CORNERS);
    strokeWeight(1);
    noFill();
    stroke(0);
    rect(30,129,130,150);
    for(int i = 130; i < 150; i++) {
        stroke(50+10*abs(i-140));
        line(30,i,30+percent,i);
    }
}

void boxBar(int percent) {
    rectMode(CORNERS);
    strokeWeight(1);
    stroke(0);
    noFill();
    rect(30,99,130, 120);
    noStroke();
    fill(0);
    rect(30,100,30+percent,120);
}

void fastBar(int percent) {
    rectMode(CORNERS);
    strokeWeight(1);
    stroke(0);
    fill(0);
    rect(30,160,30+percent,180);
}

int c;

void setup() {
    size(400,400);
    c = 0;
}

void draw() {
    if(mousePressed) c = 100;
    if(c < 200) c++;
    background(255);
    fill(0);
    text("Percent completion: " + ((c < 100)? 0 : (c-100)), 10,10);
    if(c > 100) {
        fancyCirclePercentWidget((c - 100));
        fastCirclePercentWidget((c-100));
        boxCirclePercentWidget((c-100));
        fancyBar((c-100));
        boxBar((c-100));
        fastBar((c-100));
    }
}