HarmonyOS NEXT 技术实践-基于基础视觉服务实现骨骼点识别

news2025/4/27 4:11:45

本示例展示了如何在HarmonyOS Next中实现基于基础视觉服务的骨骼点识别功能。骨骼点识别是计算机视觉中的一项重要技术，广泛应用于运动分析、健身监控和增强现实等领域。通过使用HarmonyOS Next提供的视觉API，开发者能够轻松地对人物图像进行骨骼点检测，并返回准确的骨骼点信息。本文将详细介绍项目的实现过程，包括如何调用骨骼点检测API、设计应用界面，以及如何展示识别结果。通过本示例，开发者将深入了解如何在HarmonyOS Next环境中集成视觉识别技术，并实现图像中的骨骼点自动识别和分析功能。
在这里插入图片描述

一、项目背景与目标

1. 框架介绍

HarmonyOS Next提供了一整套的视觉服务框架，使开发者可以轻松实现图像识别、处理等功能。特别是基础视觉服务，它为开发者提供了丰富的API接口，支持包括骨骼点识别、物体检测、人脸识别等多种图像分析任务。

在智能设备和应用中，骨骼点识别功能被广泛应用于运动分析、健身跟踪、虚拟人物建模等领域。目前，HarmonyOS Next的骨骼点识别功能支持17个关键点的识别，具体为鼻子，左右眼，左右耳，左右肩，左右肘、左右手腕、左右髋、左右膝、左右脚踝。

在这里插入图片描述

本示例使用了 基础视觉服务 提供的 骨骼点识别 功能，结合HarmonyOS Next的开发平台，演示如何通过图像中的骨骼点检测，实现人物的骨骼结构识别和展示。开发者可以通过这个示例，掌握如何在HarmonyOS Next应用中集成并调用视觉识别API。

2. 项目目标

本项目旨在展示如何使用HarmonyOS Next基础视觉服务进行骨骼点识别，帮助开发者快速了解如何集成骨骼点识别功能。通过实现该功能，用户可以在应用中上传一张人物全身照片，系统自动识别并返回图片中的骨骼点信息。

具体目标如下：

实现骨骼点识别API的调用。
用户可以上传图片或拍照，应用识别人物骨骼点并展示。
骨骼点信息通过文本形式展示，帮助用户理解和分析图像中的人物结构。

二、项目实现

1. 项目目录结构

以下是本项目的目录结构：

├─ entry/src/main/ets
│  ├─ entryability
│  │  └─ EntryAbility.ets            // 程序入口
│  ├─ entrybackupability
│  │  └─ EntryBackupAbility.ets
│  └─ pages
│     └─ Index.ets                   // 应用主界面
└─ entry/src/main/resources          // 资源文件目录

EntryAbility.ets：程序的入口文件，负责应用初始化和界面设置。
Index.ets：应用的主界面，用户在该界面中选择图片并启动骨骼点识别。
resources目录：存放资源文件，如图片、图标等。

2. 项目实现

本示例使用的核心功能是调用骨骼点识别接口，该接口在@hms.ai.vision.skeletonDetection.d.ts中定义，开发者可以通过该API处理上传的图片，获取人物的骨骼点信息。

导入骨骼点检测接口：
在项目中需要先导入骨骼点检测的API：
```
import { skeletonDetection } from '@hms.ai.vision.skeletonDetection';
```
选择图片或拍照：
用户通过点击按钮选择本地图库中的图片，或直接使用相机拍摄一张新的图片。

调用骨骼点识别接口：
使用process方法调用骨骼点识别服务：

skeletonDetection.process({
  uri: 'imageUri'  // 图片的路径或URI
}).then(response => {
  // 处理返回的识别结果
  console.log('骨骼点识别结果:', response);
}).catch(error => {
  console.error('骨骼点识别失败:', error);
});

展示结果：
将识别到的骨骼点信息通过文本形式显示在应用界面上，帮助用户查看识别结果。

3. 注意事项

图片格式：确保上传的图片格式符合基础视觉服务的要求，一般支持JPG、PNG等常见格式。输入图像具有合适成像的质量（建议720p以上），100px<高度<10000px，100px<宽度<10000px，高宽比例建议5:1以下，接近手机屏幕高宽比例为宜。
API限制：该骨骼点识别API可能会对处理的图片大小、分辨率等有所限制，开发者需要提前了解相关文档。
权限管理：在使用相机或访问图库时，需要合理配置相应的权限，如CAMERA和READ_EXTERNAL_STORAGE等。

三、核心代码解析

1. 导入必要的依赖

在Index.ets文件中，我们首先导入骨骼点识别API和其他必要的模块：

import { skeletonDetection } from '@hms.ai.vision.skeletonDetection';
import { ImagePicker, Camera } from '@ohos.multimedia.media';

2. 图片选择与拍照

我们实现了两个功能：从图库选择图片和直接通过相机拍摄图片。以下是从图库选择图片的代码：

const selectImage = () => {
  ImagePicker.pickImage().then(uri => {
    // 获取到图片URI
    startSkeletonDetection(uri);
  }).catch(error => {
    console.error('选择图片失败:', error);
  });
};

3. 调用骨骼点识别接口

当图片选择完成后，调用骨骼点识别接口进行处理：

const startSkeletonDetection = (imageUri) => {
  skeletonDetection.process({
    uri: imageUri
  }).then(response => {
    displaySkeletonPoints(response);
  }).catch(error => {
    console.error('骨骼点识别失败:', error);
  });
};

4. 显示识别结果

识别结果以文本的形式展示：

const displaySkeletonPoints = (response) => {
  const points = response.skeletonPoints;  // 假设API返回的结果包含骨骼点数组
  let resultText = '识别到的骨骼点信息：\n';
  points.forEach((point, index) => {
    resultText += `点${index + 1}: (${point.x}, ${point.y})\n`;
  });
  console.log(resultText);
};