Schrittweise Erstellung eines QR-Codes
(nayuki.io)Schrittweiser Prozess zur QR-Code-Erstellung
Diese JavaScript-Demoanwendung visualisiert detailliert den Prozess, wie eine Textzeichenfolge in ein QR-Code-Barcodesymbol codiert wird. Der Inhalt dieser Seite erklärt und begründet, wie eine QR-Code-Generatorbibliothek intern arbeitet.
Benutzereingabe
- Textzeichenfolge: "Hello world"
- Fehlerkorrekturstufe: niedrig, mittel, Quartil, hoch
- Minimale Version erzwingen: zwischen 1 und 40
- Maskenmuster erzwingen: automatisch (-1) oder manuell (0 bis 7)
QR-Code-Ausgabe
Schrittweiser Prozess
0. Analyse der Unicode-Zeichen
- Anzahl der Codepoints der eingegebenen Textzeichenfolge: 17
- Details zu jedem Zeichen:
- Index, Zeichen, Unicode-Codepoint, ob eine Codierung im numerischen Modus, alphanumerischen Modus, Byte-Modus oder Kanji-Modus möglich ist
1. Erzeugung von Datensegmenten
- Jedes Zeichen in Bits umwandeln
- Im Byte-Modus erzeugen Zeichen 8, 16, 24 oder 32 Bit
- Das erzeugte einzelne Segment:
- Modus: Byte
- Anzahl: 17 Byte
- Daten: 136 Bit Länge
2. An die Versionsnummer anpassen
- Gesamte Bitlänge, die zur Darstellung der Segmentliste erforderlich ist
- Kapazität der QR-Code-Daten-Codewords je nach Version und Fehlerkorrekturstufe
3. Segmente verketten, Padding hinzufügen und Codewords erzeugen
- Verschiedene Bitzeichenfolgen kombinieren
- Segmentmodus, Zeichenanzahl, Daten, Terminator, Bit-Padding, Byte-Padding
4. In Blöcke aufteilen, ECC hinzufügen und interleaven
- Statistiken für alle Blöcke
- Daten-Codewords in kurze und lange Blöcke aufteilen, dann ECC-Codewords berechnen und hinzufügen
5. Feste Muster zeichnen
- Horizontale und vertikale Timing-Muster zeichnen
- Finder-Muster in drei Ecken zeichnen
- Das Raster der Ausrichtungsmuster zeichnen
- Temporäre Formatbits zeichnen
- Versionsinformationsblöcke zeichnen
6. Codewords und Restbits zeichnen
- Einen Zickzack-Scan berechnen, um alle noch nicht gefüllten Module zu besuchen
- Daten-/ECC-Module entsprechend der Zickzack-Scan-Reihenfolge und den Bitwerten der Codewords zeichnen
7. Anwenden jeder Maske testen
- Maskenmuster anwenden
- Masken-XOR auf Daten-, ECC- und Restmodule anwenden
- Tatsächliche Formatbits zeichnen
8. Strafmuster finden
- Horizontale und vertikale Folgen von Modulen derselben Farbe
- 2×2-Boxen aus Modulen derselben Farbe
- Horizontale und vertikale Finder-Muster
- Gleichgewicht von dunklen/hellen Modulen
9. Strafpunkte berechnen, optimale Maske auswählen
- Methode zur Berechnung der Strafpunkte
- Niedrigste Gesamtzahl an Strafpunkten: Maskenmuster 3
Zusätzliche Informationen
- Links zu Wikipedia und weiteren Materialien zum QR-Code-Design
Der TypeScript-Quellcode und der kompilierte JavaScript-Code dieser Webanwendung können eingesehen werden.
1 Kommentare
Hacker-News-Kommentare
Schade, dass in Online-Erklärungen zu QR-Codes die Berechnung der Reed-Solomon-Fehlercodes oft ausgelassen wird
Es gibt ein Veritasium-Video zu QR-Codes: "I used to hate QR codes. But they're actually genius"
Das Feedback, das der Autor erhält, ist unterhaltsam
Ich würde auch gern eine ähnliche Erklärung zu einem QR-Code-Decoder sehen
Ich habe einmal eine QR-Code-Implementierung in Rust erstellt
Es ist eine gute Praxis, im Artikeltitel das Jahr zu kennzeichnen (in diesem Fall 2018)
Zu lernen, wie QR-Codes funktionieren, stand schon lange auf meiner To-do-Liste, und dies war eine gute Einführung
Ich wollte schnell einen QR-Code erstellen, hatte aber wegen werbelastiger Websites und Seiten, bei denen man sich „zur Nutzung registrieren“ muss, Schwierigkeiten
Man könnte zwar mehr Optionen hinzufügen, aber ich denke, die meisten Nutzer werden sie nicht brauchen
Jetzt, da ich weiß, wie QR-Codes funktionieren, kann ich sie sogar in SQL-Abfragen verwenden