Verfremdung von QR-Codes mittels Processing

Wer als Benutzer von Processing oder Processing.js vor allem an einer künstlerischen Verfremdung von QR-Codes interessiert ist, hat verschiedene Möglichkeiten, das Muster eines QR-Codes in eine "Sketch" zu laden.

Möglichkeiten für Processing:

• Muster als Array-Literal direkt in eine Sketch integrieren (klappt nur für kleine QR-Codes)
• Muster aus einer JSON-Datei einlesen

Möglichkeiten für Processing.js:

• Muster als Array-Literal direkt in eine Sketch integrieren (klappt nur für kleine QR-Codes)
• Muster (z.B. mithilfe von jQuery) aus einem <input>- oder einem <script>-Element lesen
• Muster durch JavaScript in eine Sketch eintragen lassen

Da sich diese Seite vor allem an Processing-Anfänger richtet, werden hier nur die beiden erstgenannten Methoden vorgestellt.

Eine Anleitung erklärt Ihnen die Bedienung der Seiten in diesem Web-Auftritt, in den Einstellungen können Sie deren Verhalten anpassen.

Erzeugung eines QR-Code-Musters für Processing

Mithilfe des folgenden Formulares können Sie ein QR-Code-Muster für einen gegebenen Text erzeugen und wahlweise als Array-Literal übernehmen oder als JSON-Datei auf Ihren Rechner herunterladen.

Verwendung als Array-Literal

Am Beispiel einer kleinen "Sketch", die das QR-Code-Muster einfach nur unverfälscht anzeigt, soll gezeigt werden, wie man das Muster als Array-Literal einsetzt:

int[][] ModuleArray = new int[][] {
  insert your array literal here
};

final int ScreenSize     = 512;                  // width and height of screen
final int minBorderWidth = 40;           // min width of border around QR code

void setup () {
  size(512,512); // ScreenSize,ScreenSize
  background(255);
  fill(0);

  int QRCodeSize = ModuleArray.length;
  int ModuleSize = max(1,floor((ScreenSize-2*minBorderWidth)/QRCodeSize));

  int xOffset = floor((ScreenSize-QRCodeSize*ModuleSize)/2);
  int yOffset = xOffset;

  for (int y = 0; y < QRCodeSize; y++) {
    for (int x = 0; x < QRCodeSize; x++) {
      if (ModuleArray[y][x] > 0) {
        rect(xOffset+x*ModuleSize,yOffset+y*ModuleSize, ModuleSize,ModuleSize);
      }
    }
  }

  noLoop();
}

Einlesen aus einer JSON-Datei

Das Lesen eines Musters aus einer JSON-Datei ist ein wenig aufwändiger - außerdem muss die Datei "QR-Code.json" im selben Verzeichnis liegen, in dem auch die Sketch selber gespeichert wurde.

Das folgende Beispiel gibt das QR-Code-Muster einfach nur unverfälscht aus:

final int ScreenSize     = 512;                  // width and height of screen
final int minBorderWidth = 40;           // min width of border around QR code

int[][] ModuleArray;

int[][] loadedQRCodePattern () {
  JSONArray ModuleArray = loadJSONArray("QR-Code.json");
  int       RowCount    = ModuleArray.size();

  int[][] Result = new int[RowCount][];
    for (int y = 0; y < RowCount; y++) {
      Result[y] = ModuleArray.getJSONArray(y).getIntArray();
    }
  return Result;
}

void setup () {
  size(512,512); // ScreenSize,ScreenSize
  background(255);
  fill(0);

  ModuleArray = loadedQRCodePattern();

  int QRCodeSize = ModuleArray.length;
  int ModuleSize = max(1,floor((ScreenSize-2*minBorderWidth)/QRCodeSize));

  int xOffset = floor((ScreenSize-QRCodeSize*ModuleSize)/2);
  int yOffset = xOffset;

  for (int y = 0; y < QRCodeSize; y++) {
    for (int x = 0; x < QRCodeSize; x++) {
      if (ModuleArray[y][x] > 0) {
        rect(xOffset+x*ModuleSize,yOffset+y*ModuleSize, ModuleSize,ModuleSize);
      }
    }
  }

  noLoop();
}