一、引言二维码QR CodeQuick Response Code是现代社会最广泛使用的信息载体之一。从扫码支付到健康码从产品溯源到电子票务二维码无处不在。标准的 QR Code 是一种复杂的编码系统涉及纠错码、掩码、数据分段、版本选择等技术。本文实现的简化版本虽然不是一个符合 ISO/IEC 18004 标准的 QR 码生成器但它演示了二维码最核心的视觉结构——定位图案和数据矩阵的排列。二、QR Code 结构解析2.1 标准 QR Code 的组成┌─────────────┬───────────┐│ 定位图案 │ ││ ┌───┐ │ 数据 ││ │ ■ │ │ 矩阵 ││ └───┘ │ │├─────────────┤ ││ 数据区域 │ ││ │ 定位图案 │└─────────────┴─────┬─────┘一个标准的 QR Code 由以下部分组成定位图案Finder Pattern位于左上、右上、左下三个角落的 7×7 回形图案用于帮助扫描器定位二维码的方向和位置数据矩阵经过 Reed-Solomon 纠错编码后的二进制数据时序图案Timing Pattern用于确定模块尺寸的辅助线空白区域Quiet Zone二维码四周至少 4 个模块宽的白边2.2 简化实现本文的实现仅模拟了定位图案和基础数据矩阵的排列不包含纠错编码和数据压缩size 21; // 版本 1 的 QR Code 为 21×21 模块三、定位图案的绘制3.1 3-重叠回形图案每个定位图案是一个 7×7 的黑白回形结构■■■■■■■■■□□□□□□■■□■■■■□■■□■□□■□■■□■■■■□■■□□□□□□■■■■■■■■■在代码中使用双循环绘制drawFinderPattern(matrix: string[][], startRow: number, startCol: number) {for (let r 0; r 7; r) {for (let c 0; c 7; c) {if (r 0 || r 6 || c 0 || c 6) {matrix[startRow r][startCol c] ‘1’; // 外框} else if ((r 2 r 4) (c 2 c 4)) {matrix[startRow r][startCol c] ‘1’; // 中心方块} else {matrix[startRow r][startCol c] ‘0’; // 空白}}}}四、数据编码4.1 文本到二进制let dataBits: string ‘’;for (let i 0; i text.length; i) {let code text.charCodeAt(i);dataBits code.toString(2).padStart(8, ‘0’);}将输入字符串中每个字符的 ASCII 码转换为 8 位二进制拼接成一个二进制字符串。4.2 填充到数据区域for (let r 4; r size - 4; r) {for (let c 4; c size - 4; c) {// 跳过定位图案区域if ((r 8 c 8) || (r 8 c size - 8) || (r size - 8 c 8)) continue;if ((r c) % 2 0) {matrix[r][c] dataBits[bitIdx % dataBits.length];bitIdx;} else if ((r * c) % 7 0) {matrix[r][c] ‘1’;}}}数据位通过交替模式填充到定位图案之间的区域形成视觉上分散的黑白点阵。五、UI 渲染ForEach(this.qrData, (row: string[]) {Row({ space: 0 }) {ForEach(row, (cell: string) {Text(‘’).width(10).height(10).backgroundColor(cell ‘1’ ? ‘#000000’ : ‘#FFFFFF’)})}})每个模块渲染为一个 10×10 像素的色块黑色代表 1白色代表 0。六、总结本文实现的简化二维码生成器虽然不能替代标准的 QR Code 库但它清晰地展示了二维码的核心结构定位图案 数据矩阵。理解这个结构对于后续学习和使用标准的 QR Code 编解码库非常有帮助。在实际开发中建议直接使用 ohos.multimedia.image 或图像操作库来生成符合标准的 QR Code。
