鸿蒙应用开发之基础视觉服务文字识别基础

一、工具

DevEco Studio

二、项目介绍

开发步骤
在使用通用文字识别时，将实现文字识别的相关的类添加至工程。
import { textRecognition } from '@kit.CoreVisionKit';
简单配置页面的布局，并在Button组件添加点击事件，拉起图库，选择图片。
Button('选择图片')
  .type(ButtonType.Capsule)
  .fontColor(Color.White)
  .alignSelf(ItemAlign.Center)
  .width('80%')
  .margin(10)
  .onClick(() => {
    // 拉起图库，获取图片资源
    this.selectImage();
  })
通过图库获取图片资源，将图片转换为PixelMap，并添加初始化和释放方法。
async aboutToAppear(): Promise {
  const initResult = await textRecognition.init();
  ​​​hilog.info​​​(0x0000, 'OCRDemo', ​​OCR service initialization result:${initResult}​​​);
}

async aboutToDisappear(): Promise {
  await textRecognition.release();
  ​​​hilog.info​​​(0x0000, 'OCRDemo', 'OCR service released successfully');
}

private async selectImage() {
  let uri = await this.openPhoto();
  if (uri === undefined) {
    hilog.error(0x0000, 'OCRDemo', "Failed to get uri.");
    return;
  }
  this.loadImage(uri);
}

private openPhoto(): Promise {
  return new Promise((resolve) => {
    let photoPicker: photoAccessHelper.PhotoViewPicker = new photoAccessHelper.PhotoViewPicker();
    photoPicker.select({
      MIMEType: photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE,
      maxSelectNumber: 1
    }).then((res: photoAccessHelper.PhotoSelectResult) => {
      resolve(res.photoUris[0]);
    }).catch((err: BusinessError) => {
      hilog.error(0x0000, 'OCRDemo', ​​​Failed to get photo image uri. code：${err.code}，message：${err.message}​​​);
      resolve('');
    })
  })
}

private loadImage(name: string) {
  setTimeout(async () => {
    let imageSource: image.ImageSource | undefined = undefined;
    let fileSource = await fileIo.open(name, fileIo.OpenMode.READ_ONLY);
    imageSource = image.createImageSource(fileSource.fd);
    this.chooseImage = await imageSource.createPixelMap();
  }, 100)
}
实例化VisionInfo对象，并传入待检测图片的PixelMap。
VisionInfo为待OCR检测识别的入参项，目前仅支持PixelMap类型的视觉信息。
let visionInfo: textRecognition.VisionInfo = {
  pixelMap: this.chooseImage
};
配置通用文本识别的配置项TextRecognitionConfiguration，用于配置是否支持朝向检测。
let textConfiguration: textRecognition.TextRecognitionConfiguration = {
  isDirectionDetectionSupported: false
};
调用textRecognition的recognizeText接口，对识别到的结果进行处理。
当调用成功时，获取文字识别的结果；调用失败时，将返回对应错误码。

recognizeText接口提供了三种调用形式，当前以其中一种作为示例，其他方式可参考API文档。
textRecognition.recognizeText(visionInfo, textConfiguration)
  .then((data: textRecognition.TextRecognitionResult) => {
    // 识别成功，获取对应的结果
    let recognitionString = JSON.stringify(data);
    ​​​hilog.info​​​(0x0000, 'OCRDemo', ​​Succeeded in recognizing text：${recognitionString}​​​);
    // 将结果更新到Text中显示
    this.dataValues = data.value;
  })
  .catch((error: BusinessError) => {
    hilog.error(0x0000, 'OCRDemo', ​​​Failed to recognize text. Code: ${error.code}, message: ${error.message}​​​);
    this.dataValues = ​​​Error: ${error.message}​​​;
  });
开发实例
点击按钮，识别一张图片的文字内容，并通过日志打印。
import { textRecognition } from '@kit.CoreVisionKit'
import { image } from '@kit.ImageKit';
import { hilog } from '@kit.PerformanceAnalysisKit';
import { BusinessError } from '@kit.BasicServicesKit';
import { fileIo } from '@kit.CoreFileKit';
import { photoAccessHelper } from '@kit.MediaLibraryKit';

@Entry
@Component
struct Index {
  private imageSource: image.ImageSource | undefined = undefined;
  @State chooseImage: PixelMap | undefined = undefined;
  @State dataValues: string = '';

{
    const initResult = await textRecognition.init();
    ​​​hilog.info​​​(0x0000, 'OCRDemo', ​​OCR service initialization result:${initResult}​​​);
  }

{
    await textRecognition.release();
    ​​​hilog.info​​​(0x0000, 'OCRDemo', 'OCR service released successfully');
  }

  build() {
    Column() {
      Image(this.chooseImage)
        .objectFit(ImageFit.Fill)
        .height('60%')

      Text(this.dataValues)
        .copyOption(CopyOptions.LocalDevice)
        .height('15%')
        .margin(10)
        .width('60%')

      Button('选择图片')
        .type(ButtonType.Capsule)
        .fontColor(Color.White)
        .alignSelf(ItemAlign.Center)
        .width('80%')
        .margin(10)
        .onClick(() => {
          // 拉起图库，获取图片资源
          this.selectImage();
        })

      Button('开始识别')
        .type(ButtonType.Capsule)
        .fontColor(Color.White)
        .alignSelf(ItemAlign.Center)
        .width('80%')
        .margin(10)
        .onClick(async () => {
          this.textRecognitionTest();
        })
    }
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.Center)
  }

  private textRecognitionTest() {
    if (!this.chooseImage) {
      return;
    }
    // 调用文本识别接口
    let visionInfo: textRecognition.VisionInfo = {
      pixelMap: this.chooseImage
    };
    let textConfiguration: textRecognition.TextRecognitionConfiguration = {
      isDirectionDetectionSupported: false
    };
    textRecognition.recognizeText(visionInfo, textConfiguration)
      .then((data: textRecognition.TextRecognitionResult) => {
        // 识别成功，获取对应的结果
        let recognitionString = JSON.stringify(data);
        ​​​hilog.info​​​(0x0000, 'OCRDemo', ​​Succeeded in recognizing text：${recognitionString}​​​);
        // 将结果更新到Text中显示
        this.dataValues = data.value;
      })
      .catch((error: BusinessError) => {
        hilog.error(0x0000, 'OCRDemo', ​​​Failed to recognize text. Code: ${error.code}, message: ${error.message}​​​);
        this.dataValues = ​​​Error: ${error.message}​​​;
      });
  }

  private async selectImage() {
    let uri = await this.openPhoto();
    if (uri === undefined) {
      hilog.error(0x0000, 'OCRDemo', "Failed to get uri.");
      return;
    }
    this.loadImage(uri);
  }

{
    return new Promise((resolve) => {
      let photoPicker: photoAccessHelper.PhotoViewPicker = new photoAccessHelper.PhotoViewPicker();
      photoPicker.select({
        MIMEType: photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE,
        maxSelectNumber: 1
      }).then((res: photoAccessHelper.PhotoSelectResult) => {
        resolve(res.photoUris[0]);
      }).catch((err: BusinessError) => {
        hilog.error(0x0000, 'OCRDemo', ​​​Failed to get photo image uri. Code：${err.code}，message：${err.message}​​​);
        resolve('');
      })
    })
  }

  private loadImage(name: string) {
    setTimeout(async () => {
      let fileSource = await fileIo.open(name, fileIo.OpenMode.READ_ONLY);
      this.imageSource = image.createImageSource(fileSource.fd);
      this.chooseImage = await this.imageSource.createPixelMap();
    }, 100)
  }
}