HarmonyOS开发：AI识图使用详解

目录

• 前言
• AI识图技术概述
• 关于AI识图
• 识图功能详解
• 实现AI识图
• 结束语

前言

在人工智能技术的推动下，图像识别已成为移动应用中的一项关键功能，外加上传统的软件开发加持，应用和AI的结合将是后面应用开发的趋势。而随着今年华为鸿蒙的官宣推出结合人工智能的能力，也就是HarmonyOS提供了强大的AI识图能力，让程序开发者可以轻松集成图像识别功能到自己的应用中。那么本文就来详细介绍如何在HarmonyOS应用中实现AI识图功能，包括技术选型、实现步骤和代码示例，方便大家了解学习使用。

AI识图技术概述

先来介绍一下AI识图技术，其实AI识图技术涉及图像处理和机器学习，能够识别图像中的对象、场景和活动。而在HarmonyOS中，可以通过集成华为机器学习服务来实现AI识图。AI识图是通过聚合OCR（Optical Character Recognition）、主体分割、实体识别、多目标识别等AI能力，提供场景化的文本识别、主体分割、识图搜索功能。AI识图功能主开关入口在基础控件API列表中，如果大家接受AI识图默认的交互和功能，仅需使用基础控件提供的相关使能接口打开功能开关即可。

关于AI识图

HarmonyOS中，文档配套的API配合基础控件使用，主要可以满足开发者的定制诉求，帮助完成AI识图功能交互上的细粒度控制，获取文本识别、图像分割等分析结果以便进行扩展业务的开发，目前HarmonyOS的AI识图功能支持的基础控件范围包括Image、Video、XComponent。其中，配合Image控件可完成静态图片上的识图功能，配合Video控件可完成视频播放暂停帧的识图功能，配合XComponent可完成自定义渲染等场景下的图像的识图功能。在HarmonyOS中，AI识图通常涉及以下步骤：
1.图像采集：获取图像数据，可以是实时拍摄的照片或从相册中选择的图片。
2.图像预处理：对图像进行必要的预处理，如调整大小、裁剪、旋转校正等。
3.图像识别：使用AI模型对图像进行分析，识别图像中的内容。
4.结果处理：根据识别结果执行后续操作，如显示识别结果、存储或进一步处理。

识图功能详解

接下来介绍识图功能详解，识图功能提供如下能力：

• 识别文字：用户长按文本选取文字或持续长按文本中的电话号码、邮箱、网址、地址、时间等实体，可触发对应实体的快捷操作，比如持续长按文本中的时间，可触发"新建日程"快捷操作入口。
• 识图搜索：用户抠图后可基于抠出的主体进行识图搜索，开发者也可以主动触发目标标识，触发后会识别图中的动物、植物、建筑物等目标并用相应的ICON标识，用户点击ICON也可以进行识图搜索，搜索结果会以模态窗的方式为用户呈现。
• 主体分割：用户长按主体分割，分割后用户可以完成复制，分享，全选，识图搜索等功能。
• AIButton：AIButton承载了电话号码、邮箱、网址、地址、时间等实体的显性下划线标识（点击后出现快捷操作菜单），原图翻译（系统设置语种与图片上文本语种不一致且能将图中文本翻译为系统当前设置的语种时出现），表格提取（图片中存在表格时出现）等功能特性。配置AIButton属性可见后，会对图片进行预分析，当图片中存在文本且文本区域大于图片区域的5%时AIButton才会显示。

另外，再来分享一下关于识图功能的建议指导，识图功能提供如下的建议：

• AI识图特性可帮助消费者从图片上获取更多的信息（长按抠图，长按选取文本，长按实体识别等）。建议在大图预览场景都打开此能力，大图预览场景下用户对图片中的内容会更感兴趣，此时适时的提供识图服务契合用户体验场景，同时为用户提供最佳的识图交互体验。
• AI识图特性中的AIButton与图片中是否有文本存在关联，显性的提醒用户操作文本。开启AIButton会触发图片的预分析从而导致一定的功耗开销，建议开发者充分理解自身业务场景，预估目标用户图片内容分布，兼顾用户图片浏览体验和提供更高阶AI识图功能体验的情况下按需提供AIButton露出。例如，业务本身是辅助用户高效提取图片中的文本内容，开启AIButton将会提升用户文本提取的体验。业务本身更偏向于图片编辑，也可隐藏AIButton。

实现AI识图

接下来介绍具体的AI识图实现的操作步骤，具体如下所示。

步骤1：引入类

首先，将AI识图控件相关的类添加，具体操作如下所示：

import { visionImageAnalyzer } from '@kit.VisionKit';
import { BusinessError } from '@kit.BasicServicesKit';

步骤2：初始化

接着来初始化VisionImageAnalyzerController对象，具体操作如下所示：

private visionImageAnalyzerController: visionImageAnalyzer.VisionImageAnalyzerController = new visionImageAnalyzer.VisionImageAnalyzerController();

步骤3：添加订阅事件

然后添加订阅事件，具体操作如下所示：

aboutToAppear(): void {
  this.visionImageAnalyzerController.on('imageAnalyzerVisibilityChange', (visibility: visionImageAnalyzer.ImageAnalyzerVisibility) => {

  })
  this.visionImageAnalyzerController.on('textAnalysis', (text: string) => {

  })
  this.visionImageAnalyzerController.on('selectedTextChange', (selectedText: string) => {

  })
  this.visionImageAnalyzerController.on('subjectAnalysis', (subjects: visionImageAnalyzer.Subject[]) => {

  })
  this.visionImageAnalyzerController.on('selectedSubjectsChange', (subjects: visionImageAnalyzer.Subject[]) => {

  })
  this.visionImageAnalyzerController.on('analyzerFailed', (error: BusinessError) => {

  })
}

步骤4：绑定对象

接着绑定VisionImageAnalyzerController对象，可以控制识图相关的交互，具体操作如下所示：

build() {
  Stack() {
    // 需要替换您自己的资源图片，存放在resources/base/media目录下
    Image($r('app.media.img'), {
        types: [ImageAnalyzerType.TEXT, ImageAnalyzerType.SUBJECT, ImageAnalyzerType.OBJECT_LOOKUP],
        aiController: this.visionImageAnalyzerController
      })
      .width('100%')
      .height('100%')
      .enableAnalyzer(true)
      .objectFit(ImageFit.Contain)
  }.width('100%').height('100%')
}

步骤5：取消订阅事件

最后就是取消订阅事件，具体操作如下所示：

aboutToDisappear(): void {
  this.visionImageAnalyzerController.off('imageAnalyzerVisibilityChange')
  this.visionImageAnalyzerController.off('textAnalysis')
  this.visionImageAnalyzerController.off('selectedTextChange')
  this.visionImageAnalyzerController.off('subjectAnalysis')
  this.visionImageAnalyzerController.off('selectedSubjectsChange')
  this.visionImageAnalyzerController.off('analyzerFailed')
}

最后再来分享一下AI识图示意图，具体如下所示：

结束语

众所周知，看了上面介绍的关于AI识图的使用详解，可以看到AI识图是HarmonyOS开发中的一项强大功能，它为应用带来了更多的可能性和创新空间，也是新的技术阶段的新的技术应用。通过本文的介绍，大家应该都了解了如何在HarmonyOS应用中实现AI识图功能。随着技术的不断发展和迭代，AI识图技术将在HarmonyOS生态中扮演越来越重要的角色，尤其是近两年AI的快速发展带来的便利，定能为用户带来更加丰富和便捷的体验。