539943419/miaoBlog
1
0 Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 使用jsqrgb包

Browse Source
This commit is contained in:
539943419 committed 2025-01-28 16:52:33 +08:00
1 parent 89c138cedf
commit d61b5e8a52
4 files changed
+50 -41
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

components/tools/miaoQRGBCode.vue
+30 -19
View File
@@ -6,6 +6,7 @@
<script setup lang="ts">
import QRCode from 'qrcode';
import jsqrgb from 'jsqrgb';
import { onMounted, ref, watchEffect } from 'vue';
const props = defineProps<{
@@ -36,29 +37,39 @@ const paddingData = (data: Uint8Array) => {
onMounted(() => {
watchEffect(() => {
const u8iData = props.value instanceof Uint8Array ? props.value : new TextEncoder().encode(props.value)
const padedData = paddingData(u8iData)
const data = {
r: padedData.slice(0, padedData.length / 3),
g: padedData.slice(padedData.length / 3, padedData.length / 3 * 2),
b: padedData.slice(padedData.length / 3 * 2, padedData.length)
}
const imgData = {
r: generateQRCodeCanvasData(data.r),
g: generateQRCodeCanvasData(data.g),
b: generateQRCodeCanvasData(data.b)
}
const rgbImgData = new ImageData(width.value, width.value)
for (let i = 0; i < rgbImgData.data.length; i += 4) {
rgbImgData.data[i] = imgData.r.data[i]
rgbImgData.data[i + 1] = imgData.g.data[i + 1]
rgbImgData.data[i + 2] = imgData.b.data[i + 2]
rgbImgData.data[i + 3] = 2 << 8 - 1
}
const imgData = jsqrgb.generate(u8iData, {
size: 600
})
const canvas = canvasRefRGB.value!
canvas.width = width.value
canvas.height = width.value
const ctx = canvas.getContext('2d')!
ctx.putImageData(rgbImgData, 0, 0)
ctx.putImageData(imgData, 0, 0)
return
// const padedData = paddingData(u8iData)
// const data = {
// r: padedData.slice(0, padedData.length / 3),
// g: padedData.slice(padedData.length / 3, padedData.length / 3 * 2),
// b: padedData.slice(padedData.length / 3 * 2, padedData.length)
// }
// const imgData = {
// r: generateQRCodeCanvasData(data.r),
// g: generateQRCodeCanvasData(data.g),
// b: generateQRCodeCanvasData(data.b)
// }
// const rgbImgData = new ImageData(width.value, width.value)
// for (let i = 0; i < rgbImgData.data.length; i += 4) {
// rgbImgData.data[i] = imgData.r.data[i]
// rgbImgData.data[i + 1] = imgData.g.data[i + 1]
// rgbImgData.data[i + 2] = imgData.b.data[i + 2]
// rgbImgData.data[i + 3] = 2 << 8 - 1
// }
// const canvas = canvasRefRGB.value!
// canvas.width = width.value
// canvas.height = width.value
// const ctx = canvas.getContext('2d')!
// ctx.putImageData(rgbImgData, 0, 0)
})
})