27. Oktober 2011

Die digitale Uhr stellt die Zeit in drei Reihen dar: Stunden, Minuten und Sekunden. Die Anzahl Segmente repräsentieren die Anzahl Stunden des Tages, Minuten der Stunde und Sekunden der Minute, die verstrichen sind. Um die Skala lesbarer zu machen, erscheint eine rote Hilfslinie mit der Angabe der aktuellen Position. Durch Drücken der Taste "s" kann das Farbschema der Uhr definiert werden. Skript Durch die Funktionen hour(), minute() und second() werden die entsprechende Zahl der Rechtecke in eine For-Schleife generiert und mit einem Versatz platziert. Befindet ich der Cursor innerhalb der angegeben x und y Koordinaten, wird die Hilfslinie gezeichnet. Durch das Dividieren durch 10, Umwandeln in ein Integer und das anschliessende Multiplizieren mit 10 der MouseX-Position wird die Schrittweise auf 10px granuliert.

PImage imageZifferblatt = null;
int setX = 20; // x Beginn
int setY = 33; // y Beginn
int setW = 10; // Width
int setH = 20; // Height
int setS = 1;  // Space

// Colors
color setColor01 = color(255);
color setColor02 = color(196, 246, 255);
color setColor03 = color(239, 255, 178);
color setColor04 = color(255, 193, 178);
color setColor05 = color(255, 178, 237);

int displayFlag = 0;
color color1 = color(255);

void setup() {

  frameRate(15);
  size(640, 130);

  PFont font;
  font = loadFont("FFFAlaska-30.vlw");
  textFont(font, 30);
  smooth();

}

void keyPressed () {

 switch(key) {
   case 's':
     displayFlag = 1;
     break;

   case 'x':
     displayFlag = 0;
     break;
 }

}

void draw() {

  // Uhr
  if (displayFlag == 0) {

    //if (frameCount%3 == 0) {

      background(20);
      image(loadImage("/data/zifferblatt.png"), 0, 0, 700, 300);

      int h = 20;
      int wH = hour() * 10;
      int wM = minute() * 10;
      int wS = second() * 10;

      fill(color1);
      noStroke();

      for (int i = 0; i < hour(); i++) {
        int x = i * setW + setX + setS;
        rect(x, setY, setW - setS, setH);
      }

      for (int i = 0; i < minute(); i++) {
        int x = i * setW + setX + setS;
        rect(x, 55, setW - setS, setH);
      }

      for (int i = 0; i < second(); i++) {
        int x = i * setW + setX + setS;
        rect(x, 77, setW - setS, setH);
      }

    //}

    if (mouseX > setX && mouseY > setY
        && mouseX < setX + 600 && mouseY < setY + 66) {

      int x = int(mouseX * 0.1);
      x = x * 10;

      pushMatrix();
        translate(x, setY);

        stroke(255, 0, 0);
        line(0, -8, 0, 72);

        String infoText = nf(int((x - setX) * 0.1), 2);
        int xOffset = 5;

        if (x > 550)
          xOffset = xOffset - 55;

        fill(255, 0, 0);
        textSize(30);
        text(infoText, xOffset, setY + 17);
      popMatrix();

    }

  }

  // Setting
  if (displayFlag == 1) {

    background(20);
    noStroke();

    fill(255);
    textSize(16);
    text("Settings", 20, 30);

    textSize(10);
    text("Color", 20, 60);

    fill(setColor01);
    rect(20, 70, 20, 20);

    fill(setColor02);
    rect(50, 70, 20, 20);

    fill(setColor03);
    rect(80, 70, 20, 20);

    fill(setColor04);
    rect(110, 70, 20, 20);

    fill(setColor05);
    rect(140, 70, 20, 20);

  }

  if (mousePressed) {
    if (mouseX >= 20 && mouseY >= 70 &&
        mouseX <= 40 && mouseY <= 90) {

      color1 = setColor01;
      displayFlag = 0;

    }

    if (mouseX >= 50 && mouseY >= 70 &&
        mouseX <= 70 && mouseY <= 90) {

      color1 = setColor02;
      displayFlag = 0;

    }

    if (mouseX >= 80 && mouseY >= 70 &&
        mouseX <= 100 && mouseY <= 90) {

      color1 = setColor03;
      displayFlag = 0;

    }

    if (mouseX >= 110 && mouseY >= 70 &&
        mouseX <= 130 && mouseY <= 90) {

      color1 = setColor04;
      displayFlag = 0;

    }

    if (mouseX >= 140 && mouseY >= 70 &&
        mouseX <= 160 && mouseY <= 90) {

      color1 = setColor05;
      displayFlag = 0;

    }

  }

}

Download Clock