HarmonyOS Next 利用Core Vision Kit文本识别原创

第一小趴菜

发布于 2024-11-30 19:30

3175浏览

1收藏

前言

Core Vision Kit（基础视觉服务）是机器视觉相关的基础能力，例如通用文字识别（即OCR，Optical Character Recognition，也称为光学字符识别）、人脸检测、人脸比对以及主体分割等能力。

步骤

1.创建一个ImageOCRUtil类

创建一个ImageOCRUtil类，用于封装OCR相关功能。

import { textRecognition } from '@kit.CoreVisionKit';
export class ImageOCRUtil {}
export default new ImageOCRUtil();
1.
2.
3.

我们要在ImageOCRUtil中完成文字识别功能。我们构建一个recognizeText方法，其中其中PixelMap为图像像素类，用于读取或写入图像数据以及获取图像信息。

export class ImageOCRUtil {
  /**
   * 文字识别
   * 
   * @param image 图片源数据
   * @param resultCallback 结果返回
   * @returns
   */
  async recognizeText(image:  PixelMap | undefined, resultCallback: Function) {
    if (!image || image === undefined) {
      hilog.error(0x0000, 'OCR', 'the image is not existed');
      return;
    }
 
    let visionInfo: textRecognition.VisionInfo = {
      pixelMap: image
    };
 
    let textConfiguration: textRecognition.TextRecognitionConfiguration = {
      isDirectionDetectionSupported: false
    };
 
    textRecognition.recognizeText(visionInfo, textConfiguration, (error: BusinessError, data: textRecognition.TextRecognitionResult) => {
      // 识别成功，获取结果
      if (error.code == 0) {
        let recognitionRes = data.toString();
        // 将识别结果返回
        resultCallback(recognitionRes);
      }
    });
  }
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.

在ImageOCRUtil中，我们用Core File Kit，来选择图片的存储路径，将其加载到我们的页面中，从而实现识别文本

import { picker } from '@kit.CoreFileKit';
 
openAlbum(): Promise<string> {
    return new Promise<string>((resolve, reject) => {
      let photoPicker = new picker.PhotoViewPicker;
      photoPicker.select({
        MIMEType: picker.PhotoViewMIMETypes.IMAGE_TYPE,
        maxSelectNumber: 1
      }).then((res: picker.PhotoSelectResult) => {
        resolve(res.photoUris[0]);
      }).catch((err: BusinessError) => {
        hilog.error(0x0000, "OCR", `Failed to get photo uri, code: ${err.code}, message: ${err.message}`)
        resolve('')
      })
    })
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.

import { image } from '@kit.ImageKit'
import { hilog } from '@kit.PerformanceAnalysisKit';
import ImageOCRUtil from '../common/utils/ImageOCRUtil';
import CommonUtils from '../common/utils/CommonUtils';
import { fileIo } from '@kit.CoreFileKit';
 
@Entry
@Component
struct Index {
  private imageSource: image.ImageSource | undefined = undefined;
  @State selectedImage: PixelMap | undefined = undefined;
  @State dataValues: string = '';
 
  build() {
    Column() {
      // 我们的图片
      Image(this.selectedImage)
        .objectFit(ImageFit.Fill)
        .height('60%')
 
      // 我们识别到的内容
      Text(this.dataValues)
        .copyOption(CopyOptions.LocalDevice)
        .height('15%')
        .width('60%')
        .margin(10)
 
      // 选择图片的按钮
      Button('选择图片')
        .type(ButtonType.Capsule)
        .fontColor(Color.White)
        .width('80%')
        .margin(10)
        .onClick(() => {
          this.selectImage();
        })
 
      Button('开始识别')
        .type(ButtonType.Capsule)
        .fontColor(Color.White)
        .alignSelf(ItemAlign.Center)
        .width('80%')
        .margin(10)
        .onClick(() => {
            // 开始识别的逻辑
          });
        })
    }
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.Center)
  }
 
  private async selectImage() {
    let uri = await ImageOCRUtil.openAlbum();
    if (uri === undefined) {
      hilog.error(0x0000, 'OCR', 'Failed to get the uri of photo.')
      return;
    }
 
    this.loadImage(uri);
  }
 
  loadImage(path: string) {
    setTimeout(async () => {
      let fileSource = await fileIo.open(path, fileIo.OpenMode.READ_ONLY);
      this.imageSource = image.createImageSource(fileSource.fd);
      this.selectedImage = await this.imageSource.createPixelMap();
    })
  }
 
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.

点击开始识别后，我们就可以通过ImageOCRUtil中的recognizeText，通过回调显示我们识别的结果，然后我们要释放内存，对imageSource和selectedImage进行release()操作

ImageOCRUtil.recognizeText(this.selectedImage, (content: string) => {
  if (!CommonUtils.isEmpty(content)) {
    this.dataValues = content;
  }
 
  this.imageSource?.release();
  this.selectedImage?.release();
});
1.
2.
3.
4.
5.
6.
7.
8.

©著作权归作者所有，如需转载，请注明出处，否则将追究法律责任

分类

标签