二维码生成

生成二维码

import { Constants, ToolBarTheme, TopToolBar } from "@common/basic"
import { BarcodeFormat, BitMatrix, EncodeHintType, MultiFormatWriter } from "@ohos/zxing";
import { HashMap } from "@kit.ArkTS";
import { image } from "@kit.ImageKit";
import { Logger } from "@hzw/logger";

const TAG = "[LiveQRCodePage]";

@Component
export default struct LiveQRCodePage {
  @StorageLink('liveQRCode') liveQRCode: string = '';
  @State qrcodeImage: PixelMap | null = null;
  @Consume('pageStack') pageStack: NavPathStack;

  async aboutToAppear() {
    try {
      // 生成二维码
      let size = 500;
      let hints: Map<EncodeHintType, Object> = new Map<EncodeHintType, Object>();
      // hints.set(EncodeHintType.CHARACTER_SET, "utf-8");
      hints.set(EncodeHintType.MARGIN, 0);
      let matrix: BitMatrix = new MultiFormatWriter().encode(this.liveQRCode, BarcodeFormat.QR_CODE, size, size, hints);
      // 创建像素数据
      let buffer: ArrayBuffer = new ArrayBuffer(size * size * 4); // ARGB_8888 每个像素4字节
      let data: Uint8Array = new Uint8Array(buffer);

      for (let y: number = 0; y < size; y++) {
        for (let x: number = 0; x < size; x++) {
          let index: number = (y * size + x) * 4;

          if (matrix.get(x, y)) {
            // 黑色像素 - ARGB
            data[index] = 0; // B
            data[index + 1] = 0; // G
            data[index + 2] = 0; // R
            data[index + 3] = 255; // A
          } else {
            // 白色像素
            data[index] = 255; // B
            data[index + 1] = 255; // G
            data[index + 2] = 255; // R
            data[index + 3] = 255; // A
          }
        }
      }

      // 生成PixelMap
      let initialOptions: image.InitializationOptions = {
        size: { height: size, width: size },
        pixelFormat: image.PixelMapFormat.RGBA_8888
      };

      this.qrcodeImage = await image.createPixelMap(buffer, initialOptions);
    } catch (e) {
      Logger.e(TAG, "initQRCodeImage error:" + (e as Error))
    }

  }

  build() {
    NavDestination() {
      TopToolBar({ pageTitle: $r('app.string.scan_qr_code'), theme: ToolBarTheme.WHITE ,
      backAction: () => {
        this.pageStack.clear();
      }})

      Column(){
        Blank()

        Image(this.qrcodeImage ?? "")
          .width(Constants.FULL_WIDTH)
          .objectFit(ImageFit.Contain)
          .padding(10)

        Blank()

        Text($r('app.string.live_platform_hint7'))
          .textAlign(TextAlign.Center)
          .fontColor('#E41A12')
          .fontSize(13)
          .margin(5)

        Text($r('app.string.stop_live_streaming'))
          .width("80%")
          .height(46)
          .backgroundColor('#E41A12')
          .textAlign(TextAlign.Center)
          .fontColor('#FFFFFF')
          .fontSize(18)
          .margin({ bottom: 60})
          .fontWeight(FontWeight.Bold)
          .borderRadius(26)
          .onClick(() => {
            this.liveQRCode = "";
            this.pageStack.clear();
          })

      }
      .width(Constants.FULL_WIDTH)
      .layoutWeight(1)
    }
    .onBackPressed(() => {
      this.pageStack.clear();
      return false
    })
    .width(Constants.FULL_WIDTH)
    .height(Constants.FULL_HEIGHT)
    .mode(NavDestinationMode.STANDARD).hideTitleBar(true)
  }
}