HarmonyOS NEXT AI基础视觉服务-文字识别

案例描述

这是一个基于AI基础视觉服务实现的文字识别案例,通过调用设备相机拍摄照片后识别图片中的文字内容。

实现步骤:

1. 模块导入

typescript 复制代码
// 导入功能模块
import { camera, cameraPicker } from '@kit.CameraKit';
import { fileIo } from '@kit.CoreFileKit';
import image from '@ohos.multimedia.image';
import { textRecognition } from '@kit.CoreVisionKit';

2. 相机调用与图片获取

typescript 复制代码
// 创建相机选择器实例
const res = await cameraPicker.pick(getContext(), [
  cameraPicker.PickerMediaType.PHOTO
], {
  cameraPosition: camera.CameraPosition.CAMERA_POSITION_BACK
});

// 获取拍摄的图片URI
const imageUri = res.resultUri;

3. 图像处理流程

typescript 复制代码
// 将图片转换为可识别的像素图
const fileSource = await fileIo.open(imageUri, fileIo.OpenMode.READ_ONLY);
const imageSource = image.createImageSource(fileSource.fd);
const pixelMap = await imageSource.createPixelMap();

4. 文字识别核心实现

typescript 复制代码
// 配置视觉识别参数
let visionInfo: textRecognition.VisionInfo = {
  pixelMap: pixelMap
};

// 执行文字识别并获取结果
const recognitionResult = await textRecognition.recognizeText(visionInfo);
this.text = recognitionResult.value;

5. 界面构建与交互

typescript 复制代码
@Entry
@Component
struct TextRecognition {
  @State text: string = '';

  // 按钮点击事件处理
  async openCamera() {
    // 整合上述步骤的完整调用逻辑
  }

  build() {
    Column() {
      Button('拍照 文字识别')
        .onClick(() => this.openCamera())
      
      Text(this.text)
        .fontSize(20)
        .margin(10)
    }
    .padding(20)
  }
}

2. 完整业务逻辑

整合各功能模块的完整调用流程

总结梳理:

核心点

  1. 相机调用需设备权限与硬件支持
  2. 图像转换确保兼容不同格式图片
  3. 文字识别接口返回结构化识别结果

完整代码

typescript 复制代码
// 原始代码保持完整,仅添加说明注释
import { camera, cameraPicker } from '@kit.CameraKit';
import { fileIo } from '@kit.CoreFileKit';
import image from '@ohos.multimedia.image';
import { textRecognition } from '@kit.CoreVisionKit';

@Entry
@Component
struct TextRecognition {
  @State text: string = '';

  // 主功能方法:整合相机调用与文字识别
  async openCamera() {
    // 步骤1:调用相机拍摄
    const res = await cameraPicker.pick(getContext(), [cameraPicker.PickerMediaType.PHOTO], {
      cameraPosition: camera.CameraPosition.CAMERA_POSITION_BACK
    })

    // 步骤2:检查OCR能力可用性
// 使用canIUse接口检测设备是否支持文字识别能力
    if (canIUse('SystemCapability.AI.OCR.TextRecognition')) {
      // 步骤3:处理图像文件
      const fileSource = await fileIo.open(res.resultUri, fileIo.OpenMode.READ_ONLY);
      const imageSource = image.createImageSource(fileSource.fd);
      const chooseImage = await imageSource.createPixelMap();

      // 步骤4:执行文字识别
      let visionInfo: textRecognition.VisionInfo = {
        pixelMap: chooseImage
      };
      const data = await textRecognition.recognizeText(visionInfo);
      
      // 更新识别结果到界面
      this.text = data.value
    }
  }

  // UI布局
  build() {
    Column() {
      Button('拍照 文字识别')
        .onClick(() => {
          this.openCamera()
        })
      
      Text(this.text)
        .fontSize(20)
        .margin(10)
    }
    .height('100%')
    .width('100%')
  }
}
相关推荐
SuperHeroWu71 天前
如何判断应用在鸿蒙卓易通或者出境易环境下?
华为·harmonyos
大雷神1 天前
HarmonyOS APP<玩转React>开源教程十五:首页完整实现
react.js·开源·harmonyos
云和数据.ChenGuang1 天前
鸿蒙智联,极智共生:HarmonyOS与MiniMax智能体的融合新纪元
华为·harmonyos·鸿蒙
不爱吃糖的程序媛1 天前
已有 Flutter 应用适配鸿蒙平台指导文档
flutter·华为·harmonyos
大雷神1 天前
HarmonyOS APP<玩转React>开源教程十六:课程列表页面
harmonyos
弓.长.1 天前
ReactNative for OpenHarmony项目鸿蒙化三方库:react-native-video — 视频播放组件
react native·音视频·harmonyos
坚果派·白晓明1 天前
在 Ubuntu 中搭建鸿蒙 PC 三方库交叉编译构建开发环境
ubuntu·华为·harmonyos
弓.长.1 天前
ReactNative for OpenHarmony项目鸿蒙化三方库:react-native-webview — 网页渲染组件
react native·react.js·harmonyos
UnicornDev1 天前
【HarmonyOS 6】今日统计卡片实战:运动记录数据概览
华为·harmonyos·arkts·鸿蒙·鸿蒙系统
前端不太难2 天前
如何设计 AI Native 鸿蒙应用架构
人工智能·架构·harmonyos