适用场景

通用文字识别,是通过拍照、扫描等光学输入方式,将各种票据、卡证、表格、报刊、书籍等印刷品文字转化为图像信息,再利用文字识别技术将图像信息转化为计算机等设备可以使用的字符信息的技术。

  • 可以对文档翻拍、街景翻拍等图片进行文字检测和识别,也可以集成于其他应用中,提供文字检测、识别的功能,并根据识别结果提供翻译、搜索等相关服务。
  • 可以处理来自相机、图库等多种来源的图像数据,提供一个自动检测文本、识别图像中文本位置以及文本内容功能的开放能力。
  • 支持特定角度范围内的文本倾斜、拍摄角度倾斜、复杂光照条件以及复杂文本背景等场景的文字识别。

效果如下图所示:

在这里插入图片描述

  1. 在使用通用文字识别时,将实现文字识别的相关的类添加至工程。

    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';
    
  2. 简单配置页面的布局,并在Button组件添加点击事件,拉起图库,选择图片。

    Button('选择图片')
      .type(ButtonType.Capsule)
      .fontColor(Color.White)
      .alignSelf(ItemAlign.Center)
      .width('80%')
      .margin(10)
      .onClick(() => {
        // 拉起图库,获取图片资源
        void this.selectImage();
      })
    
  3. 通过图库获取图片资源,将图片转换为PixelMap,并添加初始化和释放方法。

    async aboutToAppear(): Promise<void> {
      const initResult = await textRecognition.init();
      hilog.info(0x0000, 'OCRDemo', `OCR service initialization result:${initResult}`);
    }
    
    async aboutToDisappear(): Promise<void> {
      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 async openPhoto(): Promise<string> {
      return new Promise<string>((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)
    }
    

    代码逻辑走读:

    1. 初始化OCR服务
      • 调用textRecognition.init()异步初始化OCR服务,并通过hilog.info记录初始化结果。
    2. 释放OCR服务
      • 在组件即将消失时,调用textRecognition.release()异步释放OCR服务,并通过hilog.info记录释放成功信息。
    3. 选择图片
      • 定义selectImage方法,用于从设备中选择图片。
      • 调用openPhoto()方法获取图片的URI,如果获取失败则记录错误日志并返回。
      • 如果成功获取到URI,则调用loadImage方法加载图片。
    4. 打开图片选择器
      • 定义openPhoto方法,返回一个Promise对象,用于异步获取图片的URI。
      • 创建photoAccessHelper.PhotoViewPicker实例,调用select方法选择图片。
      • 如果选择成功,返回第一个图片的URI;如果失败,记录错误日志并返回空字符串。
    5. 加载图片
      • 定义loadImage方法,用于加载指定URI的图片到内存中。
      • 使用setTimeout延迟100毫秒后执行图片加载操作,确保图片选择操作完成。
      • 通过fileIo.open打开文件,创建image.ImageSource实例,然后调用createPixelMap方法生成图片数据。
  4. 实例化VisionInfo对象,并传入待检测图片的PixelMap。

    VisionInfo为待OCR检测识别的入参项,目前仅支持PixelMap类型的视觉信息。

    let visionInfo: textRecognition.VisionInfo = {  pixelMap: this.chooseImage};
    
  5. 配置通用文本识别的配置项TextRecognitionConfiguration,用于配置是否支持朝向检测。

    let textConfiguration: textRecognition.TextRecognitionConfiguration = {  isDirectionDetectionSupported: false};
    
  6. 调用textRecognition的recognizeText接口,对识别到的结果进行处理。

    当调用成功时,获取文字识别的结果;调用失败时,将返回对应错误码。

    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}`;
      });
    

开发实例

点击按钮,识别一张图片的文字内容,并通过日志打印。

Index.ets

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 = '';

  async aboutToAppear(): Promise<void> {
    const initResult = await textRecognition.init();
    hilog.info(0x0000, 'OCRDemo', `OCR service initialization result:${initResult}`);
  }

  async aboutToDisappear(): Promise<void> {
    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(() => {
          // 拉起图库,获取图片资源
          void this.selectImage();
        })

      Button('开始识别')
        .type(ButtonType.Capsule)
        .fontColor(Color.White)
        .alignSelf(ItemAlign.Center)
        .width('80%')
        .margin(10)
        .onClick(() => {
          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);
  }

  private async openPhoto(): Promise<string> {
    return new Promise<string>((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 () => {
      try {
        let fileSource = await fileIo.open(name, fileIo.OpenMode.READ_ONLY);
        this.imageSource = image.createImageSource(fileSource.fd);
        this.chooseImage = await this.imageSource.createPixelMap();
        await fileIo.close(fileSource);
      } catch (error) {
        hilog.error(0x0000, 'OCRDemo', `Failed to open file. Error: ${error}`);
      }
    }, 100)
  }
}

代码逻辑走读:

  1. 初始化和导入模块
    • 导入了多个模块,包括文本识别、图像处理、日志记录、文件操作和媒体库访问等。
  2. 组件定义
    • 使用@Entry@Component装饰器定义了一个名为Index的组件,该组件包含状态变量imageSourcechooseImagedataValues
  3. 生命周期方法
    • aboutToAppear方法在组件即将显示时调用,用于初始化文本识别服务并记录日志。
    • aboutToDisappear方法在组件即将消失时调用,用于释放文本识别服务并记录日志。
  4. 界面构建
    • 使用Column布局组件构建界面,包含两个Button和一个Image组件。
    • 两个按钮分别用于选择图片和开始识别,点击按钮会触发相应的事件处理函数。
  5. 文本识别功能
    • textRecognitionTest方法用于执行文本识别,首先检查是否选择了图片,如果没有则返回。
    • 使用textRecognition.recognizeText方法进行文本识别,识别成功后将结果更新到dataValues状态中。
  6. 图片选择功能
    • selectImage方法用于选择图片,调用openPhoto方法获取图片的URI。
    • openPhoto方法使用photoAccessHelper.PhotoViewPicker选择图片并返回URI。
  7. 图片加载功能
    • loadImage方法用于加载选中的图片,通过文件描述符创建图像源并生成像素图。
Logo

作为“人工智能6S店”的官方数字引擎,为AI开发者与企业提供一个覆盖软硬件全栈、一站式门户。

更多推荐